Electron 实现热更新（以及遇到的坑）

安装electron-updater

   npm install electron-updater

在渲染进程中点击立即更新时发消息到主进程，这个立即更新是在渲染进程中写的一个更新的弹窗

  this.$ipcApi.send('download-client')   

在主进程中，会检测到新版本自动安装

    
import {app, BrowserWindow, ipcMain} from 'electron'
import pkg from '../../../package.json'
// 注意这个autoUpdater不是electron中的autoUpdater
import io from './io'
import {autoUpdater} from "electron-updater"
 
let mainWindow
 //win是通过ipcmain传过来的当前的窗口，因为我是创建的update.js文件，所以需要把当前窗口信息传过来
function handleUpdate(win) {
    mainWindow = win
    const returnData = {
        error: {status: -1, msg: '检测更新查询异常'},
        checking: {status: 0, msg: '正在检查应用程序更新'},
        updateAva: {status: 1, msg: '检测到新版本，正在下载,请稍后'},
        updateNotAva: {status: -1, msg: '您现在使用的版本为最新版本,无需更新!'},
    };
    //告诉渲染进程是否接受到了消息
    mainWindow.webContents.send('downloadInfo', '点击立即更新是否触发')
    
    
    // 设置是否自动下载，默认是true,当点击检测到新版本时，会自动下载安装包，所以设置为false，默认为true，点击立即更新以后直接检测是否有新版本，然后进行安装
    // autoUpdater.autoDownload = false
    
    
    
    /*
        重点说明服务器的地址的内容，内容是打包以后生成的latest.yml，把这个文件放到服务器上，同时和你打包以后的安装包同级目录，这样latest.yml中的地址才能读取到
    */
    updataPath = '服务器的地址'
    autoUpdater.setFeedURL({
        provider: 'generic',
        url:updataPath,
        updaterCacheDirName:'tfstudent-updater'
    });


    //更新错误
    autoUpdater.on('error', function (error) {
        sendUpdateMessage(returnData.error)
    });

    //检查中
    autoUpdater.on('checking-for-update', function () {
        sendUpdateMessage(win, returnData.checking)
    });

    //发现新版本
    autoUpdater.on('update-available', function (info) {
        sendUpdateMessage(win, returnData.updateAva)
    });

    //当前版本为最新版本
    autoUpdater.on('update-not-available', function (info) {
        setTimeout(function () {
            sendUpdateMessage(returnData.updateNotAva)
        }, 1000);
    });

    // 更新下载进度事件
    autoUpdater.on('download-progress', function (progressObj) {
        mainWindow.webContents.send('autodownloadprogress', progressObj)
    });
    
    //下载完成后重新安装
    autoUpdater.on('update-downloaded', function (event, releaseNotes, releaseName, releaseDate, updateUrl, quitAndUpdate) {
        mainWindow.webContents.send('isUpdateNow')
        autoUpdater.quitAndInstall();
    });
    //执行自动更新检查
    autoUpdater.checkForUpdates();
}
// 通过main进程发送事件给renderer进程，提示更新信息
function sendUpdateMessage(win, text) {
    mainWindow.webContents.send('messageupdate', text)
}

export default handleUpdate

主进程的updata.js执行完成以后会直接进行打包安装，更换的地址就是打最新的压缩包放到服务器上latest.yml和同等级的.exe的压缩包

latest.yml的内容

    version: 9.1.10
    files:
      - url: 打包的名称
        sha512: 版本检测的一个秘钥
        size: 309004610
        isAdminRightsRequired: true
    path: 打包的名称
    sha512: 版本检测的一个秘钥
    releaseDate: '2021-05-20T10:06:20.027Z'

本地执行的一些报错信息

• 这个错是因为utoUpdater.setFeedURL()里面的放的服务地址是错的，应该放打包以后在build文件夹里的latest.yml并且文件夹里有最新的.exe的压缩包，放latest.yml服务器上的地址时，把最后的latest.yml后缀给去掉，因为electron-update会把latest.yml拼接上
• 这个错直接把打包以后的latest.ymlcopy到D:\tifang\student-desktop\dist\electron\dev-app-update.yml这个目录下，这个目录是没有dev-app-update.yml的，需要新建的一个dev-app-update.yml然后把latest.yml的内容放到dev-app-update.yml，然后再点击立即更新时就没问题了