项目难点

216 阅读3分钟

1.解决模型文件过大上传和下载过慢问题

由于模型文件的数据量特别大,假如使用json的格式来储存,体积很大。使用csv文件的形式存储文件体积减小了很多

下载: 前端发起下载请求,后端创建一个任务,前端持续轮训任务状态,完成时,下载后端压缩成zip的csv文件。 Js-zip包解压缩zip成csv文件流,然后通过文件流转成csv blob的格式,通过papaparse解析csv blob得到json文件

上传: json通过papaparse转成csv文件流,通过jszip转成zip文件流,在通过创建FormData将文件通过接口传到后端。

2.如何在electron启动java服务

使用nodejs的spawn启动一个子进程,事先下好不同环境的jre,通过process.platform读取当前环境运行对应的jre,并启动java代码

3.自动更新electron程序

使用electron-updater库:将打包产物和.yml文件上传的服务器上,通过对比服务器的yml文件和package.json中的version字段来判断服务器版本是否新版本,有新版本则弹窗提示更新,使用autoUpdater.downloadUpdate()下载服务器上的安装包,autoUpdater.on('download-progress')监听下载进度可获取下载信息。下载完成后调用autoUpdater.quitAndInstall();即可退出程序安装新版本

4.区分本地java服务和服务器

使用config.dev设置一个环境变量为开发环境。

维护一个方法判断当前是开发还是生产环境,开发环境则走对应后端的本地服务,生产环境则掉本地接口。

使用proxy本地代理的形式进行代理,设置两个代理,通过接口前缀来区分对应的服务器。

5.实现切换知识库功能 electron中的localstorage无效(关闭后就会被清除),cookie无效(无法存取)。使用electron-store 需要实现在前端运行时可配置服务器地址,实现不同服务器的切换,请求不同服务器的接口。 将需要切换的连接数据库的配置使用 electron-store 来持久化存储配置数据。 使用umi的request的requestInterceptors或者axios中的nterceptors做统一的请求拦截,获取electron-store请求配置来调对应接口

6.实现一套代码同时运行在浏览器和electron 刚开始开启了nodeIntegration,在渲染进程中操作主进程api,在浏览器运行报错,因为浏览器中没有相关api。通过查阅技术文档将它关闭然后使用在preload.js处理方案解决了这个问题

1.BrowserWindow中可以配置 nodeIntegration: false,来禁止在渲染进程中使用node,而是使用preload.js来进行通信。

2.在preload.js中使用contextBridge和ipcRenderer来向渲染进程暴露electron的事件处理api,渲染进程在window对象可以调用这些方法,类似写入文件,读取文件.

3.隔绝环境不报错,判断react当前是否在electron中来区分事件处理函数。