axios防止重复请求

519 阅读1分钟

防止重复请求

import axios from "axios"
let service = axios.create({
  baseURL: requestUrl,
  timeout: 10e3
})
export const startPost = (function () {
  const reqRecord = new Map() // 记录已发起但未返回的请求
  return function (url, params){
    return new Promise((resolve, reject) => {
      if(reqRecord.get(url)) { return Promise.reject(`取消当前请求${url}`) }
      reqRecord.set(url, url)
      return service.post(url, params).then(res => res).finally(() => reqRecord.delete(url))
    })
  }
})()

实战测试

// 连续请求两次,第二次会被取消
this.$startPost('/app/addProject', { name:  'aaa', text:'xxx' })
this.$startPost('/app/addProject', { name:  'aaa', text:'xxx' })