electron自动更新和手动更新

一开始搭建就用electron-vue很方便。如果只是想安装electron，请参考我的另一篇文章https://segmentfault.com/a/11...首先安装Electron：vueinitsimulatedgreg/electron-vueproject1cdproject1npminstall//正在安装的小伙伴们第一次需要翻墙。怎么翻墙，请参与另一篇文章（好像很和谐，那就+我们的交流群吧！）安装时安装vueelectronvue-router，不要安装vuex打包下次你选择的是：electron-builder安装完成后有时间启动运行electron-packager。npmrundevbuildpage更新进度页面，写成组件update.vue安装模块installelectron-updaterpackagemodulenpminstallelectron-updater--save修改package.json添加如下代码"publish":[{"provider":"generic","url":"http://lee.com/app/update"}]，配置更新服务器。我们的更新服务器是本地虚拟主机。以apache为例配置apache服务器。本地使用是一个集成环境，操作非常简单。如果使用自定义安装，请将配置添加到httpd-vhosts.conf。我们的域名是lee.com。修改主机文件。修改主机文件。添加文件地址在C::WindowsSystem32driversetc目录下的127.0.0.1lee.com核心文件的主进程主要是handleUpdate方法import{app,BrowserWindow,ipcMain}from'electron'//注意这个autoUpdater不是electron中的autoUpdaterimport{autoUpdater}from"electron-updater"/***Set`__static`pathtostaticfilesinproduction*https://simulatedgreg.gitbooks.io/electron-vue/content/en/using-static-assets.html*/if(process.env.NODE_ENV!=='development'){global.__static=require('path').join(__dirname,'/static').replace(/\\/g,'\\\\')}letmainWindowconstwinURL=proceduress.env.NODE_ENV==='开发'?`http://localhost:9080`:`file://${__dirname}/index.html`functioncreateWindow(){/***初始窗口选项*/mainWindow=newBrowserWindow({height:563,useContentSize:true,width:1000})mainWindow.loadURL(winURL)mainWindow.on('closed',()=>{mainWindow=null});//处理更新操作functionhandleUpdate(){constreturnData={error:{status:-1,msg:'Checkingupdatequeryexception'},checking:{status:0,msg:'Checkingforapplicationupdates'},updateAva:{status:1,msg:'检测到新版本，请下载wait'},updateNotAva:{status:-1,msg:'您使用的是最新版本，无需更新！'},};//和之前package.json配置一样autoUpdater.setFeedURL('http://xxx.com/app/update');//更新错误autoUpdater.on('error',function(error){sendUpdateMessage(returnData.error)});//检查autoUpdater.on('checking-for-update',function(){sendUpdateMessage(returnData.checking)});//查找新版本autoUpdater.on('update-available',function(info){sendUpdateMessage(returnData.updateAva)});//当前版本为最新版本autoUpdater.on('更新不可用',function(info){setTimeout(function(){sendUpdateMessage(returnData.updateNotAva)},1000);});//更新下载进度事件autoUpdater.on('download-progress',function(progressObj){mainWindow.webContents.send('downloadProgress',progressObj)});autoUpdater.on('update-downloaded',function(event,releaseNotes,releaseName,releaseDate,updateUrl,quitAndUpdate){ipcMain.on('isUpdateNow',(e,arg)=>{//这里有一些代码来处理事件autoUpdater.quitAndInstall();});//win.webContents.send('isUpdateNow')});//执行自动更新检查autoUpdater.checkForUpdates();}handleUpdate();//通过主进程向renderer进程发送事件，提示更新信息functionsendUpdateMessage(text){mainWindow.webContents.send('message',text)}ipcMain.on("checkForUpdate",(event,data)=>{console.log('执行自动更新检查!!!');//event.sender.send('reply','hileemynameisyuan,ageis17');autoUpdater.checkForUpdates();});}app.on('ready',createWindow)app.on('window-all-closed',()=>{if(process.platform!=='darwin'){app.quit()}});app.on('activate',()=>{if(mainWindow===null){createWindow()}});update参数说明当有更新包时会更新主进程触发如下方法：autoUpdater.on('download-progress',function(progressObj){//mainWindow.webContents.send('downloadProgress',progressObj)constwinId=BrowserWindow.getFocusedWindow().id;让win=BrowserWindow.fromId(winId);win.webContents.send('downloadProgress',progressObj)});进度对象：{"bytesPerSecond":47132710,"delta":39780007,"percent":100,"total":39780007,"transferred":39780007}bytesPerSecond:bps/s//传输率百分比：百分比//我们需要这个总数：totalsizetransferred:downloadedandreleasedupdate把新的安装包和latest.yml放在对应的目录下，系统会自动检测版本，有新版本就会下载！！检测更新并创建触发更新的组件

机器在本地，所以下载速度超快。后来我把更新地址切换到了远程服务器。下面是运行截图