Electron 进程间通信

文章目录

  • 渲染进程到主进程(单向)
  • 渲染进程到主进程(双向)
  • 主进程到渲染进程 (单向,可模拟双向)

渲染进程到主进程(单向)

send (render 发送)on (main 监听)

// main.js 主要代码// electron/main includes types for all main process modules.
const { app, ipcMain } =  require("electron/main")
app.whenReady().then(()=>{// 需要在 HTML 文件加载之前监听,保证从渲染器调用之前处理程序能够准备就绪。ipcMain.on('set-title', (event, title) => {const webContents = event.senderconst win = BrowserWindow.fromWebContents(webContents)win.setTitle(title)})createWindow(); // 创建窗口
})
// preload.js // electron/renderer includes types for all renderer process modules.
const { contextBridge, ipcRenderer } = require("electron/renderer")
contextBridge.exposeInMainWorld("electronAPI", ()=>{setTitle: (title) => ipcRenderer.send('set-title',title)
})
// renderer.js// 插入html中的js, 运行于渲染程序中
const setButton = document.getElementById('btn')
const titleInput = document.getElementById('title')
setButton.addEventListener('click', () => {const title = titleInput.valuewindow.electronAPI.setTitle(title)
})

渲染进程到主进程(双向)

invoke(render 发送)handle(main 监听)

const { app, ipcMain, dialog } =  require("electron/main")
app.whenReady().then(()=>{// 需要在 HTML 文件加载之前监听,保证从渲染器调用之前处理程序能够准备就绪。// IPC 通道名称上的 dialog: 前缀对代码没有影响。 它仅用作命名空间以帮助提高代码的可读性。ipcMain.handle('dialog:openFile', async () => {const { canceled, filePaths } = await dialog.showOpenDialog()if(!canceled) return filePaths[0]})createWindow(); // 创建窗口
})
// preload.js // electron/renderer includes types for all renderer process modules.
const { contextBridge, ipcRenderer } = require("electron/renderer")
contextBridge.exposeInMainWorld("electronAPI", ()=>{openFile: () => ipcRenderer.invoke('dialog:openFile')
})
// renderer.js// 插入html中的js, 运行于渲染程序中
const setButton = document.getElementById('btn')
const filePath= document.getElementById('filePath')
setButton.addEventListener('click', async () => {const path= await window.electronAPI.openFile()filePath.innerText= path
})

主进程到渲染进程 (单向,可模拟双向)

send on

