vue+electron 自動更新的實現(xiàn)代碼

更新時間：2024年02月27日 15:16:46 作者：擺爛程序魚

這篇文章主要介紹了vue+electron 自動更新的實現(xiàn)代碼,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友參考下吧

1. 配置 package.json或vue.config.js文件中的應用更新服務器地址

module.exports = {
  pluginOptions: {
    electronBuilder: {
        ...
        publish: [
          {
            provider: 'generic',
            url: 'http://qc***/***'  // 服務器地址
          }
        ]
        ...
      }
    }
  }
}

2. 在主進程寫更新應用邏輯

在 checkupdate.js 文件或 main.js 中寫入

import { autoUpdater } from 'electron-updater'
const { build } = require("../../../package.json")
const { app, dialog } = require('electron');
const path = require("path");
import { ipcRenderer } from "electron";
const websocket = require('ws')
//跳過打包檢查  開發(fā)環(huán)境使用  打包的時候注釋掉
// Object.defineProperty(app, 'isPackaged', {
// 	get() {
// 		return true;
// 	}
// });
/**
 * -1 檢查更新失敗 0 正在檢查更新 1 檢測到新版本，準備下載 2 未檢測到新版本 3 下載中 4 下載完成
 **/
class Update {
    mainWindow
    constructor() {
        autoUpdater.setFeedURL(build.publish[0].url)
        // 當更新發(fā)生錯誤的時候觸發(fā)。
        autoUpdater.on('error', (err) => {
            if (err.message.includes('sha512 checksum mismatch')) {
                this.Message(this.mainWindow, -1, 'sha512校驗失敗')
            } else {
                this.Message(this.mainWindow, -1, '錯誤信息請看主進程控制臺')
            }
        })
        // 當開始檢查更新的時候觸發(fā)
        autoUpdater.on('checking-for-update', (event, arg) => {
            this.timer(this.mainWindow, 0, "正在檢查更新...", 5000)
        })
        // 發(fā)現(xiàn)可更新數(shù)據(jù)時
        autoUpdater.on('update-available', (event, arg) => {
            this.timer(this.mainWindow, 1, "發(fā)現(xiàn)新版本", 10000)
            this.timer(this.mainWindow, 1, "檢測到新版本，正在下載安裝包...", 15000)
        })
        // 沒有可更新數(shù)據(jù)時
        autoUpdater.on('update-not-available', (event, arg) => {
            this.timer(this.mainWindow, 2, "暫未檢測到新版本，當前版本為最新版本，無需更新", 15000)
        })
        // 下載監(jiān)聽  
        autoUpdater.on('download-progress', (progressObj) => {
            // {
            //   total: 1145589126,
            //   delta: 71139212,
            //   transferred: 71139212,
            //   percent: 6.209836527376395,
            //   bytesPerSecond: 69881348
            // }
            let total = this.renderSize(progressObj.total); //總大小
            let percent = parseFloat(progressObj.percent.toFixed(2)); //下載進度
            let bytesPerSecond = this.renderSize(progressObj.bytesPerSecond); //下載速度
            // let message = `總大?。?{total} 下載進度：${percent}% 下載速度${bytesPerSecond}/S`
            let message = `總大?。?{total} 下載進度：${percent}%`
            // this.Message(this.mainWindow, 3, message)
        })
        // 下載完成
        autoUpdater.on('update-downloaded', () => {
            // console.log('done')
            this.Message(this.mainWindow, 4, "新版本已下載完成,五秒后自動安裝并重啟...")
            setTimeout(() => {
                this.quitInstall();
            }, 5000)
        })
    }
    // 負責向渲染進程發(fā)送信息
    Message(mainWindow, type, data) {
        const senddata = {
            state: type,
            msg: data || ''
        }
        let journalSocket = new websocket("ws://localhost:16478");
        // mainWindow.webContents.send('update-msg', senddata)
        journalSocket.on("open", function () {
            journalSocket.send(data);
        });
    }
    // 執(zhí)行自動更新檢查
    checkUpdate(mainWindow) {
        this.mainWindow = mainWindow
        autoUpdater.updateConfigPath = path.resolve(__static, 'default-app-update.yml')
        // this.Message(this.mainWindow, 4, path.resolve(__static, 'default-app-update.yml'))
        // autoUpdater.currentVersion = "0.0.1";//調(diào)試使用 正式上線后注釋掉
        autoUpdater.checkForUpdates().catch(err => {
            console.log('網(wǎng)絡連接問題', err)
        })
    }
    // 退出并安裝
    quitInstall() {
        autoUpdater.quitAndInstall()
    }
    // 處理文件大小格式化
    renderSize(value) {
        if (null == value || value == '') {
            return "0 Bytes";
        }
        var unitArr = new Array("Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB");
        var index = 0;
        var srcsize = parseFloat(value);
        index = Math.floor(Math.log(srcsize) / Math.log(1024));
        var size = srcsize / Math.pow(1024, index);
        size = size.toFixed(2);//保留的小數(shù)位數(shù)
        return size + unitArr[index];
    }
    // 定時器
    timer(mainWindow, number, message, time) {
        setTimeout(() => {
            this.Message(mainWindow, number, message)
        }, time)
    }
}
export default Update