Electron 工具进程utilityProcess 使用中遇到的坑点汇集

简介

  1. 这是基于 node.js 中的子进程的概念推出来的,可参考链接:utilityProcess | Electron 官网有一句话非常重要,它提供一个相当于 Node.js 的 child_process.fork API,但使用 Chromium 的 Services API 代替来执行子进程。这句话的意思是两者还是有点区别的。更应该当成一个 worker.js 来看到。

  2. 这个工具进程自从 electron:22.0.0 才开始有,老版本是没有的哦!Electron 22.0.0 - 知乎

特点

utilityProcess 是一个轻量级的进程,在开发过程中有些逻辑是针对数据进行判断和处理,所以没有必要创建一个渲染进程,渲染进程会模拟整个浏览器,会耗费很多 cpu 和内存,但是我们却用不到,这时轻量级的工具进程就起到了很大的作用了,例如做一个全局任务调度程序。

难点

主子进程最重要的环节就是两者的通信,官方给了主子通信的方式,同时还给了 MessageChannelMain(Electron 通信桥)的方式,这两种方式基本解决了我们所有问题;

完整代码

main.js

javascript 复制代码
import {utiltyProcess, MessageChannelMain} from 'electron'
const {port1, port2} = new MessageChannelMain()
const child = utilityProcess.fork(path.join(__static, "alarm1.js"))
child.on("spawn", () => {
    child.postMessage({message: 'hello'}, [port1])
})

port2.on("message", (e) => {
    console.log("port receive:", e.data);
    port2.postMessage("I receive your messages:")
})
port2.start()
child.on("message", (e) => {
    console.log("接收到消息了:", e);
})

utility-process.js

javascript 复制代码
console.log('Listening for messages...');
process.parentPort.on('message', (e) => {
    const port = e.ports[0];

    process.parentPort.postMessage({data: "Ready"});
    console.log("I m coming,do you find me?")

    port.on("message", (e) => {
        console.info("why not print it?", e.data)
        setTimeout(() => {
            port.postMessage(`I receive your message:${e.data}`)
        }, 2000)

    });
    port.start();
    port.postMessage({data: "Ready"});
});

注意

  1. utility-process.js 中的 console.log 有时候不能在控制台打印出来,我删掉 node_modules 重新安装,并且全部改为英文之后(没事不要用中文,外国人搞得东西用中文都是坑),又能输出来了,这个有人提过,是个老问题,这里记下来,好像他们也没处理,就放在那里了 [Bug]: output sometimes missing in utility process · Issue #36411 · electron/electron · GitHub

  2. console.info("why not print it?", e.data) 这里没有打印出来,不代表这里没有收到 message,实际上是收到了,setTimeout 那里是可以执行的,很多人被坑,以为这里没办法通信,因为 console.log 没打印出来,以为代码没走到这里

  3. port.start() 这行代码一定要有,最好放在 onmessage 之后,electron 开发者的意思,如果默认开启就会丢失一些消息,只有当你确保 onmessage 配置好了后,再开启消息队列,html5 MessageChannel 中的 port 没有 start 函数这是最大的区别。

相关推荐
king王一帅3 小时前
Incremark Solid 版本上线:Vue/React/Svelte/Solid 四大框架,统一体验
前端·javascript·人工智能
智航GIS7 小时前
10.4 Selenium:Web 自动化测试框架
前端·python·selenium·测试工具
前端工作日常8 小时前
我学习到的A2UI概念
前端
徐同保8 小时前
为什么修改 .gitignore 后还能提交
前端
一只小bit8 小时前
Qt 常用控件详解:按钮类 / 显示类 / 输入类属性、信号与实战示例
前端·c++·qt·gui
Mr -老鬼8 小时前
前端静态路由与动态路由:全维度总结与实践指南
前端
Nan_Shu_6149 小时前
学习: Threejs (1)
javascript·学习
颜酱9 小时前
前端必备动态规划的10道经典题目
前端·后端·算法
wen__xvn9 小时前
代码随想录算法训练营DAY10第五章 栈与队列part01
java·前端·算法
Van_Moonlight9 小时前
RN for OpenHarmony 实战 TodoList 项目:加载状态 Loading
javascript·开源·harmonyos