级联取消挂起请求需共享同一abortcontroller的signal实例，上层触发abort()可使所有绑定该signal的fetch等api自动中止并释放tcp连接；切勿为每个请求新建controller，应在生命周期开始创建、退出前显式abort，并确保signal传入每个fetch调用。

使用 AbortController 级联取消挂起请求，核心在于**共享同一个 signal 实例**，并在上层逻辑（如页面卸载、用户跳转、搜索中断）触发 abort()，让所有监听该 signal 的 fetch 或其他兼容 API 自动中止并释放底层连接资源。

共享 signal 实现请求级联取消

多个请求共用一个 controller 的 signal，是级联取消的基础。一旦调用 controller.abort()，所有绑定该 signal 的请求立即终止，浏览器会主动关闭对应 TCP 连接（或复用池中的空闲套接字），避免连接堆积。

• 不要为每个请求新建 AbortController，否则无法统一控制
• 在组件/作用域生命周期开始时创建 controller，在退出前显式 abort
• 确保 signal 传入每个 fetch 调用的 options.signal

在常见场景中正确触发 abort

级联取消的价值体现在及时响应状态变化。例如：

• React 组件卸载时：在 useEffect 清理函数中调用 controller.abort()
• 用户输入搜索关键词时：每次新输入前先 abort 上一个 controller，再新建一个用于本次请求链
• 路由跳转前：监听 beforeunload 或框架的导航钩子（如 React Router 的 useBlocker），提前中止未完成请求

注意 fetch 以外的异步操作兼容性

AbortSignal 不仅支持 fetch，还可用于 setTimeout、Promise 封装、甚至自定义异步逻辑：

• 用 signal.throwIfAborted() 在 Promise 内部主动检查中止状态
• 监听 signal.onabort 手动清理定时器、WebSocket、EventSource 等资源
• 第三方库（如 Axios ≥ 1.2.0）也支持 signal 选项，可无缝接入同一 controller

验证套接字是否真正释放

可通过浏览器开发者工具 Network 面板观察请求状态：

• 被取消的请求显示为 (cancelled)，且不会进入 “Pending” 或 “Finished” 状态
• 在 Connections 或 WS 标签页中，不应出现大量 pending 或 stalled 连接
• 若仍存在连接泄漏，需检查是否遗漏了某处未传入 signal，或存在未受控的底层 socket（如手动 new WebSocket(url) 未监听 signal.aborted）