javascript - 如何在 Electron BrowserWindow 中打开 puppeteer 页面

Question

在 ElectronJS 中，我可以使用以下命令打开 BrowserWindow:

let window = new BrowserWindow({ width: 600, height: 400 });

此外，我可以使用以下命令通过 Puppeteer 启动 headful Chromium 实例:

const browser = await puppeteer.launch(
{
    headless: false
});

但是，我不想打开一个新的 Chromium 窗口(即在自己的窗口中启动 Chromium)，而是想将其直接嵌入到我的应用程序的 BrowserWindow 中(即在其中启动 Chromium)我的应用程序就好像它是某种集成浏览器)。

我正在寻找在美学上与将 BrowserView 嵌入到我的 BrowserWindow 中相同的东西，如下所示:

let view = new BrowserView();
window.addBrowserView(view);
view.setBounds({ x: 0, y: 0, width: 600, height: 400 });

但是，我想使用 Puppeteer Page 来完成此操作。

Answer 1

您可以使用浏览器类上的 newPage 函数将另一个页面添加到窗口中。

通过 pages 函数，您可以解构页面并命名它们，以便您可以使用它们。

如下:

const browser = await puppeteer.launch();
await browser.newPage();
const [firstPage, secondPage] = await browser.pages();

// use both pages
firstPage.goto('www.google.com')
secondPage.goto('www.bing.com')

注意:newPage 和 pages 函数是异步的，因此您需要等待结果。