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
相关推荐
小大宇11 分钟前
Python 集成 Conda
开发语言·python·conda
不简说20 分钟前
JS 代码技巧 vol.8 — 20 个函数式编程实战,把 if/else 拍扁的骚操作
前端·javascript·面试
还是奇怪27 分钟前
Simon Willison 用 DSPy 优化 Datasette Agent 提示词:提示工程正在变成可测试的软件工程
java·开发语言·软件工程
头茬韭菜36 分钟前
4.9 SSRF 防护 — Web 工具的出站安全与私有 IP 拦截
前端·tcp/ip·安全
Cobyte1 小时前
模板 DSL 解析器中的状态机设计
前端·javascript·vue.js
颜酱1 小时前
# 02 | 搭骨架:用 LangGraph 编排 12 步工作流(思路)
前端·人工智能·后端
颜酱1 小时前
02 | 搭骨架:用 LangGraph 编排 12 步工作流
前端·人工智能·后端
小大宇1 小时前
python flask框架 SSE流式返回、跨域、报错
开发语言·python·flask
Legendary_0082 小时前
LDR6500 设计指南:Type-C 音频快充二合一配件 PD 取电与插拔时序控制方案
c语言·开发语言·音视频
刘卓航众创芯云服务部2 小时前
Kimi K3复杂任务实测:我把团队最头疼的三个场景全跑了一遍
前端