// main.jsconst { app, BrowserWindow, Menu, ipcMain } = require('electron/main')
const path = require('node:path')function createWindow () {const mainWindow = new BrowserWindow({webPreferences: {preload: path.join(__dirname, 'preload.js')}})const menu = Menu.buildFromTemplate([{label: app.name,submenu: [{// 使用 webContents.send API 将 IPC 消息从主进程发送到目标渲染器。// 其使用方式与 ipcRenderer.send 相同。click: () => mainWindow.webContents.send('update-counter', 1),label: 'Increment'},{click: () => mainWindow.webContents.send('update-counter', -1),label: 'Decrement'}]}])Menu.setApplicationMenu(menu)mainWindow.loadFile('index.html')
}app.whenReady().then(() => {// 模拟双向通信,接收渲染进程发送的数据,"update-counter" 触发ipcMain.on('counter-value', (_event, value) => {console.log(value) })createWindow()
})
// preload.jsconst { contextBridge, ipcRenderer } = require("electron/renderer")
contextBridge.exposeInMainWorld("electronAPI", {onUpdateCounter: (callback) => ipcRenderer.on("update-counter", (event,value) => callback(value)),sendCount: (value) => ipcRender.send('counter-value', value)
})
// render.js
const count = document.getElementById("count")
window.electronAPI.onUpdateCounter((value)=>{const newValue = Number(count.innerText) + value;count.innerText = newValue.toString();window.electronAPI.sendCount(newValue)
})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/45585.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Stable Diffusion】(基础篇三)—— 图生图基础

图生图基础 本系列笔记主要参考B站nenly同学的视频教程,传送门:B站第一套系统的AI绘画课!零基础学会Stable Diffusion,这绝对是你看过的最容易上手的AI绘画教程 | SD WebUI 保姆级攻略_哔哩哔哩_bilibili 本文主要讲解如何使用S…

客户端与服务端之间的通信连接

目录 那什么是Socket? 什么是ServerSocket? 代码展示: 代码解析: 补充: 输入流(InputStream): 输出流(OutputStream): BufferedReader 是如何提高读取效率的&a…

K8s集群初始化遇到的问题

kubectl describe pod coredns-545d6fc579-s9g5s -n kube-system 找到原因1:CoreDNS Pod 处于 Pending 状态的原因是集群中的节点都带有 node.kubernetes.io/not-ready 污点 journalctl -u kubelet -f 14:57:59.178592 3553 remote_image.go:114] "PullIma…

《简历宝典》12 - 简历中“项目经历”,内功学习 - 下篇

这一小节呢,我们继续说简历中 “项目经历” 的一些内功心法。因为项目经历比较核心,所以说完了,内功呢,我们会着重说一下 实战部分。 目录 1 所用技术的考虑 2 自我成长的突出 3 综合使用STAR法则 4 小节 1 所用技术的考虑 …

如何评估AI模型:评估指标的分类、方法及案例解析

如何评估AI模型:评估指标的分类、方法及案例解析 引言第一部分:评估指标的分类第二部分:评估指标的数学基础第三部分:评估指标的选择与应用第四部分:评估指标的局限性第五部分:案例研究第六部分&#xff1a…

pear-admin-fast项目修改为集成PostgreSQL启动

全局搜索代码中的sysdate(),修改为now() 【前者是mysql特有的,后者是postgre特有的】修改application-dev.yml中的数据库url使用DBeaver把mysql中的数据库表导出csv,再从postgre中导入csv脚本转换后出现了bpchar(xx)类型,那么一定…

用友U8存货分类按层级取数SQL语句

SELECT cInvCCode 分类编码, cInvCName 分类名称, iInvCGrade 分类层级, ss.bInvCEnd 是否是末级, aa.* FROM InventoryClass ss LEFT JOIN ( SELECT * FROM ( SELECT cInvCCode AS 一级分类编码, …

python数据可视化(6)——绘制散点图

课程学习来源:b站up:【蚂蚁学python】 【课程链接:【【数据可视化】Python数据图表可视化入门到实战】】 【课程资料链接:【链接】】 Python绘制散点图查看BMI与保险费的关系 散点图: 用两组数据构成多个坐标点,考察…

如何降低老年人患帕金森病的风险?

降低老年人患帕金森病风险的方法 避免接触有害物质:长期接触某些化学物质、农药或其他有害物质可能会增加患帕金森病的风险。应减少这些物质的暴露,例如在工作或生活中采取防护措施。 健康饮食:均衡饮食,多吃富含抗氧化剂的食物&a…

做了一个万能搜索框

最近给网页做了一个搜索框,现在搜索比以前更加方便了,下面简单介绍一下如何使用 我们进入网页版(app.zyjj.cc)点击右上角的搜索就可以看到这个新版的搜索框了 目前支持中文、拼音、首字母等多种搜索方式,大家可以随意…

【Python】Python-docx使用实例 科技档案封面批量生成

使用背景 根据excel表中的信息,按照word模板格式,每条信息生成一个对应的模板及文件名。 我这里的情况是将科技档案的封面格式按照案卷表的明细批量生成。 (单位的档案软件太鸡肋了,没有这个功能) 代码整篇 工程档…

【Linux】常见指令(下)

【Linux】常见指令(下) 通配符 *man指令cp指令echo指令cat指令(简单介绍)cp指令 mv指令alias指令which ctrl ccat指令linux下一切皆文件 more指令less指令head指令tail指令管道 通配符 ‘*’ 通配符’ *‘,是可以匹配…

4 C 语言控制流与循环结构的深入解读

目录 1 复杂表达式的计算过程 2 if-else语句 2.1 基本结构及示例 2.2 if-else if 多分支 2.3 嵌套 if-else 2.4 悬空的 else 2.5 注意事项 2.5.1 if 后面不要加分号 2.5.2 省略 else 2.5.3 省略 {} 2.5.4 注意点 3 while 循环 3.1 一般形式 3.2 流程特点 3.3 注…

Dynamic多数据源

有时候我们在项目中,可能会遇到需要同时使用多个数据库连接的情况,这个时候可以使用MyBatis-Plus的dynamic多数据源的配置。但其实MyBatis-Plus官方还提供了mybatis-mate组件,但是他是付费的企业组件。 官方文档: 多数据源支持 …

识别视频中的人数并统计出来

目的: 使用Python和pysimpleguil以及opencv写一个统计人流量的软件。要求:1 加载选定的视频 2 通过形态学特征识别人,3统计人数并且在界面上显示出来,4 保存识别出人数的信息。 步骤 1: 安装必要的库 首先,确保你已经安装了Python。然后,安装PySimpleGUI和OpenCV。你可…

数电基础 - 可编程逻辑器件

目录 ​编辑 一. 简介 二. 现场可编程逻辑阵列 三. 可编程阵列逻辑 四. 通用阵列逻辑 五. 可擦除的可编程逻辑器件 六. 复杂的可编程逻辑器件 七. 现场可编程门阵列 一. 简介 可编程逻辑器件(Programmable Logic Device,PLD)是一种用…

Gmsh用户界面

主要指出几何、网格、求解三个模块. 几何模块分为基本实体和物理组两个部分,主要对几何体进行操作,并设置物理属性 网格模块主要定义了对网格的操作和对应的算法 求解主要指出了网格求解方法 所有的界面操作都是基于这三个方法的

半导体仿真文件传输面临时间和经济成本挑战,一招就能解决

对于芯片设计企业来说,其面临的最大考验就是芯片设计质量和时间成本控制之间的矛盾,具体表现在芯片的设计、仿真验证过程存在着较大的挑战: 芯片设计过程包括了仿真验证这一重要的一环,但芯片设计企业在仿真验证这一环却面临着较…

数据结构--二叉树遍历

目录 1.介绍 (1)前序遍历 (2)定义结构体 (3)前序遍历实现 (4)中序遍历实现 (5)二叉树的节点个数 (6)二叉树树叶节点个数 &…

数仓工具—Hive语法之宏(Macro)

Hive中的宏 许多关系型数据库,如Teradata,支持宏(Macro)函数。在关系数据库管理系统(RDBMS)中,宏存储在数据字典中。用户可以共享宏,并根据需要执行它们。Hive宏与关系型数据库中的宏略有不同。在本文中,我们将检查什么是宏,它的语法,如何使用它们,以及一些宏的示…