一个渲染器 process/main window 的多个 js 文件中的 ipcRenderer 侦听器未被调用

Question

使用纯 js 构建电子应用程序。我有一个 mainWindow 和一个 webContents（用 webContents.getAllWebContents() 检查）。在主要 window 中，我有两个不同的文件，一个是从一开始就加载的 (mainWindow.js)，另一个是动态加载的 (customerList.js)。

所以，从主进程我是运行 mainWindow.webContents.send('customer:display', customerObject);。然后在 customerList.js 我有

const customerElectron = require('electron');

customerElectron.ipcRenderer.on('customer:display', (e, customer) => {
  console.log('customer: ', customer);
};

这没有被调用。为了检查它是否被调用，我将其添加到 mainWindow.js:

const mainElectron = require('electron');

mainElectron.ipcRenderer.on('customer:display', (e, customer) => {
  console.log(customer, 'customer');
};

这正在被调用并记录正确的客户对象。由于只有一个 webContents，我假设 ipcRenderer 只是将事件添加到其中。另外，我检查了是否通过将侦听器包装在 console.log(JSON.stringify(customerElectron.ipcRenderer)) 中来添加事件。在创建侦听器之前，它有 0 个事件，之后它有 1 个事件。所以添加监听的代码肯定是调用了

由于js脚本属于动态加载的内容，目前需要在内容加载到DOM之后再加载，所以我不能只在我的mainWindow.js中添加监听器。这个问题有解决办法吗？一般来说，一个渲染器进程有多个 js 文件，以及其中需要多个 electron 是不是一个问题？

Answer 1

我找到了问题的解决方案：

首先，在 mainWindow.js 中，我在全局范围内使用 var:

声明了 electron

var electron = require('electron');

这使得它在其他脚本中可用。我还向脚本添加了一个 onload 事件，以等待脚本加载完毕。在 mainWindow.js:

// loading dynamic content here
callback = _ => { ipcRenderer.send('content:added', '') };
// script contains the script node
script.onload = callback;

在customerList.js中：

electron.ipcRenderer.on('customer:display', customer => {
  console.log('Customer: ', customer);
});

然后在 main.js:

// customerObject is a defined customerObject
ipcMain.on('content:added', _ => {
  mainWindow.webContents.send('customer:display', customerObject);
};

这最终调用了 customerList.js 中的事件，并在 mainWindow 中记录了正确的客户对象。

一个渲染器 process/main window 的多个 js 文件中的 ipcRenderer 侦听器未被调用

ipcRenderer listeners in multiple js files for one renderer process/main window not being called

javascript

ipc

electron