JavaScript中如何中断请求

fetch

利用AbortController对象，将signal属性传递到fetch配置项中，再调用.abort即可。

const controller = new AbortController();
// 传递signal
const response = await fetch('XXX', {
        signal: controller.signal,
});

const data = await response.json();

// 中断请求
controller.abort();

XHR

获取当前请求，调用.abort方法即可

const xhr = new XMLHttpRequest();
xhr.open('GET', 'XXX');
xhr.send();

// 中断请求
xhr.abort();

axios

axios中断请求和fetch基本一样，使用AbortController对象中的abort方法即可。

const controller = new AbortController();
// 传递signal
const response = await axios.get('XXX', {
        signal: controller.signal,
});

// 中断请求
controller.abort();

axios中的CancelToken取消请求方法已被废弃 在axios 0.22.0版本后不再支持，请使用AbortController