5.electron之主进程起一个本地服务

2024-02-07 15:36

本文主要是介绍5.electron之主进程起一个本地服务,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

如果可以实现记得点赞分享,谢谢老铁~

Electron是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 Electron 将 Chromium 和
Node.js 嵌入到了一个二进制文件中,因此它允许你仅需一个代码仓库,就可以撰写支持 Windows、macOS 和 Linux
的跨平台应用。

1.项目效果, 我这里的本地服务是一个离线的地图
在这里插入图片描述
2. 文件目录
在这里插入图片描述

我的目的就是将 public/foxigis-server-lite-win/foxigis-server-lite-win.exe 这个文件起一个服务便于本地离线地图调用。

  1. electron.js 主进程, 编写startServer和stopServer的方法
// 打开窗口
function createWindow() {mainWindow = new BrowserWindow({width: 1200,height: 700,minWidth: 1200, // 设置窗口的最小宽度minHeight: 700, // 设置窗口的最小高度icon: __dirname + "/favicon.ico",});mainWindow.title = 'UniSAR';mainWindow.maximize();mainWindow.loadFile(appConfig.fileUrl);
}let childProcess = null;
function startServer() {// 构建 .exe 文件的绝对路径const exePath = path.join(__dirname, 'foxgis-server-lite-win', 'foxgis-server-lite-win.exe');const childProcess = cp.spawn(exePath);console.log('=========================' + exePath)childProcess.on('close', (code) => {console.log(`exe process exited with code ${code}`);});// 监听服务 B 的输出childProcess.stdout.on('data', (data) => {console.log(`Service B Output: ${data}`);// 在这里可以根据输出信息判断服务是否已经启动// 例如,检查输出中是否包含特定的启动完成标志if (data.indexOf('1234') !== -1) {// 服务已经启动,可以执行服务 A 中调用服务 B API 的代码// PS: 这里确保本地服务启动起来才来调用窗口的创建函数。createWindow();}});// 监听服务 B 的错误信息childProcess.stderr.on('data', (data) => {console.error(`Service B Error: ${data}`);// 这里可以处理服务 B 的错误信息});// 在服务 B 启动后执行其他逻辑childProcess.on('exit', (code) => {console.log(`Service B exited with code ${code}`);// 这里可以处理服务 B 退出后的逻辑});
}function stopServer() {if (childProcess !== null) {childProcess.kill('SIGTERM'); // 发送 SIGTERM 信号终止子进程childProcess = null; // 清空对子进程的引用console.log('服务已停止');} else {console.log('没有运行的服务');}
}app.on('ready', () => {// 开始本地服务启动startServer()});app.on('activate', () => {if (BrowserWindow.getAllWindows().length === 0) {createWindow();}
});app.on("window-all-closed", () => {if (process.platform !== "darwin") {// 停止本地服务stopServer()app.quit();}
});// 在应用退出时关闭服务
app.on('before-quit', () => {// 停止本地服务stopServer();
});

4.运行以下命令来构建React项目:

npm run build

PS:打开build目录下的index.html文件,发现是一片空白😱,F12一下,发现是资源路径不对。解决方案是在package.json中添加"homepage": “./”。添加之后再进行build,打开index.html,就能看到正常页面了。

5.运行以下命令来启动Electron应用程序:

npm run electron:dev

这将启动Electron应用程序,并加载React应用程序的构建文件。

6.运行以下命令来打包Electron应用程序:

npm run electron:build

收工!谢谢老铁们的点赞收藏~

这篇关于5.electron之主进程起一个本地服务的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/688161

相关文章

springboot家政服务管理平台 LW +PPT+源码+讲解

3系统的可行性研究及需求分析 3.1可行性研究 3.1.1技术可行性分析 经过大学四年的学习,已经掌握了JAVA、Mysql数据库等方面的编程技巧和方法,对于这些技术该有的软硬件配置也是齐全的,能够满足开发的需要。 本家政服务管理平台采用的是Mysql作为数据库,可以绝对地保证用户数据的安全;可以与Mysql数据库进行无缝连接。 所以,家政服务管理平台在技术上是可以实施的。 3.1

局域网内vue2 配置本地IP地址访问项目

在日常开发中同事可能需要访问你的前端项目,可以通过配置实现通过ip访问 一.首先找到config文件夹目录下的 index.js文件             将此处的host的值修改为0.0.0.0(即 host: 0.0.0.0) // Various Dev Server settings//host: 'localhost' //将localhost进行替换成 0.0.0.0host:

微服务中RPC的强类型检查与HTTP的弱类型对比

在微服务架构中,服务间的通信是一个至关重要的环节。其中,远程过程调用(RPC)和HTTP是两种最常见的通信方式。虽然它们都能实现服务间的数据交换,但在类型检查方面,RPC的强类型检查和HTTP的弱类型之间有着显著的差异。本文将深入探讨这两种通信方式在类型检查方面的优缺点,以及它们对微服务架构的影响。 一、RPC的强类型检查 RPC的强类型检查是其核心优势之一。在RPC通信中,客户端和服务端都使

中国341城市生态系统服务价值数据集(2000-2020年)

生态系统服务反映了人类直接或者间接从自然生态系统中获得的各种惠益,对支撑和维持人类生存和福祉起着重要基础作用。目前针对全国城市尺度的生态系统服务价值的长期评估还相对较少。我们在Xie等(2017)的静态生态系统服务当量因子表基础上,选取净初级生产力,降水量,生物迁移阻力,土壤侵蚀度和道路密度五个变量,对生态系统供给服务、调节服务、支持服务和文化服务共4大类和11小类的当量因子进行了时空调整,计算了

SpringCloud - 微服务

1、微服务介绍         参考: 微服务百度百科 1.1 概念         微服务(或称微服务架构)是一种云原生架构方法,在单个应用中包含众多松散耦合且可单独部署的小型组件或服务。 这些服务通常拥有自己的技术栈,包括数据库和数据管理模型;通过一个REST API、事件流和消息代理组合彼此通信;以及按照业务能力进行组织,具有通常称为有界上下文的服务分隔线。         微服务特

微服务(服务治理)

服务远程调用时存在的问题 注册中心原理 服务治理中的三个角色分别是什么? 服务提供者:暴露服务接口,供其它服务调用服务消费者:调用其它服务提供的接口注册中心:记录并监控微服务各实例状态,推送服务变更信息 消费者如何知道提供者的地址? 服务提供者会在启动时注册自己信息到注册中心,消费者可以从注册中心订阅和拉取服务信息 消费者如何得知服务状态变更? 服务提供者通过心

Linux RedHat 利用 ISO镜像文件制作本地 yum源

优质博文:IT-BLOG-CN 【1】创建iso存放目录和挂载目录 [root@desktop ~]# cd /mnt/[root@desktop mnt]# mkdir cdrom 【2】将ISO镜像文件挂载到/mnt/cdrom文件夹下(前提你的CD/DVD中有你的ISO文件-安装时使用的镜像文件) mount /dev/cdrom /mnt/cdrom 【3】编辑/et

Mac 本地启动 Dify

本地启动 dify 拉取 dify 文件 git clone https://github.com/langgenius/dify.git 启动底层服务 cd dify/dockerdocker-compose -f docker-compose.middleware.yaml -p dify up -d 启动后端 API 安装 poetry brew install poet

ssh在本地虚拟机中的应用——解决虚拟机中编写和阅读代码不方便问题的一个小技巧

虚拟机中编程小技巧分享——ssh的使用 事情的起因是这样的:前几天一位工程师过来我这边,他看到我在主机和虚拟机运行了两个vscode环境,不经意间提了句:“这么艰苦的环境写代码啊”。 后来我一想:确实。 我长时间以来都是直接在虚拟机里写的代码,但是毕竟是虚拟机嘛,有时候编辑器没那么流畅,在文件比较多的时候跳转很麻烦,容易卡住。因此,我当晚简单思考了一下,想到了一个可行的解决方法——即用ssh

将知乎专栏文章转换为 Markdown 文件保存到本地

一、参考内容 参考知乎文章`代码 | 将知乎专栏文章转换为 Markdown 文件保存到本地,利用代码为GitHub:https://github.com/chenluda/zhihu-download。 二、步骤 1.首先安装包flask、flask-cors、markdownify 2. 运行app.py 3.在浏览器中打开链接,并填写URL和Cookies 获取Cookies的步