Два браузера в одном окне Electron

Question

Я хотел бы иметь одно электронное окно , разделенное на две части:

• левая часть - BrowserWindow загрузка https://gmail.com

• правая часть - еще одна BrowserWindow, также загружающая Gmail, но я бы хотел, чтобы эти два браузера были "независимыми", то есть cookie / LocalStorage / etc. должен быть независимым (например, если у нас нормальное окно Chrome против окна инкогнито); что позволяет иметь одну учетную запись Gmail слева / другую учетную запись, подключенную в правой части

• некоторые другие кнопки пользовательского интерфейса в верхней части отдельного окна Electron.

Этот код работает, но он создает 2 окна вместо одного:

const { app, BrowserWindow } = require('electron')
const path = require('path')

app.once('ready', () => {
  let win = new BrowserWindow({show: false})
  win.once('show', () => { win.webContents.executeJavaScript('validateFlights()') })
  win.loadURL('https://www.gmail.com')
  win.show()

  let win2 = new BrowserWindow({show: false})
  win2.once('show', () => { win.webContents.executeJavaScript('validateFlights()') })
  win2.loadURL('https://www.gmail.com')
  win2.show()
})

Как их разместить в одном окне?

Answer 1

То, что вы ищете, это BrowserView

Из документов:

A BrowserView может использоваться для встраивания дополнительного веб-контента в BrowserWindow.Это похоже на дочернее окно, за исключением того, что оно расположено относительно своего собственного окна.Предполагается, что он является альтернативой тегу webview.

Похоже, это то, что вам нужно, представления могут отображать отдельные HTML-страницы и располагать их относительно внутри одного окна браузера.

// In the main process.
const { BrowserView, BrowserWindow } = require('electron')

let win = new BrowserWindow({ width: 800, height: 600 })
win.on('closed', () => {
  win = null
})

let view = new BrowserView({
  webPreferences: {
    nodeIntegration: false
  }
})
win.setBrowserView(view)
view.setBounds({ x: 0, y: 0, width: 300, height: 300 })
view.webContents.loadURL('https://electronjs.org')