小程序 版本自動更新的實現

涉及到微信小程序開發的小伙伴們，相信一定會遇到新版本發布后，舊版本無法自動更新的困擾.

我之前進行開發的時候：

-  首先是因為在今年的 3、4月份進行小程序的初次接觸;
-  但是網上也沒搜到相關的解決方案;
-  最笨的方法就是，刪除小程序后再重新搜索打開就好;

-  然后，記不清從哪里看到的信息;
-  大概意思是：小程序的更新機制會自動檢測，根據手機的緩存程度不同，一般最遲兩個小時就能自動替換
-  所以就有點不了了之了

！！！（真實情況是，在之前進行版本發布后，有的iphone手機，即便一天之后進入，依然是舊版本，根本不會自動更新替換好吧）！！！

-  今天無意中又想到這個問題，再進行百度，發現很多道友給出解決方案了；
-  我猜測是這段時間官方進行了功能補充，亦或者是道友們的深層挖掘吧；
-  在此進行一下整理，希望能幫到更多的朋友...

實現方案

首先，你必須要了解一下 小程序 - 運行機制

 

 　　然后根據文檔指導，自然而然就會進入到 UpdateManager 對象 的介紹與使用

 我根據官方提供的示例及其他道友的文章參考，最后進行了如下代碼整合 :  >>>

/**
 * 檢測當前的小程序
 * 是否是最新版本，是否需要下載、更新
 */
function checkUpdateVersion() {
  //創建 UpdateManager 實例
  const updateManager = wx.getUpdateManager();
  //檢測版本更新
  updateManager.onCheckForUpdate(function(res) {
    // 請求完新版本信息的回調
    if (res.hasUpdate) {
      //監聽小程序有版本更新事件
      updateManager.onUpdateReady(function() {
        wx.showModal({
          title: '更新提示',
          content: '新版本已經准備好，是否重啟應用？',
          success(res) {
            if (res.confirm) {
              // 新的版本已經下載好，調用 applyUpdate 應用新版本並重啟
              updateManager.applyUpdate();
            }
          }
        })
      })

      updateManager.onUpdateFailed(function() {
        // 新版本下載失敗
        wx.showModal({
          title: '已經有新版本咯~',
          content: '請您刪除當前小程序，到微信 “發現-小程序” 頁，重新搜索打開呦~',
        })
      })
    }
  })
}

具體使用

根據小程序的運行機制，適合在啟動時就進行版本檢測的操作

• 所以，可以在 app.js 的 onLaunch() 方法中進行調用 上面的 checkUpdateVersion()

 

 

 運行效果截圖：

 

 

 Tips:

1. 小程序開發版/體驗版沒有「版本」概念，所以無法在開發版/體驗版上測試更版本更新情況
2. 准確來講，版本自動更新的方法越早進行補充越合理，
   尤其適合前期使用人數較少的時候就做補充
   以避免后期使用人數太多時而舊版本依然無法檢測更新及時替換的情況

補充：
考慮再三，為了版本的統一化，當然是建議小程序可以自動更新，所以升級一下代碼如下：

建議可以對比兩種寫法，找找不同...

/**
 * 檢測當前的小程序
 * 是否是最新版本，是否需要下載、更新
 */
function checkUpdateVersion() {
  //判斷微信版本是否 兼容小程序更新機制API的使用
  if (wx.canIUse('getUpdateManager')) {
    //創建 UpdateManager 實例
    const updateManager = wx.getUpdateManager();
    //檢測版本更新
    updateManager.onCheckForUpdate(function(res) {
      // 請求完新版本信息的回調
      if (res.hasUpdate) {
        //監聽小程序有版本更新事件
        updateManager.onUpdateReady(function() {
          //TODO 新的版本已經下載好，調用 applyUpdate 應用新版本並重啟 （ 此處進行了自動更新操作）
          updateManager.applyUpdate();
        })
        updateManager.onUpdateFailed(function() {
          // 新版本下載失敗
          wx.showModal({
            title: '已經有新版本嘍~',
            content: '請您刪除當前小程序，到微信 “發現-小程序” 頁，重新搜索打開哦~',
          })
        })
      }
    })
  } else {
    //TODO 此時微信版本太低（一般而言版本都是支持的）
    wx.showModal({
      title: '溫馨提示',
      content: '當前微信版本過低，無法使用該功能，請升級到最新微信版本后重試。'
    })
  }
}