Открытие окон из рендера

Существует несколько способов управления созданием окон из надёжного или ненадежного контента внутри рендера. Окна могут быть созданы из рендера двумя способами:

• нажатием на ссылки или отправкой форм, украшенных target=_blank
• вызовом JavaScript window.open()

Для контента с одинаковым происхождением новое окно создаётся в том же процессе, позволяя родительскому окну напрямую обращаться к дочернему. Это может быть очень полезно для под-окон приложения, которые действуют как панели настроек или подобные, так как родительское окно может напрямую отображать содержимое в под-окне, как если бы это был div в родительском окне. Это поведение аналогично поведению в браузере.

Electron связывает этот родной Chrome Window с BrowserWindow внутри. Вы можете воспользоваться всеми возможностями настройки, доступными при создании BrowserWindow в основном процессе, используя webContents.setWindowOpenHandler() для окон, созданных рендером.

Параметры конструктора BrowserWindow устанавливаются в порядке убывания приоритета: проанализированные параметры из строки features из window.open(), параметры безопасности webPreferences, унаследованные от родительского окна, и параметры, заданные в webContents.setWindowOpenHandler. Обратите внимание, что webContents.setWindowOpenHandler имеет решающее слово и полный доступ, поскольку он вызывается в главном процессе.

window.open(url[, frameName][, features])​

• url строка
• frameName строка (необязательно)
• features строка (необязательно)

Возвращает Window | null

features — это список пар ключ-значение, разделённых запятыми, следуя стандартному формату браузера. Electron будет парсить BrowserWindowConstructorOptions из этого списка, где это возможно, для удобства. Для полного контроля и лучшей эргономики рассмотрите использование webContents.setWindowOpenHandler для настройки создания BrowserWindow.

Подмножество WebPreferences может быть установлено напрямую, без вложенности, из строки параметров: zoomFactor, nodeIntegration, preload, javascript, contextIsolation, и webviewTag.

Например:

window.open('https://github.com', '_blank', 'top=500,left=200,frame=false,nodeIntegration=no')

Примечания:

• Интеграция Node всегда будет отключена в открытом window если она отключена в родительском окне.
• Изоляция контекста всегда будет включена в открытом window если она включена в родительском окне.
• JavaScript всегда будет отключен в открытом window если он отключен в родительском окне.
• Нестандартные параметры (которые не обрабатываются Chromium или Electron), указанные в features будут переданы в любой зарегистрированный webContents обработчик события did-create-window в аргументе options.
• frameName следует спецификации windowName в родной документации.
• При открытии about:blank, свойство WebPreferences дочернего окна будет скопировано из родительского окна, и нет способа его переопределить, так как Chromium пропускает навигацию со стороны браузера в этом случае.

Для настройки или отмены создания окна вы можете установить обработчик переопределения с помощью webContents.setWindowOpenHandler() из основного процесса. Возврат { action: 'deny' } отменяет создание окна. Возврат { action: 'allow', overrideBrowserWindowOptions: { ... } } позволит открыть окно и установить BrowserWindowConstructorOptions для использования при создании окна. Обратите внимание, что это более мощно, чем передача параметров через строку параметров, так как у рендера меньше привилегий в определении настроек безопасности, чем у основного процесса.

Помимо передачи action и overrideBrowserWindowOptions, outlivesOpener можно передать так: { action: 'allow', outlivesOpener: true, overrideBrowserWindowOptions: { ... } }. Если установлено в true, новое окно не будет закрываться при закрытии окна-открывателя. Значение по умолчанию — false.

Пример родного Window​

// 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>')