试用了下,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[0]) if (res.data[0]&&res.data[0].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[0].download_url); ipcRenderer.send('window-close'); }, cancelValue: '取消', cancel: function () { toast("请更新到最新版本.."); return true; }, title: res.data[0].title, content: res.data[0].content }); } }, error: function (msg) { var rss = $(msg.responseText); console.log(rss) } }); }
厚积薄发,笨鸟先飞。