如何在浏览器上下文中执行Node.js代码?

时间:2018-11-25 01:12:31

标签: javascript node.js google-chrome-devtools puppeteer headless-browser

如何在page.evaluate()语句中执行客户端JS代码(不仅仅是浏览器JavaScript代码,Node.js代码)?

const puppeteer = require('puppeteer');

(async () => {
 const browser = await puppeteer.launch();
 const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.screenshot({path: 'example.png'});
  await page.evaluate(() => {
    document.querySelector('button[type=submit]').click();
  });
  console.log('yes') 
  await browser.close();
})();

1 个答案:

答案 0 :(得分:0)

传递给page.evaluate()的第一个参数应该是将在浏览器的页面上下文中求值的函数。

Node.js是服务器端代码,旨在在服务器上执行。

您可以使用以下方法将参数从Node.js环境传递到页面函数:

// Node.js Environment
const hello_world = 'Hello, world! (from Node.js)';

await page.evaluate(hello_world => {
  // Browser Page Environment
  console.log(hello_world);
}, hello_world);

您可以侦听页面上下文中发生的'console'事件,并使用page.on()打印结果:

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