如何使用 Promise.all 获取 URL 数组？

如果我有一个 url 数组：

var urls = ['1.txt', '2.txt', '3.txt']; // these text files contain "one", "two", "three", respectively.

我想构建一个如下所示的对象：

var text = ['one', 'two', 'three'];

我一直在努力学习这样做fetch，这当然会返回Promises.

我尝试过的一些事情don’t work:

var promises = urls.map(url => fetch(url));
var texts = [];
Promise.all(promises)
  .then(results => {
     results.forEach(result => result.text()).then(t => texts.push(t))
  })

这看起来不对，而且无论如何它都不起作用——我最终不会得到一个数组 ['one', 'two', ' Three']。

正在使用Promise.all这里的方法正确吗？

Yes, Promise.all是正确的方法，但如果您想首先，您实际上需要两次fetch所有网址，然后获取所有text来自他们的（这又是对响应正文的承诺）。所以你需要做

Promise.all(urls.map(u=>fetch(u))).then(responses =>
    Promise.all(responses.map(res => res.text()))
).then(texts => {
    …
})

您当前的代码不起作用，因为forEach不返回任何内容（既不是数组也不是承诺）。

当然，您可以简化它，并在各自的获取承诺履行后立即从每个响应中获取正文：

Promise.all(urls.map(url =>
    fetch(url).then(resp => resp.text())
)).then(texts => {
    …
})

或者同样的事情await:

const texts = await Promise.all(urls.map(async url => {
  const resp = await fetch(url);
  return resp.text();
}));