Fetch 请求失败需区分网络异常（自动 reject）和 HTTP 错误（需手动检查 response.ok 或 status），重试函数应支持次数限制与延迟，上层处理 JSON 解析，并建议结合 AbortController、按错误类型选择性重试及日志记录。
Fetch 请求失败时，不能只靠 catch 捕获网络错误，因为 HTTP 状态码（如 404、500）不会自动抛异常——fetch 只在网络断开、DNS 失败等真正“请求未发出”时 reject。要实现带重试的健壮请求，需手动检查 response.ok 或状态码，并结合 try/catch 和异步重试控制。
区分两类失败：网络异常 vs HTTP 错误
这是重试逻辑的前提：
-
网络异常（如离线、跨域拒绝、请求被取消）：
fetch()返回 Promise 并直接 reject，可进catch -
HTTP 错误响应（如 401、503、404）：
fetch()仍 resolve，但response.ok === false或response.status >= 400，需主动判断并 throw
基础重试函数：支持次数限制与延迟
封装一个通用的重试 fetch 函数，接受 URL、配置和重试参数：
deep-java-review
下载
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
async function fetchWithRetry(url, options = {}, { maxRetries = 3, delayMs = 1000 } = {}) {
for (let i = 0; i <= maxRetries; i++) {
try {
const response = await fetch(url, options);
// 主动判断 HTTP 错误状态
if (!response.ok) {
throw new Error(`HTTP ${response.status}: ${response.statusText}`);
}
return response; // 成功则返回 response，由调用方处理 .json() 等
} catch (err) {
// 最后一次尝试失败才抛出
if (i === maxRetries) throw err;
// 等待后重试（可加指数退避：delayMs *= 2）
await new Promise(r => setTimeout(r, delayMs));
}
}
}
使用示例：请求 JSON 并解析
实际调用时，建议在上层再处理数据解析，避免在重试函数里耦合太多逻辑：
立即学习“Java免费学习笔记（深入）”；
async function getUserData() {
try {
const res = await fetchWithRetry('/api/user', { method: 'GET' }, {
maxRetries: 2,
delayMs: 500
});
return await res.json(); // 这里才解析，确保 res 是有效的
} catch (err) {
console.error('获取用户数据失败（已重试 2 次）:', err.message);
throw err;
}
}
// 调用
getUserData().then(data => console.log(data));
进阶建议：取消重复请求 & 标记可重试错误
真实场景中可进一步优化：
- 用
AbortController控制超时或手动取消，避免重试堆积 - 对某些错误（如 401 认证失效、400 客户端错误）不重试，只重试 5xx 或网络类错误
- 记录每次重试原因（日志）、暴露重试次数给 UI（如“正在重试第 2 次…”）
