Electron 中 ipcRenderer 与 ipcMain 通讯的Typescript实现

Electron 中 ipcRenderer 与 ipcMain 通讯的Typescript实现

在Electron应用程序中，可以使用ipcRenderer和ipcMain模块进行进程间通信。官方文档中也给出了javascript的版本，下面是Typescipt的实现步骤，以及过程中遇到的问题。

在主进程中监听消息

在主进程中，使用ipcMain来设置IPC监听器：

import { ipcMain } from 'electron';

ipcMain.on('setTitle', (event, title) => {
  const webContents = event.sender;
  const win = BrowserWindow.fromWebContents(webContents)
  win?.setTitle(title);
});

ipcMain.handle('ping', (event, value) => {
  return `${value} pong`;
});

通过preload.ts暴露ipcRenderer相关API

默认情况下，前端不直接访问Electron模块，不直接使用ipcRenderer，而是通过preload

import { contextBridge, ipcRenderer } from "electron";

//通过contextBridge 向渲染进程暴露一个全局的window.elec