axios 取消请求后是不是还是会走response??

Question

如题，场景是短时间内只能有一个请求。
但是现在发现在短时间内发起请求的被取消后还是会走response，且为undefined

http
    .post(
      api.check.url,

      utils.header, utils.JSONFormData({
        data: data
      }),
    ) .then((response) => {
       //取消后这里还是会执行，response为undefined。
      })

Answer 1

先说解决方案：你可以使用catch来处理，具体看下方文档。

再说原因，请求被取消后，实际上是被抛出异常了，源码：

/**
 * Throws a `Cancel` if cancellation has been requested.
 */
CancelToken.prototype.throwIfRequested = function throwIfRequested() {
  if (this.reason) {
    throw this.reason;
  }
};

摘抄自文档：
Axios 的 cancel token API 基于cancelable promises proposal，它还处于第一阶段。

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
  }
});


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

Answer 2

axios内部是通过promise实现的，你说的取消是怎么个取消法，只有在state值为rejected才会走catch，否则就视为fulfilled状态，仍然也会走then方法。如果你想不走then，那么有两种方式。

1.中断ajax。

2.在添加response拦截器，在拦截器中判断如果调用了一次请求之后，就直接更改状态为rejected。

已参与了 SegmentFault 思否「问答」打卡，欢迎正在阅读的你也加入。