ipcMain和ipcRenderer的通信的四种通信方法

Electron中的ipcMain和ipcRenderer模块提供了四种不同的通信方法，可以在主进程和渲染进程之间传递消息：

1. `ipcMain.on(channel, listener)` 和 `ipcRenderer.send(channel, ...args)`：这种方法是最简单和最常见的，渲染进程使用 `ipcRenderer.send()` 发送消息，主进程使用 `ipcMain.on()` 监听消息，并且可以使用 `event.reply()` 方法回复消息给渲染进程。

在主进程中：

const { ipcMain } = require('electron')

ipcMain.on('message', (event, arg) => {
  console.log(arg) // 输出 "hello from renderer"
  event.reply('reply', 'hello from main')
})

在渲染进程中：

const { ipcRenderer } = require('electron')

ipcRenderer.send('message', 'hello from renderer')

ipcRenderer.on('reply', (event, arg) => {
  console.log(arg) // 输出 "hello from main"
})

2. `ipcRenderer.invoke(channel, ...args)` 和 `ipcMain.handle(channel, listener)`：这种方法可以让渲染进程发送一个带有返回值的消息，主进程使用 `ipcMain.handle()` 监听消息并且返回一个值，渲染进程使用 `ipcRenderer.invoke()` 发送消息并且等待返回值。

在主进程中：

const { ipcMain } = require('electron')

ipcMain.handle('sum', (event, ...args) => {
  const sum = args.reduce((a, b) => a + b, 0)
  return sum
})

在渲染进程中：

const { ipcRenderer } = require('electron')

async function calculateSum() {
  const result = await ipcRenderer.invoke('sum', 1, 2, 3, 4, 5)
  console.log(result) // 输出 15
}

calculateSum()

3. `webContents.send(channel, ...args)` 和 `ipcMain.on(channel, listener)`：这种方法是在主进程中向指定的渲染进程发送消息，主进程使用 `webContents.send()` 发送消息给指定的渲染进程，渲染进程使用 `ipcMain.on()` 监听消息。

在主进程中：

const { BrowserWindow } = require('electron')

const win = new BrowserWindow()

win.loadFile('index.html')

win.webContents.send('message', 'hello from main')

在渲染进程中：

const { ipcRenderer } = require('electron')

ipcRenderer.on('message', (event, arg) => {
  console.log(arg) // 输出 "hello from main"
})

4. `ipcRenderer.sendToHost(channel, ...args)` 和 `ipcMain.on('did-frame-finish-load', listener)`：这种方法是在渲染进程中向它所关联的窗口的主进程发送消息，渲染进程使用 `ipcRenderer.sendToHost()` 发送消息给主进程，主进程使用 `webContents.on('did-frame-finish-load', listener)` 监听消息。

在主进程中：

const { BrowserWindow } = require('electron')

const win = new BrowserWindow()

win.loadURL('https://www.google.com')
win.webContents.on('did-frame-finish-load', () => {
  win.webContents.send('message', 'hello from main')
})

在渲染进程中：

const { ipcRenderer } = require('electron')

ipcRenderer.on('message', (event, arg) => {
  console.log(arg) // 输出 "hello from main"
})

这就是Electron中ipcMain和ipcRenderer的四种通信方法。根据具体的使用场景，选择不同的通信方法可以更加方便和高效地进行进程间通信。