axios 重复请求

先贴上代码

let pending = []; //声明一个数组用于存储每个ajax请求的取消函数和ajax标识
let cancelToken = axios.CancelToken;
let removePending = (config) => {
  for (let p in pending) {
    if (pending[p].u === config.url + '&' + config.method) { //当当前请求在数组中存在时执行函数体
      pending[p].f(); //执行取消操作
      pending.splice(p, 1); //把这条记录从数组中移除
    }
  }
}

let cutReq = (config) => {
  for (let p in pending) {
    if (pending[p].u === config.url + '&' + config.method) { //当当前请求在数组中存在时执行函数体
      return true;
    }
  }
}

//添加请求拦截器
axios.interceptors.request.use(config => {

  let flag = cutReq(config);

  if (flag === true) return null; // 当上一次相同请求未完成时,无法进行第二次相同请求
  config.cancelToken = new cancelToken((c) => {
    // 这里的ajax标识我是用请求地址&请求方式拼接的字符串,当然你可以选择其他的一些方式
    pending.push({ u: config.url + '&' + config.method, f: c });
  });

  return config;
}, error => {
  return Promise.reject(error);
});

//添加响应拦截器
axios.interceptors.response.use(res => {
  removePending(res.config);  //在一个ajax响应后再执行一下取消操作,把已经完成的请求从pending中移除
  return res;
}, error => {
  return { data: {} };
});

参考:axios重复请求

只是修改了请求部分代码。有空可以看看参考链接。他里面的方法不太适合我现在的情况。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。