electron 封装 preload 让后面编写不需要每次都在preload中写通讯方法

Electron 的预加载脚本（preload script）是一个特殊的脚本，它在 Electron 应用的上下文中运行，可以用来暴露特定的 Node.js 功能给渲染进程，同时避免全局污染。通过这种方式，你可以在 preload 脚本中设置好通信机制，从而避免在每个渲染进程的窗口加载时都重复编写通讯方法。

封装 preload 脚本的基本思路是创建一个通用的 preload 文件，该文件中包含所有必要的通信逻辑和接口暴露。然后在创建窗口时，通过 `webPreferences` 的 `preload` 属性指定这个文件路径。

这里是一个简单的步骤说明如何封装 preload 脚本：

1. 创建一个通用的 preload.js 文件，它将包含所有安全地将 Node.js 功能暴露给前端的代码。例如，你可以使用 `contextBridge` 和 `ipcRenderer` 模块来安全地进行进程间通信（IPC）。

// preload.js
const { contextBridge, ipcRenderer } = require('electron');

// 通过 contextBridge 暴露安全的 API 给渲染进程
contextBridge.exposeInMainWorld('electronAPI', {
  send: (channel, ...args) => {
    // 确保只使用允许的 API
    let validChannels = ['toMain', 'fromMain'];
    if (validChannels.includes(channel)) {
      ipcRenderer.send(channel, ...args);
    }
  },
  receive: (channel, func) => {
    let validChannels = ['toMain', 'fromMain'];
    if (validChannels.includes(channel)) {
      // 执行监听时，确保不会传递任何原生对象
      ipcRenderer.on(channel, (event, ...args) => func(...args));
    }
  }
});

2. 在创建 Electron 窗口时，通过 `webPreferences` 引入你的 preload.js 文件：

// 创建浏览器窗口
const { BrowserWindow } = require('electron');

function createWindow() {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js'), // 使用封装好的 preload 文件
    },
  });

  win.loadFile('index.html');
}

app.whenReady().then(createWindow);

3. 在渲染进程中，你可以通过暴露的 `electronAPI` 来通信：

// 渲染进程中使用
window.electronAPI.send('toMain', 'Hello from Renderer!');
window.electronAPI.receive('fromMain', (response) => {
  console.log(response); // 在控制台输出来自 Main 进程的消息
});

通过这种方式，你就可以避免在每个渲染进程的文件中重复编写通信方法的代码，使得代码更加模块化和易于维护。