electron自动更新

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下

如图:
微信截图_20190719142236.png
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下

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容