如何封装请求接口，过滤重复请求，优化请求性能

import Axios from 'axios'
import qs from 'qs'

/**
 * @Description: 存放当前正在请求信息
 */
const pendingRequest = new Map()

/**
 * @Description: 拼接请求唯一标识
 */
const getPendingUrl = config => {
  const { method, url, params, data, originUrl, removeRepeat } = config
  // 货品出库统计 - 阻止同一接口重复请求
  if(url === '/analyze/ship/statistics/out-goods' || removeRepeat) {
    return originUrl ? [method, originUrl].join('&') : [method, url].join('&')
  } else return [method, url, qs.stringify(params), qs.stringify(data)].join('&')
  
}

/**
 * @Description: 取消后续重复请求，只请求第一个
 */
const addPendingRequest = config => {
  const url = getPendingUrl(config)
  removePendingRequest(config)
  // console.log(pendingRequest)
  if (pendingRequest.has(url)) {
    config.cancelToken = new Axios.CancelToken(cancel => {
      cancel(url)
    })
  } else {
    config.cancelToken =
      config.cancelToken ||
      new Axios.CancelToken(cancel => {
        pendingRequest.set(url, cancel)
      })
  }
}

/**
 * @Description: 检查是否存在重复请求，若存在则取消已发的请求。
 */
const removePendingRequest = config => {
  if (config) {
    const url = getPendingUrl(config)
    // console.log(pendingRequest)
    if (pendingRequest.has(url)) {
      const cancelToken = pendingRequest.get(url)
      cancelToken && cancelToken(url)
      pendingRequest.delete(url)
    }
  }
}
export { addPendingRequest, removePendingRequest }