Electron -- 预加载脚本preload.js（三）

preload.js 是一个在渲染进程加载之前执行的脚本，它有权访问渲染器全局（例如 window 和 document）和 Node.js 环境（主进程）。这个脚本在网页内容加载之前执行，它具有比普通渲染器更高的权限，可以访问 Node.js API，同时也可以与网页内容安全的交互。

在 Electron 的 BrowserWindow 配置中指定 preload.js 路径。这个脚本在网页加载之前执行，但在网页的 JavaScript 开始运行之后： 

// main.js
const { app, BrowserWindow } = require('electron');
let mainWindow;
function createWindow() {
    mainWindow = new BrowserWindow({
        width: 800,
        height: 600,
        webPreferences: {
            preload: path.join(__dirname, 'preload.js'),
            contextIsolation: true, // 推荐开启
            enableRemoteModule: false // 推荐禁用，用ipcMain和ipcRenderer代替
        }
    });
    mainWindow.loadFile('index.html');
}
app.on('ready', createWindow);

// preload.js
const { contextBridge, ipcRenderer } = require('electron');
contextBridge.exposeInMainWorld(
    'api', {
        send: (channel, data) => {
            // 白名单通道
            let validChannels = ['toMain'];
            if (validChannels.includes(channel)) {
                ipcRenderer.send(channel, data);
            }
        },
        receive: (channel, func) => {
            let validChannels = ['fromMain'];
            if (validChannels.includes(channel)) {
                // 过滤通道，只接受预定义的通道
                ipcRenderer.on(channel, (event, ...args) => func(...args));
            }
        }
    }
);

注：contextBridge 用于在网页中安全地暴露 send 和 receive 方法，这些方法通过 ipcRenderer 与主进程进行通信，同时也限制了可以使用的通道，提高了安全性。

开发electron应用，preload.js 很重要： 

preload.js 文件在 Electron 应用中起着桥梁的作用，使得在保持安全的同时，渲染进程可以访问主进程的功能。通过精心设计 preload 脚本，可以有效地加强应用的安全性，避免直接暴露过多的 Node.js API 给可能的前端网页（渲染进程端）攻击。

 END.