Puppeteer page.evaluate 未按预期工作答案

【问题标题】：Puppeteer page.evaluate not working as expectedPuppeteer page.evaluate 未按预期工作
【发布时间】：2020-01-22 12:38:38
【问题描述】：

谁能解释为什么这段代码不起作用。我在运行 page.evaluate() 之前有一个控制台日志，它记录了我的预期，但 page.evaluate 中的控制台日志永远不会运行。

const puppeteer = require('puppeteer');

(async () => {
  try {
    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    await page.goto('https://www.example.com');
    page.on('response', async response => {
      const url = response.url();
      if (url.includes('something')) {
        console.log('this code runs');
        await page.evaluate(() => {
          console.log("this code doesn't run");
        });
      }
    });    
  } catch (err) {
    console.log(err);
  }
})();

【问题讨论】：

标签： puppeteer

【解决方案1】：

控制台日志在 page.evaluate() 中不起作用

https://github.com/GoogleChrome/puppeteer/issues/1944

【讨论】：

【解决方案2】：

尝试使用此代码从评估中显示 console.log

page.on('console', msg => {
  for (let i = 0; i < msg.args().length; ++i)
    console.log(`${i}: ${msg.args()[i]}`);
});
page.evaluate(() => console.log('hello', 5, {foo: 'bar'}));

https://pptr.dev/#?product=Puppeteer&version=v1.20.0&show=api-event-console

【讨论】：

这行得通！！！太棒了！

【解决方案3】：

Console.log 工作，但在浏览器上下文中。我在这里猜测您正在尝试在 CLI 中查看日志。如果你想查看日志设置 headless 为 false，然后在浏览器控制台查看日志。

【讨论】：

【解决方案4】：

page.evaluate 中的代码在浏览器上下文中运行，因此 console.log 可以工作，但在 Chrome 控制台中而不是 Puppeteer 中。

要在 Puppeteer 控制台中显示 Chrome 上下文的日志，您可以在使用 Puppeteer 启动浏览器时在参数中将 dumpio 设置为 true：

const browser = await puppeteer.launch({
    dumpio: true
})

【讨论】：