Question

是否有一种类似于ipcMain中的ipcRenderer和Electron函数的Puppeteer主进程与渲染进程之间进行通信的方式。

此post中演示了一个简单的应用程序。我发现此功能可以通过触发从page到主要功能（反之亦然）的事件来进行调试。

Answer 1

调试： -Puppeteer具有用于调试目的here的各种页面事件。 -Puppeteer最近added ASYNC stack trace，因此您可以更精确地跟踪错误。

事件发出，您可以使用默认的events模块和exposeFunction来构建自己的事件系统。

请参阅以下包含所有上述方法的代码段，

const EventEmitter = require("events");
const myEventTracker = new EventEmitter();
myEventTracker.on("some-event", function(...data) {
  // do something on event
  console.log(data);
});

// usage in puppeteer
const puppeteer = require("puppeteer");
puppeteer.launch({ headless: false }).then(async browser => {
  const page = await browser.newPage();

  // normal console events forwarded to node context
  page.on("console", msg => console.log(msg.text()));

  // we can use this to make our own reverse events
  myEventTracker.on("change-viewport", async function(data) {
    // do something on event
    await page.setViewport({ width: data.width, height: data.height });
  });

  // or we can expose the emit function
  await page.exposeFunction("emitter", (...data) =>
  myEventTracker.emit(...data)
  );

  // emit however we want
  await page.evaluate(async => {
    emitter("change-viewport", { width: 1200, height: 800 });
    emitter("some-event", "inside browser");
  });

  await page.goto("http://viewportsizes.com/mine/");
  // await browser.close();
});

如果我们要解释所有内容，它将成为博客文章，否则，我将更新我的答案。

在Puppeteer中的main和renderer函数之间进行通信

1 个答案: