electron-updater实现更新electron应用程序
electron-updater实现更新electron应用程序
第一步
- 安装
"electron-updater": "^4.3.5",
- 打开
package.json
文件在build
对象下添加publish
配置,
"build": {
"productName": "xxx",
"appId": "org.simulatedgreg.electron-vue",
"directories": {
"output": "build"
},
---------------------------------------------
"publish": [
{
"provider": "generic",
"url": "https://xxx.com"
//注:这个url就是放.yml文件和安装包的服务器地址,我这里用的是阿里云oss地址
}
],
--------------------------------------------------
"files": [
"dist/electron/**/*"
]
第二步
- 在main文件夹下面创建更新文件
update.js
import { autoUpdater } from 'electron-updater'
import { ipcMain } from 'electron'
let mainWindow = null;
export function updateHandle(window, feedUrl) {
mainWindow = window;
let message = {
error: '检查更新出错',
checking: '正在检查更新',
updateAva: '检测到新版本,正在下载',
updateNotAva: '您已经更新到最新版本了',
};
//设置更新包的地址
autoUpdater.setFeedURL(feedUrl);
//监听升级失败事件
autoUpdater.on('error', function (error) {
sendUpdateMessage({
cmd: 'error',
message: error
})
});
//监听开始检测更新事件
autoUpdater.on('checking-for-update', function (message) {
sendUpdateMessage({
cmd: 'checking-for-update',
message: message
})
});
//监听发现可用更新事件
autoUpdater.on('update-available', function (message) {
sendUpdateMessage({
cmd: 'update-available',
message: message
})
});
//监听没有可用更新事件
autoUpdater.on('update-not-available', function (message) {
sendUpdateMessage({
cmd: 'update-not-available',
message: message
})
});
// 更新下载进度事件
autoUpdater.on('download-progress', function (progressObj) {
sendUpdateMessage({
cmd: 'download-progress',
message: progressObj
})
});
//监听下载完成事件
autoUpdater.on('update-downloaded', function (event, releaseNotes, releaseName, releaseDate, updateUrl) {
sendUpdateMessage({
cmd: 'update-downloaded',
message: {
releaseNotes,
releaseName,
releaseDate,
updateUrl
}
})
//退出并安装更新包
autoUpdater.quitAndInstall();
});
//接收渲染进程消息,开始检查更新
ipcMain.on("checkForUpdate", (e, arg) => {
//执行自动更新检查
// sendUpdateMessage({cmd:'checkForUpdate',message:arg})
autoUpdater.checkForUpdates();
})
}
//给渲染进程发送消息
function sendUpdateMessage(text) {
mainWindow.webContents.send('message', text)
}
- 在main文件夹下面的
index.js
中引入update.js
import { updateHandle } from './update'
mainWindow.on('closed', () => {
mainWindow = null
})
----------------------------------------------------
let feedUrl = "https://xxxxx.com";
updateHandle(mainWindow,feedUrl);
-----------------------------------------------------
}
第三步
- 在
APP.js
文件中检测更新
<template>
<div id="app">
<router-view></router-view>
<el-dialog
title="正在更新新版本,请稍候..."
:visible.sync="dialogVisible"
width="60%"
:close-on-click-modal="closeOnClickModal"
:close-on-press-escape="closeOnPressEscape"
:show-close="showClose"
center
>
<div style="width:100%;height:15vh;line-height:15vh;text-align:center">
<el-progress
status="success"
:text-inside="true"
:stroke-width="20"
:percentage="percentage"
:width="strokeWidth"
:show-text="true"
></el-progress>
</div>
</el-dialog>
</div>
</template>
<script>
let ipcRenderer = require("electron").ipcRenderer;
let _this = this;
//接收主进程版本更新消息
ipcRenderer.on("message", (event, arg) => {
// for (var i = 0; i < arg.length; i++) {
console.log(arg);
if ("update-available" == arg.cmd) {
//显示升级对话框
_this.dialogVisible = true;
} else if ("download-progress" == arg.cmd) {
//更新升级进度
/**
*
* message{bytesPerSecond: 47673
delta: 48960
percent: 0.11438799862426002
total: 42801693
transferred: 48960
}
*/
console.log(arg.message.percent);
let percent = Math.round(parseFloat(arg.message.percent));
_this.percentage = percent;
} else if ("error" == arg.cmd) {
_this.dialogVisible = false;
_this.$message("更新失败");
}
// }
});
ipcRenderer.send("checkForUpdate");
//20秒后开始检测新版本
// let timeOut = window.setTimeout(() => {
// ipcRenderer.send("checkForUpdate");
// }, 20000);
clearTimeout;
//间隔1小时检测一次
// let interval = window.setInterval(() => {
// ipcRenderer.send("checkForUpdate");
// }, 3600000);
export default {
name: 'App',
data() {
return {
dialogVisible: false,
closeOnClickModal: false,
closeOnPressEscape: false,
showClose: false,
percentage: 0,
strokeWidth:200
};
},
mounted() {
_this = this;
},
destroyed() {
window.clearInterval(interval);
window.clearInterval(timeOut);
}
}
</script>
第四步
将项目打包yarn build
,将打包后生成的build
目录下的latest.yml
和安装包.exe
文件传入服务器即可
坑!!!
注:我在开发的时候遇到了一个坑,打包成功后打开项目报错
A JavaScript error occurrend in the main process
这是electron版本过低导致的,后来我将版本升级到4.0.1,再打包就正常运行了。
electron-updater实现更新electron应用程序的更多相关文章
- Electron实战:创建ELectron开发的window应用安装包
前言:研究electron自动更新的时候,在electron的官方文档auto-updater 中,提到了在几个平台mac,Linux,windows下electron 的自动更新方法,其中winds ...
- Vite ❤ Electron——基于Vite搭建Electron+Vue3的开发环境【一】
背景 目前社区两大Vue+Electron的脚手架:electron-vue和vue-cli-plugin-electron-builder, 都有这样那样的问题,且都还不支持Vue3,然而Vue3已 ...
- 入门干货之Electron的.NET实现-Electron.NET
0x01.Electron.NET 1.介绍 Electron是由Github上的一支团队和一群活跃贡献者维护.用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Elec ...
- electron之环境安装、启动程序
1.安装node.js 2.安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org 3.安装全局electron n ...
- 使用苏飞httphelper开发自动更新发布文章程序
最近新上线了一个网站,专门收集网上签到赚钱,有奖活动等等的网站 我就要集分宝 http://www.591jfb.com.新建立 了一个栏目"每日更新",这样就需要每天都登录到网站 ...
- [wxWidgets]_[0基础]_[经常更新进度条程序]
场景: 1. 非常根据程序的进展需要处理业务,以更新进度条,进度条的目的是为了让用户知道业务流程的进度.一个进度条程序更友好,让用户知道在程序执行.不是没有反应. 2. 现在更新见过这两种方法的进展. ...
- Win7操作系统安装IE10提示“安装前需要更新与安装程序版本”
安装IE10浏览器时提示错误的 Internet Explorer安装程序版本 故障现象: Win7操作系统在安装IE10浏览器时会弹出对话框,提示错误的Ieternet Explorer 安装程序版 ...
- Saas软件更新以及小程序更新的教训
Saas软件即使版本更新多次,也要兼顾老客户,兼容旧功能. 对于小程序调用的接口,无法保证客户会更新小程序,因此需要兼容使用旧版本小程序的客户,更不能删除接口.
- 微信小程序热更新,小程序提示版本更新,版本迭代,强制更新,微信小程序版本迭代
相信很多人在做小程序的时候都会有迭代每当版本迭代的时候之前老版本的一些方法或者显示就不够用了这就需要用到小程序的热更新.或者说是提示升级小程序版本 editionUpdate:function(){ ...
随机推荐
- linux操作指南-01
目录 1.1 MBR 1.2 装双系统的坑 1.3 主机硬盘的主要规划 前言:记录下最近在看的鸟哥Liunx私房菜,虽然不是第一次看了..想记录几章开发中用的比较多的部分大致是以下几个章节 第3章 主 ...
- 使用Scrcpy实现电脑控制安卓手机
很多时候我们想要在电脑上使用一些手机软件,使用模拟器当然是一种选择,但是这些模拟器要不然不免费,要不然广告多不放心.Scrcpy是一个开源免费的软件,通过abd命令实现了安卓手机投屏和控制功能,并且支 ...
- Redis中的事务(多命令)操作
作为一个nosql数据库,事务是必要功能.但是redis我们是可以理解为它不支持事务操作的,因为它的特征完全不满足我们对事物的正常理解 ps:我不知道是谁一开始提出redis支持事务的,但是我更倾向于 ...
- python自动保存百度网盘资源,一定要看
觉得有帮助的别忘了关注一下知识图谱与大数据公众号 开始 在上一文中,我们保存了百度云盘的地址和提取码,但是这种分享链接很容易被屏蔽,最好的做法就是保存资源到自己的网盘,不过采集的链接有上万个,人肉保存 ...
- Java随谈(三)如何创建好一个对象?
本文推荐阅读时间30分钟 大家都知道,在编写Java程序里,一般就是处理各种各样的对象,那么,你知道一共有多少种创建对象的方式吗? 希望大家能稍微思考一下再往下翻. 答案是4种 new 一个对象 反射 ...
- Dominate【操作系统的经典算法】
此篇文章我们来谈一谈操作系统中都出现过哪些算法,请欣赏下图 ↓ 进程和线程管理中的算法 进程和线程在调度时候出现过很多算法,这些算法的设计背景是当一个计算机是多道程序设计系统时,会频繁的有很多进程或者 ...
- 分享一些比较好用的(免费)网站及推荐理由 SMARK
分享一些比较好用的(免费)网站及推荐理由 --By SMARK 资源类 这里面是一些有供下载的资源的网站等 视频 片库 内容怎么样有待考证 蓝光网 看着还行, 打赏收入 预告片世界 还行, 收入有待考 ...
- SFUD+FAL+EasyFlash典型场景需求分析,并记一次实操记录
SFUD+FAL+EasyFlash典型场景需求分析:用整个flash存储数据,上千条数据,读取得时候用easyflash很慢,估计要检索整个flash太慢了. 改进方法:分区检索. 1存数据时,根据 ...
- 072 01 Android 零基础入门 01 Java基础语法 09 综合案例-数组移位 04 综合案例-数组移位-在指定位置处插入数据方法
072 01 Android 零基础入门 01 Java基础语法 09 综合案例-数组移位 04 综合案例-数组移位-在指定位置处插入数据方法 本文知识点:综合案例-数组移位-在指定位置处插入数据方法 ...
- C语言中i++和++i的区别
这一篇更详细: 转载:https://blog.csdn.net/Bug_fuck/article/details/85229229 C语言中++i和i++是有区别的!快速理解的话就是用一句话概括:1 ...