这篇文章主要介绍了JavaScript怎么取消请求的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇JavaScript怎么取消请求文章都会有所收获，下面我们一起来看看吧。
当请求已经发送了，可以使用 XMLHttpRequest.abort() 方法取消发送，代码示例如下：
计算
安全
数据库
网络和加速
企业服务
const xhr = new XMLHttpRequest();
xhr.open('GET', '<http://127.0.0.1:3000/api/get>', true);
xhr.send();
setTimeout(() => {
xhr.abort();
}, 1000);取消请求，readyState 会变成 XMLHttpRequest.UNSENT(0)；请求的 xhr.status 会被设为 0 ；
不如在 Chrome DevTools Network 中，看看正常请求和取消请求的对比图：
取消 Fetch 请求，需要用到 AbortController API。我们可以构造一个 controller 实例：const controller = new AbortController() , controller 它有一个只读属性 AbortController.signal，可以作为参数传入到 fetch 中，用于将控制器与获取请求相关联；
代码示例如下：
const controller = new AbortController();
void (async function () {
const response = await fetch('<http://127.0.0.1:3000/api/get>', {
signal: controller.signal,
});
const data = await response.json();
})();
setTimeout(() => {
controller.abort();
}, 1000);浏览器控制台对比图：
我们其实可以在 controller.abort() 传入“取消请求的原因”参数，然后进行 try...catch 捕获
axios 同样支持 AbortController
const controller = new AbortController();
const API_URL = '<http://127.0.0.1:3000/api/get>';
void (async function () {
const response = await axios.get(API_URL, {
signal: controller.signal,
});
const { data } = response;
})();
setTimeout(() => {
controller.abort();
}, 1000);控制台截图：
错误捕获：
注意：axios 之前用于取消请求的 CancelToken 方法已经被弃用
关于“JavaScript怎么取消请求”这篇文章的内容就介绍到这里，感谢各位的阅读！相信大家对“JavaScript怎么取消请求”知识都有一定的了解，大家如果还想学习更多知识，欢迎关注亿速云行业资讯频道。
亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
