Axios 请求响应拦截器 每次只发送一次请求封装

javascript 复制代码
import axios from "axios";
import general from "@/utils/general";

const request =axios.create({
    baseURL:general.serverUrl
})


const requestMap =new Map() //保存每一次请求

request.interceptors.request.use(req=>{
        let oldRequest =requestMap.get(req.url) //当前请求
        if(oldRequest)//是否未响应
        { //取消上一次请求
            oldRequest.abort() //取消上次请求
            requestMap.delete(req.url) //删除对象
        }
        const coll = new AbortController()
        req.signal=coll.signal
        requestMap.set(req.url,coll)//不存在添加当前请求
    return req
},)

request.interceptors.response.use(res => {
    requestMap.delete(res.config.url)
        return res.data
    }, error => {

    if(error.code=="ERR_CANCELED")//取消后的报错自行处理
    {
        console.warn('重复的请求')
    }else{
        return Promise.reject(error)
    }

    }
)

export  default request
相关推荐
mahuifa7 分钟前
ubuntu18.04编译qt5.14.2源码
开发语言·数据库·qt
一个Potato13 分钟前
Python面试总结
开发语言·python
海天胜景26 分钟前
jqGrid冻结列错行问题,将冻结表格(悬浮表格)与 正常表格进行高度同步
前端
侧耳倾听11131 分钟前
java集合相关的api-总结
java·开发语言
贺函不是涵43 分钟前
【沉浸式求职学习day43】【Java面试题精选3】
java·开发语言·学习
xiaobin889991 小时前
matlab官方免费下载安装超详细教程2025最新matlab安装教程(MATLAB R2024b)
java·开发语言·其他·matlab
清风细雨_林木木1 小时前
解决 Tailwind CSS 代码冗余问题
前端·css
Takoony1 小时前
正则表达式r前缀使用指南
开发语言·正则表达式·r语言
HSunR1 小时前
vue3 elementplus tabs切换实现
javascript·vue.js·elementui
搏博1 小时前
WPS中代码段的识别方法及JS宏实现
开发语言·javascript·wps