Skip to content

阻止重复请求基本是以用户请求参数和URL做KEY放进队列里面来,在成功后销毁和没有成功之前取消 下一次同一请求(相同请求方式、相同请求地址和相同请求参数)

AXIOS

js
import axios from 'axios'
const http = axios.create()
const CancelToken = axios.CancelToken
const pending = []
let getURL = (config) => {
  return config.method === 'get' ? encodeURIComponent(config.url + JSON.stringify(config.params)) : encodeURIComponent(config.url + JSON.stringify(config.data))
}
let removePending = (ever) => {
  for (let p in pending) {
    if (pending[p].u === getURL(ever)) { //当当前请求在数组中存在时执行函数体
      pending[p].f(); //执行取消操作
      pending.splice(p, 1); //把这条记录从数组中移除
    }
  }
}
http.interceptors.request.use(config => {
  removePending(config)
  config.cancelToken = new CancelToken((c) => {
    var url = getURL(config)
    pending.push({u: url, f: c})
  })
    //do something  
  return config
}, error => {
  return Promise.reject(error)
})
http.interceptors.response.use(
    response => {
      $loading.end(true)
      removePending(response.config)
      //do something  
    }, error => { 
      return Promise.reject(error.response)
    }
)
export default http

jQuery

js
(function ($) {
    var pendingRequests = {};
    // 所有ajax请求的通用前置filter
    $.ajaxPrefilter(function (options, originalOptions, jqXHR) {

        // 不重复发送相同请求
        var key = generatePendingRequestKey(options);
        if (!pendingRequests[key]) {
            //storePendingRequest(key, jqXHR);
            pendingRequests[key] = jqXHR;
        } else {
            // or do other
            jqXHR.abort();
        }

        var complete = options.complete;
        options.complete = function (jqXHR, textStatus) {
            // clear from pending requests
            pendingRequests[key] = null;
            if ($.isFunction(complete)) {
                complete.apply(this, arguments);
            }
        };
    });

    function generatePendingRequestKey(opts) {
        var url = opts.url;
        var type = opts.type;
        var data = opts.data;
        var str = url + type;
        if (data) {
            str += data;
        }
        return str;
    }
}(jQuery));

Released under the MIT License.