vue axiosクイッククリックで複数回のリクエスト問題を提出

1230 ワード

  :     
import axios from 'axios'

let service = axios.create({
  baseUrl: '',
  timeout: 10000
})

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); //           
    }
  }
}

axios.interceptors.request.use(config => {
  let str_data = JSON.stringify(config.data || '{}');//パラメータにcancelHttpを持ち込み、複数回のリクエストを防止しない
if (str_data.indexOf("cancelHttp") > -1) {
  httpFlag = false
}else {
  removePending(config);//ajax送信前にキャンセル操作を実行します
//ここのajaxは私が要求アドレス&要求方式でつなぎ合わせた文字列を識別しています.もちろん、他の方法を選択することができます.
config.cancelToken = new cancelToken((c)=>{
  pending.push({ u: config.url + '&' + config.method, f: c });
});
}
  return config },error=> {   return Promise.reject(error) })
let httpFlag = true
axios.interceptors.response.use(response =>{
  if (httpFlag) {
    removePending(response.config)
  }  
})