Axios: how to cancel request inside request interceptor properly?

问题

I want to cancel the request if there's no token so I do like this:

instance.interceptors.request.use(config => {
  if (!getToken()) {
    console.log("interceptors: no access token");
  } else {
    config.headers.Authorization = "Bearer " + getToken().accessToken;
    return config;
  }
});

But in negative scenario there's an error TypeError: Cannot read property 'cancelToken' of undefined.

回答1:

You cannot use the token inside the interceptors but instead throw Cancel

axios.interceptors.response.use(function (response) {
  throw new axios.Cancel('Operation canceled by the user.');
}, function (error) {
  return Promise.reject(error);
});

Refer to this post: https://github.com/axios/axios/issues/583

回答2:

here is the solution

import axios from 'axios';

const CancelToken = axios.CancelToken;
let cancel;

axios.interceptors.request.use((config) => {

  if (cancel) {
    cancel(); // cancel request
  }

  config.cancelToken =  new CancelToken(function executor(c)
    {
      cancel = c;
    })

  return config

}, function (error) {
  return Promise.reject(error)
});

来源：https://stackoverflow.com/questions/50461746/axios-how-to-cancel-request-inside-request-interceptor-properly