如何防止重復(fù)發(fā)送ajax請(qǐng)求

const CancelToken = axios.CancelToken;const source = CancelToken.source();
axios.get('/user/12345', {  cancelToken: source.token}).catch(function (thrown) {  if (axios.isCancel(thrown)) {    console.log('Request canceled', thrown.message);  } else {    // handle error  }});
axios.post('/user/12345', {  name: 'new name'}, {  cancelToken: source.token})
// cancel the request (the message parameter is optional)source.cancel('Operation canceled by the user.');

// Expose Cancel & CancelTokenaxios.Cancel = require('./cancel/Cancel');axios.CancelToken = require('./cancel/CancelToken');axios.isCancel = require('./cancel/isCancel');

/** * Returns an object that contains a new `CancelToken` and a function that, when called, * cancels the `CancelToken`. */CancelToken.source = function source() {  var cancel;  var token = new CancelToken(function executor(c) {    cancel = c;  });  return {    token: token,    cancel: cancel  };};

/** * A `CancelToken` is an object that can be used to request cancellation of an operation. * * @class * @param {Function} executor The executor function. */function CancelToken(executor) {  if (typeof executor !== 'function') {    throw new TypeError('executor must be a function.');  }
  var resolvePromise;  this.promise = new Promise(function promiseExecutor(resolve) {    resolvePromise = resolve;  });
  var token = this;  executor(function cancel(message) {    if (token.reason) {      // Cancellation has already been requested      return;    }
    token.reason = new Cancel(message);    resolvePromise(token.reason);  });}

const CancelToken = axios.CancelToken;let cancel;
axios.get('/user/12345', {  cancelToken: new CancelToken(function executor(c) {    // An executor function receives a cancel function as a parameter    cancel = c;  })});
// cancel the requestcancel();

Axios.prototype.request = function request(config) {  ...  // Hook up interceptors middleware  var chain = [dispatchRequest, undefined];  var promise = Promise.resolve(config);
  this.interceptors.request.forEach(function unshiftRequestInterceptors(interceptor) {    chain.unshift(interceptor.fulfilled, interceptor.rejected);  });
  this.interceptors.response.forEach(function pushResponseInterceptors(interceptor) {    chain.push(interceptor.fulfilled, interceptor.rejected);  });
  while (chain.length) {    promise = promise.then(chain.shift(), chain.shift());  }
  return promise;};

Promise.resolve(config).then('request攔截器中的resolve方法', 'request攔截器中的rejected方法').then(dispatchRequest, undefined).then('response攔截器中的resolve方法', 'response攔截器中的rejected方法')

function throwIfCancellationRequested(config) {  if (config.cancelToken) {    config.cancelToken.throwIfRequested();  }}module.exports = function dispatchRequest(config) {  throwIfCancellationRequested(config);  ...  var adapter = config.adapter || defaults.adapter;  return adapter(config).then()};

CancelToken.prototype.throwIfRequested = function throwIfRequested() {  if (this.reason) {    throw this.reason;  }};

function getDefaultAdapter() {  var adapter;  if (typeof XMLHttpRequest !== 'undefined') {    // For browsers use XHR adapter    adapter = require('./adapters/xhr');  } else if (typeof process !== 'undefined' && Object.prototype.toString.call(process) === '[object process]') {    // For node use HTTP adapter    adapter = require('./adapters/http');  }  return adapter;}
var defaults = {  adapter: getDefaultAdapter()}

module.exports = function xhrAdapter(config) {  return new Promise(function dispatchXhrRequest(resolve, reject) {    ...    var request = new XMLHttpRequest();    if (config.cancelToken) {      // Handle cancellation      config.cancelToken.promise.then(function onCanceled(cancel) {        if (!request) {          return;        }
        request.abort();        reject(cancel);        // Clean up request        request = null;      });    }    // Send the request    request.send(requestData);  })}

let pendingAjax = []const fastClickMsg = '數(shù)據(jù)請(qǐng)求中，請(qǐng)稍后'const CancelToken = axios.CancelTokenconst removePendingAjax = (url, type) => {  const index = pendingAjax.findIndex(i => i.url === url)  if (index > -1) {    type === 'req' && pendingAjax[index].c(fastClickMsg)    pendingAjax.splice(index, 1)  }}
// Add a request interceptoraxios.interceptors.request.use(  function (config) {    // Do something before request is sent    const url = config.url    removePendingAjax(url, 'req')    config.cancelToken = new CancelToken(c => {      pendingAjax.push({        url,        c      })    })    return config  },  function (error) {    // Do something with request error    return Promise.reject(error)  })
// Add a response interceptoraxios.interceptors.response.use(  function (response) {    // Any status code that lie within the range of 2xx cause this function to trigger    // Do something with response data    removePendingAjax(response.config.url, 'resp')    return new Promise((resolve, reject) => {      if (+response.data.code !== 0) {        reject(new Error('network error:' + response.data.msg))      } else {        resolve(response)      }    })  },  function (error) {    // Any status codes that falls outside the range of 2xx cause this function to trigger    // Do something with response error    Message.error(error)    return Promise.reject(error)  })

let pendingAjax = []const fastClickMsg = '數(shù)據(jù)請(qǐng)求中，請(qǐng)稍后'const CancelToken = axios.CancelTokenconst removePendingAjax = (config, c) => {  const url = config.url  const index = pendingAjax.findIndex(i => i === url)  if (index > -1) {    c ? c(fastClickMsg) : pendingAjax.splice(index, 1)  } else {    c && pendingAjax.push(url)  }}
// Add a request interceptoraxios.interceptors.request.use(  function (config) {    // Do something before request is sent    config.cancelToken = new CancelToken(c => {      removePendingAjax(config, c)    })    return config  },  function (error) {    // Do something with request error    return Promise.reject(error)  })
// Add a response interceptoraxios.interceptors.response.use(  function (response) {    // Any status code that lie within the range of 2xx cause this function to trigger    // Do something with response data    removePendingAjax(response.config)    return new Promise((resolve, reject) => {      if (+response.data.code !== 0) {        reject(new Error('network error:' + response.data.msg))      } else {        resolve(response)      }    })  },  function (error) {    // Any status codes that falls outside the range of 2xx cause this function to trigger    // Do something with response error    Message.error(error)    return Promise.reject(error)  })