用 AbortController 同时取消多个请求的关键是共享同一 signal 实例：统一创建 const controller = new AbortController()，所有 fetch 传入 controller.signal，调用一次 controller.abort() 即可中止全部请求。
用 AbortController 同时取消多个请求，核心是**共享同一个 signal 实例**——所有 fetch 请求都传入同一个 controller.signal，调用一次 controller.abort() 就能中止全部。
创建一个 controller 并复用它的 signal
不要为每个请求新建 AbortController，否则 abort 互不影响。正确做法是统一创建一个，把它的 signal 传给所有 fetch：
- 初始化一个
const controller = new AbortController(); - 所有
fetch(url, { signal: controller.signal })都用这个 signal - 需要取消时，只调用一次
controller.abort()
实际例子：并发请求 + 一键取消
比如同时请求用户信息、订单列表和通知数：
Json Schema Toolkit
下载
使用 JSON Schema 验证 JSON 数据，从示例 JSON 生成 schema，并将其转换为 TypeScript 接口、Python 数据类或 Markdown 文档。
const controller = new AbortController();
Promise.all([
fetch('/api/user', { signal: controller.signal }),
fetch('/api/orders', { signal: controller.signal }),
fetch('/api/notifications', { signal: controller.signal })
])
.then(responses => Promise.all(responses.map(r => r.json())))
.catch(err => {
if (err.name === 'AbortError') {
console.log('所有请求已被取消');
} else {
console.error('请求出错：', err);
}
});
// 任意时刻调用即可取消全部
// controller.abort();
注意 signal 的生命周期和兼容性
signal 是只读的，不可重用；一旦 abort，它就进入 aborted 状态，后续再传给新 fetch 会立刻拒绝 Promise。如果要发起新一轮请求，需新建 AbortController。
立即学习“Java免费学习笔记（深入）”；
- 旧版浏览器（如 IE）不支持
AbortController，需 polyfill 或降级处理 - axios 1.3+ 也支持传入
signal，用法一致 - 注意：
fetch中断后，已响应的部分数据不会回滚，但未完成的连接会被关闭
封装成可取消的请求函数（推荐）
便于复用和管理：
function createCancellableRequest() {
const controller = new AbortController();
return {
signal: controller.signal,
abort: () => controller.abort(),
fetch: (url, options = {}) =>
fetch(url, { ...options, signal: controller.signal })
};
}
// 使用
const req = createCancellableRequest();
req.fetch('/api/a').then(...);
req.fetch('/api/b').then(...);
// req.abort(); // 一键取消两个
