electorn的核心理解

一、本质

Electron 的本质可以理解为将一个 Chromium 浏览器（WebView）和 Node.js 环境嵌套在一起。

二、核心

双进程机制

• 主进程（Main Process）：运行 Node.js 代码，负责控制应用的生命周期、创建窗口、跟操作系统进行交互。

• 渲染进程（Renderer Process）：嵌入的 Chromium 浏览器，运行前端页面，渲染用户界面，并处理用户交互。

三、通讯

采用进程间通信（IPC） 进行通信.

1. 主进程（Main Process） 和 渲染进程（Renderer Process） 通信的基本方式：

• ipcMain：用于主进程监听来自渲染进程的请求和消息。

• ipcRenderer：用于渲染进程向主进程发送请求或消息，并接收主进程的响应。

2. 主进程（Main Process） 与 渲染进程（Renderer Process） 通信的方式

a. 使用 ipcRenderer 和 ipcMain 进行异步通信

这是最常用的通信方式。渲染进程通过 ipcRenderer.send() 或 ipcRenderer.invoke() 发送消息，主进程通过 ipcMain.on() 或 ipcMain.handle() 监听并响应这些消息。

• ipcRenderer.send() 是一个简单的异步消息发送机制，主进程通过 ipcMain.on() 接收到消息并处理。

• ipcRenderer.invoke() 是一种更现代的异步通信方式，主进程通过 ipcMain.handle() 接收并返回结果。

b. ipcRenderer.send() 和 ipcMain.on() 示例：

主进程（main.js）：

const { ipcMain } = require('electron');

// 监听渲染进程发来的消息
ipcMain.on('send-message', (event, arg) => {
  console.log(arg);  // 打印渲染进程发来的数据
  // 可以回复渲染进程
  event.reply('receive-message', 'Hello from main process!');
});

渲染进程（index.html）：

<script>
  const { ipcRenderer } = require('electron');

  // 发送消息到主进程
  ipcRenderer.send('send-message', 'Hello from renderer process!');

  // 接收主进程的回复
  ipcRenderer.on('receive-message', (event, message) => {
    console.log(message);  // 打印主进程的消息
  });
</script>

c. ipcRenderer.invoke() 和 ipcMain.handle() 示例：

主进程（main.js）：

const { ipcMain } = require('electron');

// 处理渲染进程发来的异步请求
ipcMain.handle('get-data', async (event) => {
  // 模拟从文件系统获取数据
  return 'Some data from main process';
});

渲染进程（index.html）：

<script>
  const { ipcRenderer } = require('electron');

  // 异步请求主进程的某个操作并等待结果
  async function getData() {
    const data = await ipcRenderer.invoke('get-data');
    console.log(data);  // 打印主进程返回的数据
  }

  getData();  // 调用请求
</script>

同步 vs 异步通信

• 异步通信（send 和 on / invoke 和 handle）：这两种方式都不阻塞主进程或渲染进程的执行，消息和响应都是异步处理的。

  • ipcRenderer.send() 是一个单向的异步消息发送，主进程通过 ipcMain.on() 接收消息并处理。

  • ipcRenderer.invoke() 和 ipcMain.handle() 提供了请求/响应的模式，允许渲染进程发送请求并等待主进程返回数据。

• 同步通信（sendSync 和 handleSync）：你可以使用 ipcRenderer.sendSync() 和 ipcMain.handleSync() 进行同步通信，但这会阻塞调用，直到主进程响应，通常不推荐使用，除非有明确的需求。