在Electron中与<webview>进行通信

Question

我有一个<webview>在我的电子应用程序中.我想有安全的"洋"沟通,顺便我会继续iframe通过postMessage.例如:

webview.executeJavaScript("window.parent.postMessage('all done!')");

我是否可以选择与此子网站进行通信,nodeIntegration以便我可以使用sendToHost？nodeIntegration为这一个功能打开所有功能似乎有点矫枉过正.

Answer 1

您可以在webview 预加载脚本中访问Electron API ,包括IPC,即使在nodeIntegration禁用时也是如此.您的预加载脚本可以将函数注入全局命名空间,然后可以在加载的页面中访问该命名空间webview.一个简单的例子:

webview-preload.js:

const { ipcRenderer } = require('electron')    

global.pingHost = () => {
  ipcRenderer.sendToHost('ping')
}

webview-index.html:

<script>
  pingHost()
</script>

window-index.html:

<script>
  const webview = document.getElementById('mywebview')
  webview.addEventListener('ipc-message', event => {
    // prints "ping"
    console.log(event.channel)
  })
</script>