Electron渲染进程与主进程通信,主进程监听并响应

大部分渲染进程无法调用的api都是通过与主进程通信,主进程完成调用后再返回结果给渲染进程的

一个来自https://blog.liboliu.com/a/105网友的图示:

举例:

我们通过点击渲染进程上的一个按钮，主进程弹出文件选择框并读取文件内容，然后将文件内容传递至渲染进程来完成主进程和渲染进程之间的协作。如下图:

正文:

先确保已配置nodeIntegration为true:

new BrowserWindow({
    // .......
    webPreferences: {
        nodeIntegration: true, // 允许在网页中使用 node
    },
});

利用 ipcMain 与 ipcRenderer 通信

通过事件的订阅或与发布，实现渲染进程与主进程之间的通信。

渲染进程发出->主进程接收->主进程响应渲染进程->渲染进程接收主进程回发的信息

在渲染进程里，使用 ipcRenderer 向主线程发出通知

const { ipcRenderer } = require("electron");
ipcRenderer.send("sendMessage", "我是渲染进程");

主进程通过ipcMain接收并响应渲染进程

 ipcMain.on("sendMessage", (event, args) => {
    console.log("收到渲染进程的消息",  args);
    win.webContents.send("receiveMessage", "我是主进程,已收到消息" + args);
  });

渲染进程里使用ipcRenderer接收:

const { ipcRenderer } = require("electron");    
ipcRenderer.on('receiveMessage', (event, args)=>{
   console.log('接收到主进程的消息',args)
})