klren0312 / daliy_knowledge

知识积累,正确使用方式是watch
21 stars 4 forks source link

electron 做指定dom全屏, requestFullscreen不需要用户操作的方法 #825

Open klren0312 opened 7 months ago

klren0312 commented 7 months ago

通过主进程来进行全屏操作

1. preload中暴露通信方法

const { contextBridge, ipcRenderer } = require('electron')

contextBridge.exposeInMainWorld('electron', {
  doFull: (id) => {
    ipcRenderer.invoke('doFull', id)
  }
})

2. 主进程中接收通信消息, executeJavaScript方法第二个参数传true, 可去除限制, 从而进行全屏api调用

ipcMain.handle('doFull', (e, id) => {
    mainWindow.webContents.executeJavaScript(`
      document.getElementById("${id}").requestFullscreen()
    `, true)
      .then((result) => {
        console.log(result) // Will be the JSON object from the fetch call
      })
  })