axios取消请求

1.使用CancelToken:

TypeScript 复制代码
class RequestHttp {
	service: AxiosInstance;
	public constructor(config: AxiosRequestConfig) {
		// 实例化axios
		this.service = axios.create(config);

		/**
		 * @description 请求拦截器
		 * 客户端发送请求 -> [请求拦截器] -> 服务器
		 */
		this.service.interceptors.request.use(
			(config: any) => {
				if (!getUrlParams("id")) {
					config["cancelToken"] = new axios.CancelToken(function (cancel) {
						cancel("当前URL中未携带id参数,请求已被取消");
					});
				}
				return config;
			},
			(error: AxiosError) => {
				return Promise.reject(error);
			}
		);
	}
}

export default new RequestHttp(config);

2.使用AbortController

javascript 复制代码
class RequestHttp {
	service: AxiosInstance;
	public constructor(config: AxiosRequestConfig) {
		// 实例化axios
		this.service = axios.create(config);

		/**
		 * @description 请求拦截器
		 * 客户端发送请求 -> [请求拦截器] -> 服务器
		 */
		this.service.interceptors.request.use(
			(config: any) => {
				if (!getUrlParams("id")) {
					const abortController = new AbortController();
					config.signal = abortController.signal;
					abortController.abort("当前URL中未携带id参数,请求已被取消");
				}
				return config;
			},
			(error: AxiosError) => {
				return Promise.reject(error);
			}
		);
	}
}

export default new RequestHttp(config);
相关推荐
阿正的梦工坊2 小时前
JavaScript 微任务与宏任务完全指南
开发语言·javascript·ecmascript
懂懂tty2 小时前
CRA 迁移 Rspack(实战)
前端·架构
知行合一。。。2 小时前
Python--05--面向对象(属性,方法)
android·开发语言·python
青梅橘子皮2 小时前
C语言---指针的应用以及一些面试题
c语言·开发语言·算法
浅时光_c3 小时前
3 shell脚本编程
linux·开发语言·bash
小码哥_常3 小时前
Kotlin 助力 Android 启动“大提速”
前端
Evand J3 小时前
【三维轨迹目标定位,CKF+RTS,MATLAB程序】基于CKF与RTS平滑的三维非线性目标跟踪(距离+方位角+俯仰角)
开发语言·matlab·目标跟踪
GreenTea4 小时前
AI 时代,工程师的不可替代性在哪里
前端·人工智能·后端
Jagger_4 小时前
能不能别再弄低代码害人了
前端
朦胧之4 小时前
AI 编程开发思维
前端·后端·ai编程