系列文章目录

第一节 electron 介绍

第二节创建electron项目并启动

第三节 Electron运行流程、主进程渲染进程并使用nodejs

第四节 Electron 调用H5事件结合node模块fs 实现文件拖拽读取

第五节 Electron 模块介绍 remote模块详细介绍

第六节 Electron安全策略

第七节 Electron顶部菜单及右键菜单

前言

渲染进程通过事件执行主进程里的方法或者渲染进程通知主进程去处理事件，处理完成后广播一个事件给渲染进程，让渲染进程去处理。这就用到了主进程和渲染进程的通信。

实现方法

主进程和渲染进程的通信主要用到两个模块：ipcMain 和 ipcRenderer

ipcMain: 处理渲染进程发送过来的消息，或从主进程给渲染进程发送消息

ipcRenderer:渲染进程发送同步或者异步的消息给主进程? 或者接受主进程的消息

渲染进程调用主进程方法并给主进程发送消息有三种情况

1、渲染进程给主进程执行主进程的方法并给主进程发送消息

知识点：

// 渲染进程

const { ipcRenderer } = require('electron')

ipcRenderer.send("sendMsg", "i am renderer") //异步

// 主进程

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

ipcMain.on("sendMsg",(e,data)=>{

? console.log("data",data)

})

2、渲染进程给主进程发送消息，主进程收到后回复给渲染进程

知识点：

// 渲染进程

const { ipcRenderer } = require('electron')

ipcRenderer.send("sendMsgReplay", "i am ipcRenderer i hope your replay") //异步

ipcRenderer.on("mainReplay", (e, data) => {

? ? console.log(data)

? })
// 主进程

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

ipcMain.on("sendMsgReplay",(e,data)=>{

? e.sender.send('mainReplay','我是主进程我已经收到你的信息了')

})

3、对情况2的改进? 渲染进程给主进程发送同步消息

知识点：

// 渲染进程

const { ipcRenderer } = require('electron')

ipcRenderer.sendSync("sendMsgReplaySync", "i am ipcRenderer i hope your replay")

// 主进程

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

// 接收同步消息

ipcMain.on("sendMsgReplaySync",(e,data)=>{?

? e.returnValue='我是主进程我已经收到你的信息了'

}) ?

主进程主动给渲染进程发送消息?

知识点：

// 渲染进程

const { ipcRenderer } = require('electron')

ipcRenderer.on("memuReply", (e, data) => {

? ? console.log(data)

? })
// 主进程

const {BrowserWindow } = require("electron");

BrowserWindow.getFocusedWindow().webContents.send("memuReply","我是主进程要触发渲染进程的方法")