axios 重复提交

const { default: axios } = require("axios")
const qs = require('qs')
function regsoleKey(config) {
  const { method, url, params, data } = config;
  return [method, url, qs.stringify(params), qs.stringify(data)].join('&')
}
const reqQueue = new Map();
function addreqQueue(config){
    //调用生成唯一标识值函数, 生成 requestKey
    const requestKey = regsoleKey(config);
    //为每个请求创建一个专属的 CancelToken(用于取消请求)
    config.cancelToken = config.cancelToken || new axios.CancelToken((cancel)=>{
        // 判断 reqQueue 中是否含有 requestKey, 
        // 将 requestKey 与 CancelToken 以键值对的形式保存到map对象中
        if(!reqQueue.has(requestKey)){
            reqQueue.set(requestKey,cancel)
        }
    });
}
function removereqQueue(config){
  // 标识值
  const requestKey = generateReqKey(config);
  if(reqQueue.has(requestKey)){
      // 取消之前发出请求
     const cancelToken = reqQueue.get(requestKey);
     cancelToken(requestKey);
      // 从队列移除
     reqQueue.delete(requestKey);
  }
}
serviceAxios.interceptors.request.use(
    function(config) {
        removereqQueue(config); // 检查是否重复发送请求
        addreqQueue(config); //将本次请求加入请求队列
        return config
    },
    (error) => {
        return Promise.reject(error)
    }
)
serviceAxios.interceptors.request.use(
    function(config) {
        removereqQueue(config); // 检查是否重复发送请求
        addreqQueue(config); //将本次请求加入请求队列
        return config
    },
    (error) => {
        return Promise.reject(error)
    }
)

 

posted @ 2024-04-15 14:55  howhy  阅读(5)  评论(0编辑  收藏  举报