JavaScript 中怎么在 Fetch 失败时捕获异常并触发重试逻辑-js教程-PHP中文网

fetch 请求失败需区分网络异常（自动 reject）和 http 错误（需手动检查 response.ok 或 status），重试函数应支持次数限制与延迟，上层处理 json 解析，并建议结合 abortcontroller、按错误类型选择性重试及日志记录。

javascript 中怎么在 fetch 失败时捕获异常并触发重试逻辑

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  setTimeout(r, delayMs));
    }
  }
}

使用示例：请求 JSON 并解析

实际调用时，建议在上层再处理数据解析，避免在重试函数里耦合太多逻辑：

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));