electron/docs/api/window-open.md

95 lines
2.9 KiB
Markdown
Raw Normal View History

2016-05-17 23:02:54 +00:00
# `window.open` Function
> Open a new window and load a URL.
2015-08-29 06:21:09 +00:00
When `window.open` is called to create a new window in a web page, a new instance
2017-11-29 11:13:45 +00:00
of [`BrowserWindow`](browser-window.md) will be created for the `url` and a proxy will be returned
to `window.open` to let the page have limited control over it.
2015-08-29 06:21:09 +00:00
The proxy has limited standard functionality implemented to be
compatible with traditional web pages. For full control of the new window
you should create a `BrowserWindow` directly.
The newly created `BrowserWindow` will inherit the parent window's options by
default. To override inherited options you can set them in the `features`
string.
2015-08-29 06:21:09 +00:00
### `window.open(url[, frameName][, features])`
* `url` String
2015-08-29 06:21:09 +00:00
* `frameName` String (optional)
* `features` String (optional)
2016-12-19 17:40:07 +00:00
Returns [`BrowserWindowProxy`](browser-window-proxy.md) - Creates a new window
and returns an instance of `BrowserWindowProxy` class.
The `features` string follows the format of standard browser, but each feature
has to be a field of `BrowserWindow`'s options.
**Notes:**
2016-10-25 03:35:18 +00:00
* Node integration will always be disabled in the opened `window` if it is
disabled on the parent window.
* Context isolation will always be enabled in the opened `window` if it is
enabled on the parent window.
* JavaScript will always be disabled in the opened `window` if it is disabled on
the parent window.
* Non-standard features (that are not handled by Chromium or Electron) given in
`features` will be passed to any registered `webContent`'s `new-window` event
handler in the `additionalFeatures` argument.
2016-03-30 17:55:16 +00:00
2015-08-29 06:21:09 +00:00
### `window.opener.postMessage(message, targetOrigin)`
* `message` String
* `targetOrigin` String
Sends a message to the parent window with the specified origin or `*` for no
origin preference.
2017-03-19 09:35:12 +00:00
### Using Chrome's `window.open()` implementation
2017-03-19 09:35:12 +00:00
If you want to use Chrome's built-in `window.open()` implementation, set
`nativeWindowOpen` to `true` in the `webPreferences` options object.
2017-03-19 09:35:12 +00:00
Native `window.open()` allows synchronous access to opened windows so it is
convenient choice if you need to open a dialog or a preferences window.
This option can also be set on `<webview>` tags as well:
```html
<webview webpreferences="nativeWindowOpen=yes"></webview>
```
The creation of the `BrowserWindow` is customizable via `WebContents`'s
`new-window` event.
2017-03-19 09:35:12 +00:00
```javascript
2017-03-19 11:30:07 +00:00
// main process
const mainWindow = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nativeWindowOpen: true
}
})
2017-03-19 09:35:12 +00:00
mainWindow.webContents.on('new-window', (event, url, frameName, disposition, options, additionalFeatures) => {
2017-03-19 11:30:07 +00:00
if (frameName === 'modal') {
2017-03-19 09:35:12 +00:00
// open window as modal
event.preventDefault()
Object.assign(options, {
modal: true,
parent: mainWindow,
width: 100,
height: 100
})
2017-03-28 10:50:45 +00:00
event.newGuest = new BrowserWindow(options)
2017-03-19 09:35:12 +00:00
}
2017-03-19 11:09:52 +00:00
})
2017-03-19 09:35:12 +00:00
```
2017-03-19 11:30:07 +00:00
```javascript
// renderer process (mainWindow)
let modal = window.open('', 'modal')
modal.document.write('<h1>Hello</h1>')
```