Fetch 本身不提供队列和限流能力,需手动封装调度逻辑:维护任务队列与并发数限制(如最多3个),通过Promise链或async/await协调执行,每次调用先入队、再按空闲槽位发起请求。

Fetch 本身不提供队列和限流能力,需要手动封装一层调度逻辑来控制并发请求数、排队等待和错误重试。核心思路是维护一个任务队列 + 限制同时运行的请求数(比如最多 3 个并发),用 Promise 链或 async/await 协调执行顺序。
用 Promise 队列 + 并发控制器管理请求
创建一个类或函数,内部维护待执行队列和当前活跃请求数。每次调用 fetch 时,不是立即发起网络请求,而是推入队列;只有当活跃数
- 用 数组模拟队列(push 入队,shift 出队)
- 用一个计数器 track active count,请求开始 +1,结束(无论成功失败)-1
- 每次出队后检查是否还能继续执行,避免竞态
- 返回的 Promise 要能被外部 await,所以每个任务需 resolve/reject 正确传递结果
封装成可复用的 Fetch 限流器
推荐写成工厂函数,接收最大并发数和默认配置,返回一个带队列语义的 fetch 方法:
- 支持传入原生 fetch 参数(url, options)
- 自动把请求包装成 Promise 并加入队列
- 可选支持超时、重试、取消信号(AbortSignal)
- 暴露 clearQueue() / pause() / resume() 等控制方法(按需添加)
处理错误与重试时不破坏队列顺序
失败不应让整个队列卡住。每个任务应独立处理错误,并决定是否重试 —— 重试也应走同一套队列逻辑,而不是立刻重发(否则会绕过限流)。
立即学习“Java免费学习笔记(深入)”;
- 重试次数建议设上限(如 3 次),避免死循环
- 重试前可加指数退避(setTimeout 延迟),用 Promise.delay 封装
- 最终失败时,reject 原始错误,让调用方决定后续逻辑
- 不要在 catch 里直接再调用本 fetch,容易造成并发失控
实际使用示例(简洁版)
比如限制最多 2 个并发请求,批量调用:
const limitedFetch = createLimitedFetch(2);const urls = ['/api/a', '/api/b', '/api/c', '/api/d'];
const promises = urls.map(url => limitedFetch(url));
const results = await Promise.all(promises); // 自动排队+限流


















