Vue中取消正在请求中的接口

vue接口请求配置中加入拦截器

// request拦截器
service.interceptors.request.use(config => {
    // console.log("sessionStorage.token:", sessionStorage.token);
    // Do something before request is sent
    // if (store.getters.token) {
    if (getToken()) {
        config.headers.Authorization = getToken(); // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行编辑
      // 让每个请求携带token--['X-Token']为自定义key 请根据实际情况自行编辑
    } else {
        config.headers.Authorization = 'Basic emhpbmVuZ3d1bGlhbndhbmc6emhpbmVuZ3d1bGlhbndhbmc='; // 增加客户端认证
    }

    // 将请求的接口添加到数组中
    config.cancelToken = new axios.CancelToken(cancel => {
        window._axiosPromiseArr.push({ cancel, id: config.id});
    });

    // console.log("request_config:", config);
    return config
}, error => {
    // Do something with request error
    Promise.reject(error)
});

// respone拦截器
service.interceptors.response.use(
    response => {
        /**
         * 下面的注释为通过response自定义code来标示请求状态，当code返回如下情况为权限有问题，登出并返回到登录页
         * 如通过xmlhttprequest 状态码标识 逻辑可写在下面error中
         */
            // console.log("respose:", response);
        const res = response.data;
        if (response.status !== 200) {
            /* Message({
               message: res.message,
               type: 'error',
               duration: 5 * 1000
             })
             return Promise.reject('error');*/
            console.log(res.message)
        } else {
            return response
        }
    },
    error => {
        const response = error.response;
        if (response === undefined) {
            /*   Message({
                 message: '服务请求超时！',
                 type: 'error',
                 duration: 5 * 1000
               })
                 return Promise.reject(error)
               */
            // console.warn('服务请求超时！');
        }
}

需要拦截的逻辑代码中写入

//遍历数组中的接口，删除请求
try {
    window._axiosPromiseArr.forEach((ele, index) => {
        // console.log("ele:", ele);
        ele.cancel(); // 路由跳转之前，清空（终止）上一个页面正在请求的内容
        // 清空请求的参数 清空请求的参数
        delete window._axiosPromiseArr[index];
    });
}
catch (e) {
    console.log(e)
}