肥猫科普：Electron通信一探究竟，四种模式举例详解！

大家好，我是你们的老朋友肥猫！今天咱们一起探讨一下在Electron中进程间的通信方式，确保没有哪条信息被走丢。

模式 1：渲染器进程到主进程（单向）

在这个模式中，渲染进程使用ipcRenderer.send()向主进程发送消息，主进程通过ipcMain.on()接收消息。

使用案例：

假设我们有一个在渲染进程中触发的事件，需要通知主进程，例如请求读取文件，我们可以使用Preload脚本来实现：

预加载脚本(preload.js)：

window.sendReadFileRequest = function() {
  require('electron').ipcRenderer.send('read-file');
}

渲染器进程：

window.sendReadFileRequest();

主进程：

ipcMain.on('read-file', (event) => {
  // 文件读取操作
});

模式 2：渲染器进程到主进程（双向）

在这个模式中，主进程可以使用event.reply()响应渲染进程的消息。

使用案例：

假设我们想从主进程获取系统信息，我们可以在预加载脚本中创建一个函数来实现：

预加载脚本(preload.js)：

window.getSystemInfo = function() {
  require('electron').ipcRenderer.send('get-system-info');
}

渲染器进程：

window.getSystemInfo();

主进程：

ipcMain.on('get-system-info', (event) => {
  event.reply('system-info', { cpu: 'Intel', os: 'Windows' });
});

模式 3：主进程到渲染器进程

在这个模式中，主进程使用webContents.send()向渲染进程发送消息，渲染进程通过ipcRenderer.on()接收消息。

使用案例：

假设主进程想要向渲染进程发送一条消息，我们可以在预加载脚本中定义一个函数来接收此消息：

预加载脚本(preload.js)：

window.receiveMessageFromMain = function(callback) {
  require('electron').ipcRenderer.on('message-from-main', (event, message) => {
    callback(message);
  });
}

主进程：

win.webContents.send('message-from-main', 'Hello, Renderer!');

渲染器进程：

window.receiveMessageFromMain((message) => {
  console.log(message); // 输出 "Hello, Renderer!"
});

模式 4：渲染器进程到渲染器进程

这个模式涉及到使用webContents.send()和ipcRenderer.on()在两个渲染进程之间进行通信。由于在渲染进程中无法直接获取其他渲染进程的webContents，通常我们会通过主进程来转发消息。

使用案例：

假设有两个渲染进程A和B，A想要向B发送一条消息，我们可以在预加载脚本中定义一个函数来实现：

预加载脚本(preload.js)：

window.sendMessageToB = function(message) {
  require('electron').ipcRenderer.send('message-to-B', message);
}
window.receiveMessageFromA = function(callback) {
  require('electron').ipcRenderer.on('message-from-A', (event, message) => {
    callback(message);
  });
}

渲染器进程A：

window.sendMessageToB('Hello, B!');

主进程：

ipcMain.on('message-to-B', (event, message) => {
  winB.webContents.send('message-from-A', message);
});

渲染器进程B：

window.receiveMessageFromA((message) => {
  console.log(message); // 输出 "Hello, B!"
});

这就是Electron的进程间通信的四种模式，希望这些案例能帮助你理解和使用它们。如果你觉得这篇文章对你有帮助，别忘了点赞和关注哦！