axios取消请求

目录

AbortController

CancelToken deprecated

AbortController

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

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

CancelToken deprecated

你还可以使用 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.');

也可以通过传递一个 executor 函数到 CancelToken 的构造函数来创建一个 cancel token：

const CancelToken = axios.CancelToken;let cancel;axios.get('/user/12345', {  cancelToken: new CancelToken(function executor(c) {    // executor 函数接收一个 cancel 函数作为参数    cancel = c;  })});// 取消请求cancel();

注意: 可以使用同一个 cancel token 或 signal 取消多个请求。

在过渡期间，您可以使用这两种取消 API，即使是针对同一个请求：

const controller = new AbortController();const CancelToken = axios.CancelToken;const source = CancelToken.source();axios.get('/user/12345', {  cancelToken: source.token,  signal: controller.signal}).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.');// 或controller.abort(); // 不支持 message 参数