Electron中页面之间的通信

Posted 2021-03-13 flamestudio

Electron的运行环境为Chromium + Node.js, 而Chromium采用的是多进程机制,

也就是说每个页面都是一个独立的进程(渲染进程)，因此页面之间是没有直接关系的，

要想进行通信，需要借助主进程作为桥梁。

所以我们首先先来学习主进程和渲染进程怎么通信:

1. 渲染进程---->主进程

发送端:

　　ipcRenderer.send(channel, data)

接收端:

　　ipcMain.on(channel, listener)

2. 主进程---->渲染进程

发送端:

　　① 被动发送

　　在主进程通过ipcMain.on接收到渲染进程的消息时，可以通过listener函数的event参数得到发送者, 回复消息,

　　event.sender.send(channel, data)

　　② 主动发送

　　win(要发送给的渲染进程窗体对象变量).webContents.send(channel, data)

 接收端:

　　ipcRenderer.on(channel, listener)

 

有了以上背景知识，页面间通信就很简单了，页面1发送事件给主进程，主进程再发送事件给页面2即可。

 

注:

在Electron 5.x以后的版本，渲染进程默认没有启用Node.js环境, 

在创建窗体时需要指定启用Node环境，否则require命令在渲染进程中将不支持，无法导入electron中的ipcRenderer。

    let win = new BrowserWindow({
        webPreferences: {
            nodeIntegration: true
        }
    })