Vue取消Axios发出的请求_vue.js_

一、前言

有的时候我们需要取消axios发出的请求，例如在退出页面时，取消掉仍然在进行的请求。

二、AbortController

mdn中AbortController的介绍。

从 v0.22.0 开始，Axios 支持以 fetch API 方式—— AbortController 取消请求：

const controller = new AbortController(); axios.get('/foo/bar', { signal: controller.signal }).then(function(response) { //... }); // 取消请求 controller.abort()

注意这里在发送请求时，额外携带了一个signal参数：

signal: controller.signal

这是AbortController实例（controller.abort()）去取消请求的标记。

三、CancelToken

您还可以使用 cancel token 取消一个请求。

• Axios 的 cancel token API 是基于被撤销 cancelable promises proposal。
• 此 API 从 v0.22.0 开始已被弃用，不应在新项目中使用。

可以使用 CancelToken.source 工厂方法创建一个 cancel token ，如下所示：

const CancelToken = axios.CancelToken; const source = CancelToken.source(); axios.get('/user/12345', { cancelToken: source.token }).catch(function (thrown) { if (axios.isCancel(thrown)) { console.log('Request canceled', thrown.message); } else { // 处理错误 } }); axios.post('/user/12345', { name: 'new name' }, { cancelToken: source.token }) // 取消请求（message 参数是可选的） source.cancel('Operation canceled by the user.');

到此这篇关于Vue取消Axios发出的请求的文章就介绍到这了,更多相关Vue Axios内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持！

提示： 本文由神整理自网络，如有侵权请联系本站删除！
本站声明：
1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持；
2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！