Axios使用CancelToken取消重复请求

处理重复请求:没有响应完成的请求,再去请求一个相同的请求,会把之前的请求取消掉
在这里插入图片描述
新增一个cancelRequest.js文件

import axios from "axios"
const cancelTokens = {}

export const addPending = (config) => {
    const requestKey = getRequestKey(config)
    if (cancelTokens[requestKey]) {
        cancelTokens[requestKey].cancel('cancel request')
    }
    const source = axios.CancelToken.source()
    cancelTokens[requestKey] = source
    config.cancelToken = source.token
}

export const deletePending = (res) => {
    const requestKey = getRequestKey(res.config)
    if (cancelTokens[requestKey]) {
        delete cancelTokens[requestKey]
    }
}

const getRequestKey = (config = {}) => {
    return config.url + config.method + JSON.stringify(config.params, config.data)
}

request.js

import axios from "axios"
import { baseUrl } from "@/config"
import { addPending, deletePending } from "./cancelRequest"
const service = axios.create({
    baseURL: baseUrl,
    timeout: 100000,
})
service.interceptors.request.use(
    config => {
        addPending(config)
        return config
    },
    error => {
        return Promise.error(error)
    }
)

service.interceptors.response.use(
    success => {
        deletePending(success)
    },
    error => {
        deletePending(error)
    }
)

export default service

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/82258.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

时序预测 | MATLAB实现基于CNN-BiGRU卷积双向门控循环单元的时间序列预测-递归预测未来(多指标评价)

时序预测 | MATLAB实现基于CNN-BiGRU卷积双向门控循环单元的时间序列预测-递归预测未来(多指标评价) 目录 时序预测 | MATLAB实现基于CNN-BiGRU卷积双向门控循环单元的时间序列预测-递归预测未来(多指标评价)预测结果基本介绍程序设计参考资料 预测结果 基本介绍 MATLAB实现基于…

Vs code 使用中的小问题

