Komunikuj się z <webview> w Electron

Question

Mam <webview> w mojej aplikacji Electron. Chciałbym mieć bezpieczną "zagraniczną" komunikację, tak jakbym to robiła z iframe do postMessage. Tak więc na przykład:

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

jest moim jedynym wyborem dla komunikacji z tym subwebview włączyć nodeIntegration tak, że można używać sendToHost? Włączenie wszystkich nodeIntegration tylko dla tej jednej funkcji wydaje się przesadą.

Answer 1

Dostęp do funkcji API Electron można uzyskać w skrypcie webviewpreload, w tym IPC, nawet gdy nodeIntegration jest wyłączony. Twój skrypt wstępnego ładowania może wstrzykiwać funkcje do globalnej przestrzeni nazw, które będą wtedy dostępne na stronie załadowanej w webview. Prosty przykład:

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>