Electron -- 进程间通信（四）

1. ipcMain 和 ipcRenderer 模块

• ipcMain：在主进程中使用，用于监听渲染进程发送的消息，并处置惩罚这些消息。
  
• ipcRenderer：在渲染进程中使用，用于向主进程发送消息。
  

渲染进程（发送消息）：

1. // 在渲染进程中，使用 ipcRenderer 发送消息
2. const { ipcRenderer } = require('electron');
3. ipcRenderer.send('message-to-main', 'Hello from Renderer');

复制代码

主进程（吸收消息）： 

1. // 在主进程中，使用 ipcMain 监听消息
2. const { ipcMain } = require('electron');
3. ipcMain.on('message-to-main', (event, message) => {
4.   console.log(message); // 输出：Hello from Renderer
5. });

复制代码

2. invoke 方法（基于 Promise 的 IPC） 

• 使用 invoke 方法可以实现基于 Promise 的 IPC 通信，适用于需要等待主进程响应的场景。
  

渲染进程（使用 invoke 发送异步消息）： 

1. // 渲染进程中使用 invoke 发送异步消息
2. const { ipcRenderer } = require('electron');
3. ipcRenderer.invoke('async-message').then((result) => {
4.   console.log(result); // 处理结果
5. });

复制代码

主进程（处置惩罚异步消息）： 

1. // 主进程中处理异步消息
2. const { ipcMain } = require('electron');
3. ipcMain.handle('async-message', async () => {
4.   return 'Async response from main';
5. });

复制代码

 3. sendSync 方法（同步 IPC）

• sendSync 方法允许渲染进程同步地向主进程发送消息，并等待响应。
  

渲染进程（发送同步消息）： 

1. // 渲染进程中发送同步消息
2. const { ipcRenderer } = require('electron');
3. const response = ipcRenderer.sendSync('sync-message', 'Hello Sync');

复制代码

主进程（处置惩罚同步消息）： 

1. // 主进程中处理同步消息
2. const { ipcMain } = require('electron');
3. ipcMain.on('sync-message', (event, message) => {
4.   event.returnValue = `Sync response: ${message}`;
5. });

复制代码

4. 通过预加载脚本通信

• 预加载脚本（preload.js）可以在渲染进程中注入全局对象，用于与主进程通信。
  

预加载脚本（袒露 IPC 方法）： 

1. // preload.js
2. const { contextBridge, ipcRenderer } = require('electron');
3. contextBridge.exposeInMainWorld('electronAPI', {
4.   openUrlByDefaultBrowser: () => ipcRenderer.invoke('openUrlByDefaultBrowser', 'https://www.baidu.com')
5. });

复制代码

渲染进程（调用预加载脚本袒露的方法）：  

1. // 在渲染进程中调用预加载脚本暴露的方法
2. window.electronAPI.openUrlByDefaultBrowser();

复制代码

主进程（监听并处置惩罚预加载脚本的消息）：

1. // 主进程中监听并处理预加载脚本的消息
2. const { ipcMain } = require('electron');
3. const { shell } = require('electron');
4. ipcMain.handle('openUrlByDefaultBrowser', (event, url) => {
5.   shell.openExternal(url);
6. });

复制代码

5. 不同渲染进程之间的通信 

• Electron 没有直接的方法可以在渲染进程之间发送消息，但可以通过主进程转发消息。
  

渲染进程1（发送消息）： 

1. // 渲染进程1发送消息给主进程
2. const { ipcRenderer } = require('electron');
3. ipcRenderer.send('forward-message', 'Hello from Renderer 1');

复制代码

 渲染进程2（吸收消息）：

1. // 渲染进程2监听接收消息
2. const { ipcRenderer } = require('electron');
3. ipcRenderer.on('received-message', (event, message) => {
4.   console.log(message); // 输出：Hello from Renderer 1
5. });

复制代码

END.

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。