网络请求超时应通过 AbortController 主动中断，而非强行终止；需捕获 AbortError、清理流和关联资源，并配合 Promise.race 封装超时逻辑，同时推动服务端协同优化可靠性。
网络请求超时时安全中止任务，关键不是“强行杀掉”请求，而是让请求主动感知中断、及时退出、不残留副作用。现代 JavaScript 提供了标准化、可组合的中断机制，核心是 AbortController 配合合理的错误处理和资源清理。
用 AbortController 主动触发取消
这是目前最标准、浏览器和 Node.js（通过 polyfill 或 fetch 实现）都支持的方式。它不依赖底层协议是否真正终止 TCP 连接，而是让 fetch/XHR/axios 等上层 API 在收到 signal 中断后立即抛出 AbortError，从而进入你可控的错误分支。
- 创建控制器：const controller = new AbortController()
- 传入 signal：fetch(url, { signal: controller.signal })
- 超时触发取消：setTimeout(() => controller.abort(), 5000)
- 捕获特定错误：
if (err.name === 'AbortError') { /* 超时处理 */ }
避免常见陷阱：超时 ≠ 取消成功
仅调用 controller.abort() 不代表请求已停止或资源已释放。必须确保：
- 在
catch块中明确区分AbortError和其他网络错误（如 404、500、网络断开），避免把超时当成服务端失败重试 - 如果请求返回了部分响应（比如流式读取中），需手动调用
response.body?.cancel()清理 ReadableStream - 若在请求中启用了自定义逻辑（如轮询、定时器、Web Worker），需在
abort后同步清理这些关联资源
配合 Promise.race 实现更简洁的超时封装
当你不想手动管理 setTimeout 和 clearTimeout，可用 Promise.race 抽象超时逻辑：
立即学习“Java免费学习笔记（深入）”；
- 写一个通用函数：
function timeoutFetch(url, ms) { const ctrl = new AbortController(); const timeout = setTimeout(() => ctrl.abort(), ms); return fetch(url, { signal: ctrl.signal }).finally(() => clearTimeout(timeout)); } - 它自动清理定时器，且保持原 fetch 的 Promise 行为，便于链式调用
- 注意：
finally在 abort 后仍会执行，适合做清理；但真正响应处理仍应在then/catch中完成
服务端协同提升可靠性
客户端超时只是兜底。真正减少误超时，需前后端配合：
- 后端对长耗时接口返回
202 Accepted+ 异步任务 ID，前端改用轮询或 WebSocket 查询结果，而非死等单次请求 - 后端在响应头中提供
X-Response-Time或Server-Timing，前端可据此动态调整下次请求的超时阈值 - 对关键业务（如支付确认），客户端超时后不应静默失败，而应发起幂等查询接口验证最终状态
