Node.js无头浏览器page.evaluate中打印数据的解决方法

在page.evaluate的回调里直接用console.log，输出的是浏览器端的日志，Node.js环境默认看不到，下面是几种可行的替代方案：

方法1：监听页面console事件，转发浏览器日志到Node端 #

在Node代码里监听page对象的console事件，当浏览器端触发console.log时，把日志内容同步打印到Node控制台：

const pup = require('puppeteer');
const chrom = await pup.launch({headless:'new'});
const page = await chrom.newPage();

// 监听页面console事件，转发日志到Node端
page.on('console', msg => {
  console.log(...msg.args().map(arg => arg._remoteObject.value));
});

await page.goto(aURI);

await page.evaluate(() => {
  // 这里的console.log会被转发到Node端打印
  console.log('浏览器端生成的字符串');
  const testObj = {name: '示例', data: [1,2,3]};
  console.log('变量内容：', testObj);
});

await chrom.close();

方法2：从page.evaluate返回数据，在Node端打印 #

如果只需要获取特定数据，直接把数据从page.evaluate回调里return出来，在Node端接收后打印：

const pup = require('puppeteer');
const chrom = await pup.launch({headless:'new'});
const page = await chrom.newPage();
await page.goto(aURI);

// 获取evaluate内的返回值并打印
const result = await page.evaluate(() => {
  const instantStr = '即时生成的字符串';
  const count = document.querySelectorAll('div').length;
  // 返回需要打印的任意可序列化数据
  return {instantStr, elementCount: count};
});

// 在Node端打印获取到的数据
console.log('页面数据：', result);

await chrom.close();

方法3：暴露Node端的console.log给浏览器端 #

用page.exposeFunction把Node端的console.log包装成浏览器端可调用的函数，在page.evaluate里直接调用该函数即可打印到Node控制台：

const pup = require('puppeteer');
const chrom = await pup.launch({headless:'new'});
const page = await chrom.newPage();

// 将Node端的console.log暴露为浏览器端的nodeLog函数
await page.exposeFunction('nodeLog', (...args) => {
  console.log(...args);
});

await page.goto(aURI);

await page.evaluate(async () => {
  // 直接调用暴露的函数打印内容到Node端
  await nodeLog('通过暴露函数打印的文本');
  const price = 99.9;
  await nodeLog('商品价格：', price);
});

await chrom.close();

内容的提问来源于stack exchange，提问作者user17227456