umijs / umi-request

A request tool based on fetch.
2.2k stars 336 forks source link

umi-request使用AbortController拦截多个请求 #288

Open LiMuBai-ACE opened 2 years ago

LiMuBai-ACE commented 2 years ago

import { extend } from 'umi-request'; const RequestTask = new Map() const controller = new AbortController(); // 创建一个控制器 const { signal, abort } = controller; // 返回一个 AbortSignal 对象实例,它可以用来 with/abort 一个 DOM 请求。 signal.addEventListener('abort', () => { console.log('aborted!'); }); request.interceptors.request.use((url: any, options: any) => { // console.log("请求前拦截") cancelRequest 用于是否加入拦截队列 if (!options.hasOwnProperty("cancelRequest")) { options = { ...options, signal } RequestTask.set(signal, abort) } return { url: url, options: { ...options }, }; }); request.interceptors.response.use(async (response, options) => { if (options.signal) { RequestTask.delete(options.signal) } // console.log("请求后拦截") if (response.status !== 200) { return Promise.resolve(response); } let data = await response.clone().json(); if (data && data?.code !== 0) { notification.error(data.message) // 退出登录 if (data?.code === 401) { console.log(RequestTask, "_________RequestTask") for (const [signal, abort] of RequestTask) { abort() } } } return response; }); 当我接口返回401的错误后,取消那些未完成的请求,并没有效果,请问我哪里出了问题,或者是否有相关的demo呢