1.Java在Vs code 中使用单元测试失败或者如何使用单元测试 创建Java项目,或者将要测试的文件夹添加进工作区 要出现lib包,并有两个测试用的jar包 编写测试文件 public class TestUnit{ public static void main(String[] args) {String str "…

Pycharm与Anaconda Python的开发环境搭建

目录 一:下载 二:安装python 三:设置Pycharm 一:下载 下载Anaconda: Anaconda | The World’s Most Popular Data Science Platform 安装好以后,设置一下环境变量: 打开命令行&#xff0c…

OpenCV-Python中的图像处理-图像特征

OpenCV-Python中的图像处理-图像特征 图像特征Harris角点检测亚像素级精度的角点检测Shi-Tomasi角点检测SIFT(Scale-Invariant Feature Transfrom)SURF(Speeded-Up Robust Features)FAST算法BRIEF(Binary Robust Independent Elementary Features)算法ORB (Oriented FAST and R…

aardio简单网站css或js下载练习

import win.ui; /*DSG{{*/ var winform win.form(text"下载网站css或js";right664;bottom290;maxfalse) winform.add( buttonClose{cls"button";text"退出";left348;top204;right498;bottom262;color14120960;fontLOGFONT(h-14);note" &qu…

SQL Injection

SQL Injection 就是通过把恶意的sql命令插入web表单递交给服务器,或者输入域名或页面请求的查询字符串递交到服务器,达到欺骗服务器,让服务器执行这些恶意的sql命令,从而让攻击者,可以绕过一些机制,达到直…

一种新型的4H-SiC超结共模场效应晶体管(UMOSFET),具有异质结二极管,以提高反向恢复特性

标题:A novel 4H-SiC super junction UMOSFET with heterojunction diode for enhanced reverse recovery characteristics 摘要 摘要—本文提出并通过数值模拟研究了一种新型的碳化硅(SiC)超结共模场效应晶体管(UMOSFET&#xf…

利用POM完成脚本分离实现企业级自动化(POM设计模式+页面的框架封装+测试报告截图)

利用POM完成脚本分离实现企业级自动化(POM设计模式页面的框架封装测试报告截图) 项目-测试-手工测试 项目-测试-手工测试 1.了解需求; 2.编写测试用例(开始)——功能测试组会去做的事情 3.执行测试用例——发送测试报…

Kotlin 使用 View Binding

解决的问题: 《第一行代码——Android》第三版 郭霖 P277 视图绑定的问题 描述: kotlin-android-extensions 插件已经弃用 butter knife 已经弃用 解决办法 推荐使用 View Binding 来代替 findViewById 使用方法 1、配置 build.gradle 2、在act…

服务器数据恢复-HP EVA存储常见故障的数据恢复流程

EVA存储原理: EVA系列存储是以虚拟化存储为实现目的的中高端存储设备,内部的结构组成完全不同于其他的存储设备,RAID在EVA内部称之为VRAID。 EVA会在每个物理磁盘(PV)的0扇区写入签名,签名后PV会被分配到不…

协程框架NtyCo的实现

一、为什么需要协程&#xff1f; 讨论协程之前&#xff0c;我们需要先了解同步和异步。以epoll多路复用器为例子&#xff0c;其主循环框架如下&#xff1a; while (1){int nready epoll_wait(epfd, events, EVENT_SIZE, -1);int i0;for (i0; i<nready; i){int sockfd ev…

Maven高级

目录 一、分模块开发与设计 1. 分模块开发的意义 2. 分模块开发&#xff08;模块拆分&#xff09; &#xff08;1&#xff09;创建Maven模块 &#xff08;2&#xff09;书写模块代码 &#xff08;3&#xff09;通过maven指令安装模块到本地仓库&#xff08;install指令&…

[JavaWeb]【四】web后端开发-SpringBootWeb入门

目录 一 Spring 二 SpringBootWeb入门 2.1 入门需求 2.2 分析 2.3 开始创建SpringBootWeb 2.4 创建类实现需求 2.5 启动程序 2.6 访问 三 HTTP协议 3.1 HTTP-概述 3.2 HTTP-请求协议 3.3 HTTP-响应协议 3.3.1 响应状态码 && 响应类型 3.4 HTTP-协议解析 前言…

孤注一掷——基于文心Ernie-3.0大模型的影评情感分析

孤注一掷——基于文心Ernie-3.0大模型的影评情感分析 文章目录 孤注一掷——基于文心Ernie-3.0大模型的影评情感分析写在前面一、数据直观可视化1.1 各评价所占人数1.2 词云可视化 二、数据处理2.1 清洗数据2.2 划分数据集2.3 加载数据2.4 展示数据 三、RNIE 3.0文心大模型3.1 …

前端基础(Vue的模块化开发)

目录 前言 响应式基础 ref reactive 学习成果展示 Vue项目搭建 总结 前言 前面学习了前端HMTL、CSS样式、JavaScript以及Vue框架的简单适用&#xff0c;接下来运用前面的基础继续学习Vue&#xff0c;运用前端模块化编程的思想。 响应式基础 ref reactive 关于ref和react…

Redis中的分布式锁及其延生的问题

前言 本文将着重介绍Redis中的分布式锁及其与出现的死锁和锁误删问题 什么是分布式锁 首先问题就是什么是分布式锁&#xff0c;分布式锁就是分布式系统中实现并发控制的一种锁机制&#xff0c;它可以保证多个节点在同一个时间只有有一个能成功竞争到系统资源&#xff08;共享…

08.异常处理与异常Hook(软件断点Hook,硬件断点Hook)

文章目录 异常处理异常Hook&#xff1a;VEH软件断点HOOKVEH硬件断点HOOK 异常处理 1.结构化异常SEH #include <iostream>int main() {goto Exit;__try {//受保护节int a 0;int b 0;int c a / b;std::cout << "触发异常" << std::endl;}/*EXCE…

【JVM】垃圾回收算法

目录 一、判断对象已“死” 1.1、引用计数算法 1.2、可达性分析算法 1.3、引用的概念 二、垃圾收集算法理论 2.1、分代收集理论 三、垃圾收集算法 3.1、标记--清除算法 3.2、标记--复制算法 3.3、标记--整理算法 一、判断对象已“死” 在堆里面存放着Java世界中几乎所…

ATF(TF-A)安全通告 TFV-8 (CVE-2018-19440)

安全之安全(security)博客目录导读 ATF(TF-A)安全通告汇总 目录 一、ATF(TF-A)安全通告 TFV-8 (CVE-2018-19440) 二、CVE-2018-19440 一、ATF(TF-A)安全通告 TFV-8 (CVE-2018-19440) Title 不保存x0~x3寄存器可能会将信息从一个非安全世界的SMC client泄漏到另一个 CVE ID …

【电子通识】什么是异常分析中的A-B-A方法

工作有了一定的经验之后&#xff0c;在做问题分析的时候&#xff0c;经常会听到别人说把这个部品&#xff08;芯片/模块&#xff09;拿去ABA一下&#xff0c;看看跟谁走。那么对于新人来说是否就会问一个问题&#xff1a;什么是ABA呢&#xff1f; A-B-A 交换是一种简单直接的交…