admin后台--axios取消重复的请求

// 同一接口请求再次请求时取消上一次请求
// 1. 定义一个空数组 存每次请求的路径和方法 
const _cancelArr = []
export const cancelAll = () => {
  _cancelArr.filter(item => {
    item.fn()
    return false
  })
}

// axios 请求拦截器
service.interceptors.request.use(
  config => {
    if (store.getters.token) {
      if (isCheckTimeOut()) {
        store.dispatch('user/logout')
        router.push('/login')
        return Promise.reject(new Error('token超时了'))
      }
      config.headers['Authorization'] = `Bearer ${store.getters.token}`
    }

    // 3. 请求调用同样的方法时，取消上一次请求
    _cancelArr.filter(item => {
      if (item.url === config.url && item.method === config.method) {
        item.fn()
        return false
      }
      return true
    })
  // 2. 每次请求的时候把请求添加到数组中
    config.cancelToken = new Axios.CancelToken(cancel => {
      // cancel方法
      _cancelArr.push({
        url: config.url,
        method: config.method,
        fn: cancel
      })
    })
    return config
  },
  error => {
    console.log(error) // for debug
    Message({
      message: error.message,
      type: 'error',
      duration: 5 * 1000
    })
    return Promise.reject(error)
  }
)

路由切换时，取消上一个页面所有请求
import { cancelAll } from '@/utils/request'
router.beforeEach(()=>{
cancelAll()
})