首页 > web前端 > js教程 > 如何使用 Promise.all 高效地从多个 URL 获取数据?

如何使用 Promise.all 高效地从多个 URL 获取数据?

Patricia Arquette
发布: 2024-10-29 05:24:02
原创
280 人浏览过

How to Efficiently Fetch Data from Multiple URLs with Promise.all?

使用 Promise.all 征服多个 URL 获取

在异步编程领域,Promises 提供了强大的机制来处理诸如获取之类的异步任务来自多个 URL 的数据。正如您所遇到的,尝试将此用例融入 Promise.all 范例可能是一个绊脚石。

让我们剖析一下您尝试的解决方案:

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

此方法存在以下问题:关键缺陷:forEach 既不返回数组也不返回 Promise,使您处于 Promise-void 状态,无法访问获取的文本。

为了纠正这个问题,必须使用 Promise.all 两次,一次是为了获取URL 并一次从响应中提取文本:

Promise.all(urls.map(u=>fetch(u))).then(responses =>
    Promise.all(responses.map(res => res.text()))
).then(texts => {
    …
})
登录后复制

或者,您可以通过将获取和文本检索合并为一个步骤来简化该过程:

Promise.all(urls.map(url =>
    fetch(url).then(resp => resp.text())
)).then(texts => {
    …
})
登录后复制

了解更多简洁的解决方案,拥抱 async/await 的强大功能:

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

这些方法使您能够高效处理多个 URL 获取,使您能够构建包含提取文本的所需对象。

以上是如何使用 Promise.all 高效地从多个 URL 获取数据?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板