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=_blanktarget=_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])
urlstringframeNamestring (optional)featuresstring (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如果在父窗口上禁用了节点集成,则在打开的windowif it is disabled on the parent window.window中将始终禁用节点集成。Context isolation will always be enabled in the opened如果在父窗口上启用了上下文隔离,则将始终在打开的windowif it is enabled on the parent window.window中启用上下文隔离。JavaScript will always be disabled in the opened如果在父窗口上禁用了JavaScript,则在打开的windowif it is disabled on the parent window.window中将始终禁用JavaScript。Non-standard features (that are not handled by Chromium or Electron) given infeatureswill be passed to any registeredwebContents'sdid-create-windowevent handler in theoptionsargument.features中给定的非标准功能(不由Chromium或Electron处理)将传递给options参数中任何注册的webContents的did-create-window事件处理程序。frameNamefollows the specification of遵循本机文档中的windowNamelocated in the native documentation.windowName规范。When opening当打开about:blank, the child window'sWebPreferenceswill 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>')