微信小程序線上更新版本流程及如何運用

1.1 小程序官方文檔:

(1)小程序線上版本更新官方文檔(updateManager對象管理線上版本更新):https://developers.weixin.qq....
(2)小程序強制更新:
https://developers.weixin.qq....html

2.1 參考博客:

微信小程序版本自動更新:https://www.jianshu.com/p/4f5...小程序

3.1 關鍵知識點:

(1)小程序熱啓動
(2)小程序冷啓動
(3)updateManager對象
(4)利用wx.canIuse( )方法判斷getUpdateManger
(5)UpdateManager.onCheckForUpdate(function callback)回調函數監聽是否後臺有更新版本
(6)UpdateManager.onUpdateReady(function callback)監聽版本成功下載後利用UpdateManager.applyUpdate()重啓小程序
(7)UpdateManager.onUpdateFailed(function callback)監聽版本更新失敗後的回調
(8)微信小程序在冷更新而且有新版本的狀況下才能重啓微信小程序

4.1 下圖是更新的流程:

在這裏插入圖片描述

5.1 代碼展現:

if (wx.canIUse('getUpdateManager')) {
      const updateManager = wx.getUpdateManager()
      console.log(updateManager);
      updateManager.onCheckForUpdate(function (res) {
        // 請求完新版本信息的回調
        console.log(res);
        if (res.hasUpdate) {
          updateManager.onUpdateReady(function () {
            wx.showModal({
              title: '更新提示',
              content: '新版本已經準備好,是否重啓應用?',
              success: function (res) {
                // res: {errMsg: "showModal: ok", cancel: false, confirm: true}
                if (res.confirm) {
                  // 新的版本已經下載好,調用 applyUpdate 應用新版本並重啓
                  updateManager.applyUpdate()
                }
              }
            })
          })
          updateManager.onUpdateFailed(function () {
            // 新的版本下載失敗
            wx.showModal({
              title: '已經有新版本了喲~',
              content: '新版本已經上線啦~,請您刪除當前小程序,從新搜索打開喲~'
            })
          })
        }
      })
    }

5.1 模擬更新版本:

第一步:點擊普通編譯並添加編譯模式

在這裏插入圖片描述

第二步:設定更新模式並勾選下一次編譯時更新,點擊確認

在這裏插入圖片描述

第四步:編譯成功後,跳出更新頁面

在這裏插入圖片描述

相關文章
相關標籤/搜索