javascript - 允许 Electron 托管的 Web 应用程序调用 window.open 并像常规 Chrome 窗口一样使用结果

Question

我在 Electron 的 webview 标记中托管的 Web 应用程序调用 window.open。然而，since window.open 无法从 Electron 中的 iframe 内部调用，我被迫重写 window.open，以便它向托管 web 应用程序的渲染器进程发送一条消息，并告诉它调用 window.open 并发回结果。

来 self 的渲染器:webContents.send("my-channel", myWindow);

但是，我似乎无法简单地将整个窗口发送回网络应用程序。发送到 web 应用程序的窗口不具有任何 BrowserWindowProxy 的功能应该有(例如 close)。我想如果它确实有一个 close 会很奇怪，因为 close 需要知道如何转义 webapp(通过某种方式)并提醒 Electron 的渲染器/主进程需要关闭窗口。

我希望发送到 web 应用程序的 window 表现得像一个或多或少的常规 Chrome 窗口(即，我希望它具有相同的公共(public) api)。所以，我的第一个问题是如何为网络应用程序提供这样一个窗口。

我想出的解决方案如下。我仍然在渲染器进程中调用 window.open，但我没有传回生成的窗口，而是传回一个具有 windowId 属性的对象，该属性设置为窗口的 id。当该对象到达 Web 应用程序时，它会通过一个小中介来查看窗口对象并设置一些属性(例如 close、focus)，这些属性在内部向渲染器进程发送消息以执行相关操作(通过预加载脚本公开的函数)。像这样的东西:

myWindow = {
    windowId: 1,
    close: function() {
        sendActionFromWebviewToMain("close", this.windowId);
    }
}

我遇到的下一个问题是 Electron 的 window.open 返回的窗口与 new BrowserWindow(...) 返回的窗口不同，似乎没有 id。 source code引用了 guestId，但我无法访问它。

如何使用 window.open 创建一个 Web 应用程序可以与之交互的窗口？我是否被迫使用 BrowserWindow 构造函数创建窗口？

Answer 1

此问题已得到解决。

我现在需要做的就是在我的 webview 标记上设置 nativeWindowOpen 和 allowpopups 属性，然后我就可以使用 native window.open。

<webview webpreferences="nativeWindowOpen=yes" allowpopups />