JavaScript 中怎么用指数退避算法实现网络请求重试-js教程-PHP中文网

指数退避重试通过按2^attempt增长延迟（如1s、2s、4s）避免请求风暴，需结合抖动、错误分类（仅重试5xx/网络错误）、超时控制与最大重试次数，推荐用axios-retry或手动封装fetch实现。

javascript 中怎么用指数退避算法实现网络请求重试

用指数退避算法实现网络请求重试，核心是让每次失败后的等待时间按指数增长（比如 1s、2s、4s、8s），避免密集重试压垮服务端或被限流。JavaScript 中可结合 fetch 或 axios + setTimeout（或 Promise + async/await）来实现，关键在于控制重试次数、计算退避延迟、处理异常并及时终止。

基础实现：手动封装带退避的 fetch

下面是一个轻量、可复用的函数，使用原生 fetch，支持最大重试次数和基础延迟（单位毫秒）：

每次重试前用 setTimeout 等待，延迟时间为 baseDelay * 2^attempt
只对网络错误或 5xx 响应重试，4xx（如 404、401）通常不重试
用 AbortController 防止上一次请求未完成时新请求已发起

示例代码：

async function fetchWithBackoff(url, options = {}, { maxRetries = 3, baseDelay = 1000 } = {}) {
  let lastError;
  for (let attempt = 0; attempt  controller.abort(), 10000); // 10s 超时
<pre class="brush:php;toolbar:false;">  const res = await fetch(url, { ...options, signal: controller.signal });
  clearTimeout(timeoutId);

  if (res.ok) return res;
  if (res.status >= 500 && res.status  setTimeout(resolve, delay));
  }
}

} throw lastError; }

// 使用 fetchWithBackoff('/api/data') .then(res => res.json()) .then(data => console.log(data)) .catch(err => console.error('最终失败:', err));

用 axios 实现更简洁的退避重试

axios 自带 retry 配置，但默认不支持指数退避；可通过拦截器 + axios-retry 库或手动增强。推荐使用 axios-retry 并自定义重试延迟：

安装：npm install axios axios-retry
配置 retryDelay 返回指数增长的毫秒数
用 shouldRetry 精确控制哪些错误触发重试

示例：

import axios from 'axios';
import axiosRetry from 'axios-retry';
<p>axiosRetry(axios, {
retries: 3,
retryDelay: (retryCount) => {
return 1000 <em> Math.pow(2, retryCount) + Math.random() </em> 100;
},
shouldRetry: (error) => {
const status = error.response?.status;
return !!(error.code === 'ECONNABORTED' || error.code === 'ERR_NETWORK' || (status >= 500 && status </p><p>// 后续所有 axios 请求自动带指数退避
axios.get('/api/data').catch(err => console.error(err));
</p>

关键细节与最佳实践

写得好不好，往往取决于这些“不起眼”的地方：

Java Development Manual

Java开发手册规约集合，基于阿里巴巴Java开发手册（嵩山版）。涵盖7大维度：编程规约、异常日志、单元测试、安全规约、MySQL数据库、工程结构、设计规约。当用户需要：(1) 编写或审查Java代码 (2) 检查命名/代码规范 (3) 处理异常和日志 (4) 编写单元测试 (5) 安全编码 (6) 数据库设...

下载