Ajax
如果要取消请求的话,可以通过调用 XMLHttpRequest 对象上的 abort 方法来取消请求:
let xhr = new XMLHttpRequest();
xhr.open("GET", "https://developer.mozilla.org/", true);
xhr.send();
setTimeout(() => xhr.abort(), 300);
Axios
在 Axios 中,取消请求的基本思路是创建一个用于取消的标记(cancel token),并将其与特定请求关联。当需要取消请求时,我们可以使用这个标记通知 Axios 取消发送该请求。
Axios 提供了 CancelToken 类来创建取消标记。取消标记实际上是一个包含 cancel
方法的对象。以下是取消请求的一般步骤:
// 在首先需要引入相关库和模块
import axios from 'axios';
// 创建取消标记
const source = axios.CancelToken.source();
// 发送请求并关联取消标记
axios.get('/api/data', {
cancelToken: source.token
}).then(response => {
// 请求成功处理
}).catch(error => {
if (axios.isCancel(error)) {
console.log('请求被取消', error.message);
} else {
console.log('请求出错', error.message);
}
});
// 取消请求
source.cancel('请求取消的原因');
通过使用 Axios 提供的取消标记,我们可以在发送请求后随时取消请求,以避免不必要的网络流量和资源浪费。这为我们在前端开发中处理用户操作的中断提供了便利。