取消

取消请求

在 axios 调用中设置 timeout 属性可处理与响应相关超时。

在某些情况下（例如，网络连接不可用），axios 调用会受益于尽早取消连接。如果不取消，axios 调用可能会挂起，直到父代码/堆栈超时（在服务器端应用程序中可能需要几分钟）。

要终止 axios 调用，可以使用以下方法

• 信号
• cancelToken（已弃用）

组合 timeout 和取消方法（例如 signal）应涵盖与响应相关的超时和与连接相关的超时。

signal：AbortController

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

const controller = new AbortController();

axios.get('/foo/bar', {
   signal: controller.signal
}).then(function(response) {
   //...
});
// cancel the request
controller.abort()

使用最新 AbortSignal.timeout() API 的带超时示例 [nodejs 17.3+]

axios.get('/foo/bar', {
   signal: AbortSignal.timeout(5000) //Aborts request after 5 seconds
}).then(function(response) {
   //...
});

带超时帮助函数的示例

function newAbortSignal(timeoutMs) {
  const abortController = new AbortController();
  setTimeout(() => abortController.abort(), timeoutMs || 0);

  return abortController.signal;
}

axios.get('/foo/bar', {
   signal: newAbortSignal(5000) //Aborts request after 5 seconds
}).then(function(response) {
   //...
});

CancelToken 已弃用

你还可以使用取消令牌取消请求。

axios 取消令牌 API 基于已撤回的 可取消承诺提案。

此 API 自 v0.22.0 起已弃用，不应在新的项目中使用

你可以使用 CancelToken.source 工厂创建取消令牌，如下所示

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 {
    // handle error
  }
});

axios.post('/user/12345', {
  name: 'new name'
}, {
  cancelToken: source.token
})

// cancel the request (the message parameter is optional)
source.cancel('Operation canceled by the user.');

您还可以通过将执行器函数传递给 CancelToken 构造函数来创建取消令牌

const CancelToken = axios.CancelToken;
let cancel;

axios.get('/user/12345', {
  cancelToken: new CancelToken(function executor(c) {
    // An executor function receives a cancel function as a parameter
    cancel = c;
  })
});

// cancel the request
cancel();

注意：您可以使用相同的取消令牌/信号取消多个请求。

在过渡期间，即使对于相同的请求，您也可以使用两种取消 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 {
    // handle error
  }
});

axios.post('/user/12345', {
  name: 'new name'
}, {
  cancelToken: source.token
})

// cancel the request (the message parameter is optional)
source.cancel('Operation canceled by the user.');
// OR
controller.abort(); // the message parameter is not supported