1、electron-builder 打包
yarn add electron-builder
package.json
{
"name": "demo",
"version": "1.0.4",
"description": "A minimal Electron application",
"productName": "MyApp",
"main": "main.js",
"scripts": {
"start": "electron .",
"pack": "electron-builder --dir",
"dist": "electron-builder --win --ia32"
},
"files": "dist/**/*",
"build": {
"appId": "com.xxx.app",
"publish": [
{
"provider": "generic",
"url": "http://localhost:2060/zip" //此处是服务器或者node服务器包文件的目录地址,把打包好的文件都拖进去
}
],
"mac": {
"target": [
"dmg",
"zip"
]
},
"win": {
"icon": "/icon/admin.ico",
"target": [
"nsis",
"zip"
]
}
},
...
...
}
2、安装electron-updater
yarn add electron-updater --save-dev
3、main.js
const { autoUpdater } =require("electron-updater");
//执行自动更新检查
const feedUrl = `http://localhost:2060/zip`; // 更新包位置
autoUpdater.setFeedURL(feedUrl);
let message = {
error: '检查更新出错',
checking: '正在检查更新……',
updateAva: '检测到新版本,正在下载……',
updateNotAva: '现在使用的就是最新版本,不用更新',
};
autoUpdater.on('error', function (error) {
sendUpdateMessage(message.error)
});
autoUpdater.on('checking-for-update', function () {
sendUpdateMessage(message.checking)
});
autoUpdater.on('update-available', function (info) {
sendUpdateMessage(message.updateAva)
});
autoUpdater.on('update-not-available', function (info) {
sendUpdateMessage(message.updateNotAva)
});
// 更新下载进度事件
autoUpdater.on('download-progress', function (progressObj) {
console.log(progressObj)
//与渲染进程通信
mainWindow.webContents.send('downloadProgress', progressObj)
mainWindow.setProgressBar(progressObj.percent / 100);
})
autoUpdater.on('update-downloaded', function (event, releaseNotes, releaseName, releaseDate, updateUrl, quitAndUpdate) {
console.log('更新完成')
ipcMain.on('isUpdateNow', (e, arg) => {
console.log("开始更新");
//some code here to handle event
autoUpdater.quitAndInstall();
});
mainWindow.webContents.send('isUpdateNow')
});
ipcMain.on("checkForUpdate",()=>{
//放外面的话启动客户端执行自动更新检查
autoUpdater.checkForUpdates();
})
function sendUpdateMessage(text) {
mainWindow.webContents.send('message', text)
}
4、渲染进程
//监听自动更新事件
const { ipcRenderer } = require("electron");
var update = document.getElementById('update');
update.addEventListener('click',function(){
//发送请求执行自动更新
ipcRenderer.send("checkForUpdate");
})
ipcRenderer.on("message", (event, text) => {
console.log(event)
console.log(text)
document.getElementById('mode').innerHTML=text;
});
ipcRenderer.on("downloadProgress", (event, progressObj)=> {
console.log(progressObj); //下载进度
});
ipcRenderer.on("isUpdateNow", () => {
ipcRenderer.send("isUpdateNow");
});
window.onunload=function(){
ipcRenderer.removeAll(["message", "downloadProgress", "isUpdateNow"])
}
5、本地测试搭建node服务器访问静态资源
1、在空文件夹下
npm init -y
2、server.js
const express = require('express');
const app = express();
app.use(express.static('public')); //监控静态资源
app.listen(2060,()=>{
console.log('loaclhost:2060')
})
package.json
{
"name": "nodeService",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start":"node service.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.17.1"
}
}
yarn add express
把打包生成的文件放public/zip下
npm start //开启服务器
ps:1、electron版本4.0.1以上
electron npm start执行更新会报错;打包好后安装客户端打开执行更新会正常更新程序
2、目录及文件夹的命名不要用中文命名.会打包报错
demo源码
链接:https://pan.baidu.com/s/1n5x-IGWqmote03jbgFYBFQ
提取码:weiy
下载好后 分别在nodeService与与update内npm install
下载依赖模块
运行方法在 package.json 的script下