参考Stack Overflow回答：能否用单个AbortSignal中止多个fetch()？

完全可以！用单个AbortSignal批量中止多个fetch()请求是非常实用且符合规范的做法，这也是AbortControllerAPI设计的核心场景之一。

实现原理 #

AbortController会生成一个可复用的signal实例，你只需要把这个同一个signal传递给所有需要批量控制的fetch请求的配置参数中。当调用控制器的abort()方法时，所有关联了这个signal的请求都会被立即中止，无需单独操作每个请求。

代码示例 #

// 创建一个AbortController实例，生成可复用的signal
const abortController = new AbortController();
const { signal } = abortController;

// 发起多个绑定了同一个signal的fetch请求
fetch('/api/user-list', { signal })
  .then(res => res.json())
  .catch(err => {
    if (err.name === 'AbortError') {
      console.log('用户列表请求已被中止');
    }
  });

fetch('/api/product-list', { signal })
  .then(res => res.json())
  .catch(err => {
    if (err.name === 'AbortError') {
      console.log('商品列表请求已被中止');
    }
  });

// 触发批量中止的逻辑（比如用户点击取消按钮）
document.querySelector('#cancel-all-requests').addEventListener('click', () => {
  abortController.abort();
  console.log('所有关联的请求已批量中止');
});

注意事项 #

• 中止请求会抛出AbortError，记得在catch块中捕获这个错误，避免出现未处理的异常提示。
• 一旦调用了abort()，当前的signal就会进入已中止状态，无法再用于新的请求。如果需要发起新的批量请求，需要重新创建一个AbortController实例。

内容的提问来源于stack exchange，提问作者Giacomo Cerquone