试用了下,electron 自带的热更新 并不是特别理想。
想自己处理下载更新文件。刚好看到了网上有一个比较好的处理方式。试了下效果还可以。
使用以下命令将此库包含在项目中:
npm install request
在脚本的顶部声明基本依赖项。
var request = require('request');
var fs = require('fs');
将GET数据流式传输到文件输出。
function downloadFile(file_url , targetPath){
// Save variable to know progress
var received_bytes = 0;
var total_bytes = 0; var req = request({
method: 'GET',
uri: file_url
}); var out = fs.createWriteStream(targetPath);
req.pipe(out); req.on('response', function ( data ) {
// Change the total bytes value to get progress later.
total_bytes = parseInt(data.headers['content-length' ]);
}); req.on('data', function(chunk) {
// Update the received bytes
received_bytes += chunk.length; showProgress(received_bytes, total_bytes);
}); req.on('end', function() {
alert("File succesfully downloaded");
});
} function showProgress(received,total){
var percentage = (received * 100) / total;
console.log(percentage + "% | " + received + " bytes out of " + total + " bytes.");
}
使用方式:
downloadFile("http://www.planwallpaper.com/static/images/butterfly-wallpaper.jpeg", "./butterfly-wallpaper.jpeg");
用promise实现的方式:
/**
* Promise based download file method
*/
function downloadFile(configuration){
return new Promise(function(resolve, reject){
// Save variable to know progress
var received_bytes = 0;
var total_bytes = 0; var req = request({
method: 'GET',
uri: configuration.remoteFile
}); var out = fs.createWriteStream(configuration.localFile);
req.pipe(out); req.on('response', function ( data ) {
// Change the total bytes value to get progress later.
total_bytes = parseInt(data.headers['content-length' ]);
}); // Get progress if callback exists
if(configuration.hasOwnProperty("onProgress")){
req.on('data', function(chunk) {
// Update the received bytes
received_bytes += chunk.length; configuration.onProgress(received_bytes, total_bytes);
});
}else{
req.on('data', function(chunk) {
// Update the received bytes
received_bytes += chunk.length;
});
} req.on('end', function() {
resolve();
});
});
}
使用方式:
downloadFile({
remoteFile: "http://www.planwallpaper.com/static/images/butterfly-wallpaper.jpeg",
localFile: "/var/www/downloads/butterfly-wallpaper.jpeg",
onProgress: function (received,total){
var percentage = (received * 100) / total;
console.log(percentage + "% | " + received + " bytes out of " + total + " bytes.");
}
}).then(function(){
alert("File succesfully downloaded");
});
还有一步 是对zip 包进行解压 然后 替换本地文件,删除这个更新的压缩包 就完成了热更新。
我是再渲染线程 进行判断版本的:
判断是否需要强制更新,如果不强制更新的版本都用热更新 去下载 替换本地文件就可以了
function UpdateApp() {
$.ajax({
type: "GET",
url: baseDevUrl + CLIENTUPDATES + '?OS=' + getPlatformName(),
headers: {
Authorization: 'Bearer ' + getAccessToken(),
Accept: "application/json; charset=utf-8",
},
success: function (res) {
console.log(res.data[])
if (res.data[]&&res.data[].version != version) {
console.log('进行强制更新');
$(".myDialog-box").show();
$(".myDialog-box").click((event)=>{
return event.preventDefault();
})
$(".headerEndDiv").addClass('disClick');
$('#btn-dialogBox').dialogBox({
hasClose: true,
hasBtn: true,
confirmValue: '去更新',
confirm: function () {
console.log('this is callback function');
shell.openExternal(res.data[].download_url);
ipcRenderer.send('window-close');
},
cancelValue: '取消',
cancel: function () {
toast("请更新到最新版本..");
return true;
},
title: res.data[].title,
content: res.data[].content
});
}
},
error: function (msg) {
var rss = $(msg.responseText);
console.log(rss)
}
});
}