Chrome 扩展：从给定的 url 获取网页的文本

Question

首先，我完全是新手制作 chrome 扩展，然后在 chrome 扩展的一部分中，我将收到不同的 url，我想存储网页的文本以供以后处理，从而产生一个布尔变量数组，每个都关联使用给定的网址。从示意图上看，它会是这样的：var result;function process(text){  if something -> result.push(true);  if not -> result.push(false);}function main(){  for (i...){    url = given[i];    text = getHTMLText(url);    process(text);  }  final();//when the loop finish activate another function that use the global variable: result}我的 main 函数有问题，首先我尝试了同步 XMLHttpRequest，虽然它的工作原理很慢，而且 chrome 总是给出不推荐使用同步 XMLHttpRequest 的警告。    for (var i = 0; i < urls.length; i++){        url = urls[i];        var req = new XMLHttpRequest();        req.open('GET', url, false);         req.send(null);        if (req.status == 200) detecting(req.responseText);    };我发现的其他解决方案是使用 fetch(url)，但我发现我不完全理解的代码。尽管返回的文本可以正常工作，但是 proccess 函数在每次页面更新时都会给出不同的结果。    for (var i = 0; i < urls.length; i++){        url = urls[i];        fetch(url).then(function(response) {             response.text().then(function(text) {            detecting(text);            });        });    };其他问题，但这是因为我对 fetch() 知之甚少，就是我无法存储textfetch() 之外的内容，每次我执行 console.log 时都会给出 undefined，这会使处理变得非常复杂给我发短信。我已经看到，也许它可以通过 chrome 的扩展 API 来完成，但我不知道该怎么做。

Answer 1

伪代码中显示的算法main可以通过使用 async/await 和 Promise.all 轻松实现，无需for循环：

(async () => {

  const results = await Promise.all(urls.map(processUrl));

  console.log(results);

  // further processing must be also inside this IIFE

})();

async function processUrl(url) {

  try {

    const text = await (await fetch(url)).text();

    return {url, text, status: detecting(text)};

  } catch (error) {

    return {url, error};

  }

}