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

Question

我正在尝试在页面内执行 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);

Answer 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);

Answer 2

为了使其非阻塞，您需要在使用page.evaluate<\/code>的函数中删除所有“返回等待”（如本响应https:\/\/stackoverflow.com\/a\/59564391\/3482730<\/a>中所述），并删除await<\/code>当你调用它时：

前任：

async function doesPageEvaluate() {
    return 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);
                }
                else {
                    reject(req);
                }
            };
            req.send();
        });
    }, requestSite);
}

...

doesPageEvaluate(); // next line will be executed before this finishes
await page.goto("https://somesite.com");