Opening windows from the renderer从渲染器打开窗口
There are several ways to control how windows are created from trusted or untrusted content within a renderer. 有几种方法可以控制如何在渲染器中从受信任或不受信任的内容创建窗口。Windows can be created from the renderer in two ways:可以通过两种方式从渲染器创建窗口:
clicking on links or submitting forms adorned with点击链接或提交带有target=_blank
target=_blank
装饰的表格JavaScript callingJavaScript调用window.open()
window.open()
For same-origin content, the new window is created within the same process, enabling the parent to access the child window directly. 对于相同来源的内容,新窗口是在同一进程中创建的,使父窗口能够直接访问子窗口。This can be very useful for app sub-windows that act as preference panels, or similar, as the parent can render to the sub-window directly, as if it were a 这对于充当首选项面板或类似面板的应用程序子窗口非常有用,因为父窗口可以直接渲染到子窗口,就好像它是父窗口中的div
in the parent. div
一样。This is the same behavior as in the browser.这与浏览器中的行为相同。
Electron pairs this native Chrome Electron将这个原生ChromeWindow
with a BrowserWindow under the hood. Window
与引擎盖下的BrowserWindow配对。You can take advantage of all the customization available when creating a BrowserWindow in the main process by using 通过对渲染器创建的窗口使用webContents.setWindowOpenHandler()
for renderer-created windows.webContents.setWindowOpenHandler()
,您可以在主进程中创建BrowserWindow时利用所有可用的自定义功能。
BrowserWindow constructor options are set by, in increasing precedence order: parsed options from the BrowserWindow构造函数选项由以下按递增的优先级顺序设置:features
string from window.open()
, security-related webPreferences inherited from the parent, and options given by webContents.setWindowOpenHandler. window.open()
的features
字符串中解析的选项、从父级继承的安全相关的webPreferences
以及webContents.setWindowOpenHandler
提供的选项。Note that 请注意,webContents.setWindowOpenHandler
has final say and full privilege because it is invoked in the main process.webContents.setWindowOpenHandler
拥有最终发言权和完全权限,因为它是在主进程中调用的。
window.open(url[, frameName][, features])
url
stringframeName
string (optional)features
string (optional)
Returns Window | null返回Window
| null
features
is a comma-separated key-value list, following the standard format of the browser. 是一个逗号分隔的键值列表,遵循浏览器的标准格式。Electron will parse 为了方便起见,Electron将在可能的情况下从该列表中解析BrowserWindowConstructorOptions
out of this list where possible, for convenience. BrowserWindowConstructorOptions
。For full control and better ergonomics, consider using 为了实现完全控制和更好的人体工程学,可以考虑使用webContents.setWindowOpenHandler
to customize the BrowserWindow creation.webContents.setWindowOpenHandler
来自定义BrowserWindow的创建。
A subset of WebPreferences
can be set directly, unnested, from the features string: zoomFactor
, nodeIntegration
, preload
, javascript
, contextIsolation
, and webviewTag
.WebPreferences
的一个子集可以从功能字符串中直接设置,无需测试:zoomFactor
、nodeIntegration
、preload
、javascript
、contextIsolation
和webviewTag
。
For example:例如:
window.open('https://github.com', '_blank', 'top=500,left=200,frame=false,nodeIntegration=no')
Notes:
Node integration will always be disabled in the opened如果在父窗口上禁用了节点集成,则在打开的window
if it is disabled on the parent window.window
中将始终禁用节点集成。Context isolation will always be enabled in the opened如果在父窗口上启用了上下文隔离,则将始终在打开的window
if it is enabled on the parent window.window
中启用上下文隔离。JavaScript will always be disabled in the opened如果在父窗口上禁用了JavaScript,则在打开的window
if it is disabled on the parent window.window
中将始终禁用JavaScript。Non-standard features (that are not handled by Chromium or Electron) given infeatures
will be passed to any registeredwebContents
'sdid-create-window
event handler in theoptions
argument.features
中给定的非标准功能(不由Chromium或Electron处理)将传递给options
参数中任何注册的webContents
的did-create-window
事件处理程序。frameName
follows the specification of遵循本机文档中的windowName
located in the native documentation.windowName
规范。When opening当打开about:blank
, the child window'sWebPreferences
will be copied from the parent window, and there is no way to override it because Chromium skips browser side navigation in this case.about:black
时,子窗口的WebPreferences
将从父窗口复制,并且无法覆盖它,因为Chromium在这种情况下跳过浏览器端导航。
To customize or cancel the creation of the window, you can optionally set an override handler with 要自定义或取消窗口的创建,您可以从主进程中选择使用webContents.setWindowOpenHandler()
from the main process. webContents.setWindowOpenHandler()
设置覆盖处理程序。Returning 返回{ action: 'deny' }
cancels the window. { action: 'deny' }
将取消窗口。Returning 返回{action: 'allow', overrideBrowserWindowOptions: { ... } }
will allow opening the window and setting the BrowserWindowConstructorOptions
to be used when creating the window. {action: 'allow', overrideBrowserWindowOptions: { ... } }
将允许打开窗口,并将BrowserWindowConstructorOptions
设置为在创建窗口时使用。Note that this is more powerful than passing options through the feature string, as the renderer has more limited privileges in deciding security preferences than the main process.请注意,这比通过功能字符串传递选项更强大,因为渲染器在决定安全首选项方面的权限比主进程更有限。
In addition to passing in 除了传入action
and overrideBrowserWindowOptions
, outlivesOpener
can be passed like: { action: 'allow', outlivesOpener: true, overrideBrowserWindowOptions: { ... } }
. action
和overrideBrowserWindowOptions
之外,outlivesOpener
还可以像以下方式传递:{ action: 'allow', outlivesOpener: true, overrideBrowserWindowOptions: { ... } }
。If set to 如果设置为true
, the newly created window will not close when the opener window closes. true
,则在打开窗口关闭时,新创建的窗口将不会关闭。The default value is 默认值为false
.false
。
Native Window
example原生Window
示例
Window
example// main.js
const mainWindow = new BrowserWindow()
// In this example, only windows with the `about:blank` url will be created.
// All other urls will be blocked.
mainWindow.webContents.setWindowOpenHandler(({ url }) => {
if (url === 'about:blank') {
return {
action: 'allow',
overrideBrowserWindowOptions: {
frame: false,
fullscreenable: false,
backgroundColor: 'black',
webPreferences: {
preload: 'my-child-window-preload-script.js'
}
}
}
}
return { action: 'deny' }
})
// renderer process (mainWindow)
const childWindow = window.open('', 'modal')
childWindow.document.write('<h1>Hello</h1>')