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 () => {&nbsp; const results = await Promise.all(urls.map(processUrl));&nbsp; console.log(results);&nbsp; // further processing must be also inside this IIFE})();async function processUrl(url) {&nbsp; try {&nbsp; &nbsp; const text = await (await fetch(url)).text();&nbsp; &nbsp; return {url, text, status: detecting(text)};&nbsp; } catch (error) {&nbsp; &nbsp; return {url, error};&nbsp; }}