使用一个信号进行多次 fetch() 以中止它们

Posted 2023-02-22

【中文标题】使用一个信号进行多次 fetch() 以中止它们

【英文标题】：Multiple fetch() with one signal in order to abort them all

【发布时间】：2018-02-26 22:17:21

【问题描述】：

我看到了另一个答案：https://***.com/a/47250621/2809729

那么我可以只使用一个信号中止多个获取请求吗？

【参考方案1】：

在我写这个问题的时候，我已经在 this post on how to abort fetches 中找到了解决方案，该解决方案来自致力于实施中止的先驱之一。

所以是的，你可以:) 这里是一个简单的例子：

async function fetchStory( signal =) 
  const storyResponse = await fetch('/story.json',  signal );
  const data = await storyResponse.json();

  const chapterFetches = data.chapterUrls.map(async url => 
    const response = await fetch(url,  signal );
    return response.text();
  );

  return Promise.all(chapterFetches);

在上面的示例中，相同的信号用于初始提取和并行章节提取。以下是您如何使用 fetchStory：

const controller = new AbortController();
const signal = controller.signal;

fetchStory( signal ).then(chapters => 
  console.log(chapters);
);

在这种情况下，调用 controller.abort() 将拒绝正在进行的提取的承诺。

【参考方案2】：

我对这个问题的解决方案进行了抽象，并提出了“fetch-tx”，即获取事务，它为所有相关的获取操作提供了一个单一的中止函数。

你可以在这里找到它： fetch-tx

【讨论】：

哦，好吧，实际上我最终创建了自己的 fetch 包装器，让您可以中止所有这些或单独中止它们中的每一个 giacomocerquone.com/blog/fetch-wrapper@OrBachar