How to Efficiently Retrieve Text from an Array of URLs Using Promise.all?

How to Leverage Promise.all to Retrieve an Array of URLs

Consider this scenario: you have an array of URLs and desire to obtain an object with an array of corresponding text from the files at those URLs. The Promise.all function provides a convenient approach for handling this task.

Initially, the code you attempted used Promise.all to retrieve the promises for each URL. However, the subsequent call to results.forEach may cause confusion. This function triggers a callback for each element, resulting in an array of undefined values.

The correct approach involves using Promise.all twice. The first instance fetches the responses from the URLs, while the second converts the responses to text and returns an array of these texts.

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

Alternatively, you can simplify the code by obtaining the text from the response directly:

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

With async/await syntax, the code becomes even more concise:

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

By employing this approach, you can effectively fetch an array of URLs and obtain an object with the corresponding text values.

The above is the detailed content of How to Efficiently Retrieve Text from an Array of URLs Using Promise.all?. For more information, please follow other related articles on the PHP Chinese website!