JavaScript 中怎么编写一个带有重试功能的通用 Fetch 封装函数-js教程-PHP中文网

可封装带重试机制的fetch函数，核心是捕获网络错误、超时及非2xx响应并条件重试；支持配置重试次数、指数退避延迟（如100→200→400ms）、abortcontroller超时控制（如8s），仅对typeerror、5xx、超时等可恢复错误重试，4xx直接抛出，并统一返回标准化响应结构。

javascript 中怎么编写一个带有重试功能的通用 fetch 封装函数

可以封装一个带重试机制的 fetch 函数，核心是捕获网络失败、超时、非 2xx 响应等异常，并在满足条件时自动重试。

支持可配置的重试次数和延迟

通过参数控制最大重试次数、每次重试前的等待时间（支持指数退避），以及哪些错误需要重试。例如：

默认重试 3 次，首次延迟 100ms，之后按 2 倍递增（100 → 200 → 400ms）
只对网络错误（TypeError）、5xx 状态码、超时等可恢复错误重试
4xx 错误（如 404、401）通常不重试，直接抛出

内置超时控制与 AbortController

原生 fetch 不支持超时，需用 AbortController 主动中断请求。封装时应统一处理：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

为每次 fetch 创建独立的 AbortController
设置超时时间（如 8s），超时后调用 abort()
捕获 AbortError 并归类为可重试错误

返回标准化的响应结构

避免使用者反复判断 response.ok 或手动解析 JSON。封装后可统一返回：

成功时：{ data, status, headers }
失败时：抛出带 status、message、retryCount 的自定义错误
可选支持自动解析 JSON / text / blob，根据 Content-Type 或显式指定

使用示例与关键细节

调用时只需传入 URL 和基础配置，重试逻辑完全透明：

const res = await retryFetch('/api/data', {
  method: 'POST',
  body: JSON.stringify({ x: 1 }),
  retries: 3,
  timeout: 10000,
  shouldRetry: (err, res) => res?.status >= 500 || err.name === 'TypeError'
});
console.log(res.data);

注意点：
– 每次重试都应生成新请求体（尤其含随机字段或 token 时）
– 避免对 POST/PUT 等非幂等请求无脑重试，建议配合 idempotency-key 头
– 重试日志建议用 console.warn 输出，便于调试但不打断流程

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南