umi4 中断请求
主要是利用 axios 的 CancelToken。
app.ts
import type { RequestConfig } from "@umijs/max";
// 全局用于存放请求
let pending: any[] = [];
// 执行中断请求,以及移除中断请求
const removePending = (config: any, pending: any[] = []) => {
for (const index in pending) {
let curIndex = Number(index);
// 当当前请求的信息在pending存在,即需求执行中断请求
if (pending[curIndex].u === `${config.url}&${config.method}`) {
// 当当前请求在数组中存在时执行函数体
pending[curIndex].f("请求中断"); // 执行取消操作
pending.splice(curIndex, 1); // 把这条记录从数组中移除
}
}
};
export const request: RequestConfig = {
// 请求拦截
requestInterceptors: [
// 一个二元组,第一个元素是 request 拦截器,第二个元素是错误处理
[
(url, options: any) => {
removePending(options, pending);
options.cancelToken = new CancelToken((c) => {
// u属性确定值唯一
pending.push({ u: `${options.url}&${options.method}`, f: c });
});
return { url, options };
},
(error) => {
return Promise.reject(error);
},
],
],
};