Electron中webview注入JS无法发消息：ipcRenderer未定义

我想通过webview.executeJavaScript向WebView注入JavaScript代码，让其向主进程或渲染进程发送消息。查资料得知，在WebView的预加载脚本中引入ipcRenderer后，即可在WebView内容的JS里调用ipcRenderer.send()或ipcRenderer.sendToHost()实现通信，但实际尝试后全部报错，提示注入的JS中ipcRenderer未定义。

我还尝试过用webContents替代ipcRenderer，以及按照资料提示在预加载脚本中将方法挂载到window对象上，均无效。

目前已确认：

• 注入的JS确实执行了（弹出了验证提示）
• 预加载脚本已成功加载（弹出了验证提示）
• 直接在预加载脚本中调用ipcRenderer.send()是有效的

代码示例 #

index.html #

两种写法均测试过：

<webview id="test_webview" preload="webview_preload.js" src="http://192.168.1.182/"></webview>

或：

<webview id="test_webview" preload="webview_preload.js" src="http://192.168.1.182/" disablewebsecurity></webview>

renderer.js #

function init() {
  let wv = document.getElementById("test_webview");
  wv.addEventListener('dom-ready', () => {
    wv.executeJavaScript('alert("javascript has been injected into webview"); try { ipcRenderer.send("ping"); } catch(e) { alert(e); }; try { webContents.send("ping"); } catch(e) { alert(e); }; try { window.sendData("ping"); } catch(e) { alert(e); }');
  });
}

window.addEventListener("DOMContentLoaded", init);

webview_preload.js #

const { ipcRenderer, webContents } = require('electron');

window.sendData = (data) => {
  ipcRenderer.send("ping");
}

alert("webview_preload.js has been loaded into webview");

内容的提问来源于stack exchange，提问作者KevinHJ