page.evaluate 中的 Puppeteer XMLHttpRequest 是阻塞代码答案

【问题标题】：Puppeteer XMLHttpRequest inside page.evaluate is blocking codepage.evaluate 中的 Puppeteer XMLHttpRequest 是阻塞代码
【发布时间】：2020-04-20 10:11:06
【问题描述】：

我正在尝试在页面内执行 GET 请求以异步获取一些数据，但 page.goto 总是被阻塞并等待 GET 请求完成后再执行。

我在一个单独的模块中有这样一段代码：

var requestSite = "https://somerequest.com";
// something
return await page.evaluate(async requestSite => {
    return await new Promise(resolve => {
        var req = new XMLHttpRequest();
        req.open("GET", requestSite, true);
        req.onload = () => {
            if (req.status === 200) {
                resolve(req.responseText);
            }
        };
        req.send();
    });
}, requestSite);

主模块：

page.goto("https://somesite.com");

在这种情况下如何使它成为非阻塞的？

【问题讨论】：

整个new Promise(...) 可以用一个简单的fetch(requestSite).then(response => { if (!response.ok) { throw new Error(response.status); } else { return response.text(); } }) 代替

标签： javascript node.js asynchronous xmlhttprequest puppeteer

【解决方案1】：

你可以只返回承诺

return await page.evaluate(requestSite => {
    return new Promise(resolve => {
        var req = new XMLHttpRequest();
        req.open("GET", requestSite, true);
        req.onload = () => {
            if (req.status === 200) {
                resolve(req.responseText);
            }
        };
        req.send();
    });
}, requestSite);

【讨论】：