一. 背景

隨著 App 成功上架，可能更新頻率往往會越來越高。傳統(tǒng)的應(yīng)用更新方式要求用戶重新下載并安裝應(yīng)用，這不僅耗費(fèi)用戶大量時間、流量，還嚴(yán)重影響用戶體驗(yàn)。為了提升用戶體驗(yàn)，熱更新技術(shù)應(yīng)運(yùn)而生，為用戶帶來了更加便捷高效的更新體驗(yàn)。

二. 什么是熱更新？

uni-app 熱更新是一項(xiàng)強(qiáng)大的技術(shù)，無需重新安裝應(yīng)用，就能動態(tài)更新應(yīng)用的內(nèi)容。它可以在應(yīng)用持續(xù)運(yùn)行的狀態(tài)下，對功能、樣式以及各類資源進(jìn)行升級，顯著提升用戶體驗(yàn)，大幅縮短用戶等待時間，同時有效降低應(yīng)用安裝與更新的成本。

簡而言之，uni-app APP 有兩種更新方式：

• 整包升級：將整個應(yīng)用更新至最新版本，屬于全量更新。其優(yōu)勢在于更新全面，速度較快；不過缺點(diǎn)也很明顯，更新完成后用戶需要重新安裝應(yīng)用。

• wgt 資源升級：僅將應(yīng)用的資源更新到最新版本，屬于增量更新。這種方式的好處是更新速度快，對用戶影響小；但存在一定的局限性，并非適用于所有類型的更新。

uni-app 熱更新的實(shí)現(xiàn)流程如下：

• 在應(yīng)用中添加熱更新功能。
• 將更新的內(nèi)容打包成 wgt 資源包。
• 將 wgt 資源包上傳到服務(wù)器。
• 應(yīng)用在啟動時，檢查是否有更新。
• 如果有更新，應(yīng)用會下載 wgt 資源包，并安裝到應(yīng)用中。
• 應(yīng)用重新啟動，更新的內(nèi)容就會生效。

三. 生成 wgt

1. 前提條件

• 已在 HBuilderX 中創(chuàng)建好應(yīng)用，并且已經(jīng)編譯打包成功。

• 已經(jīng)配置好應(yīng)用的應(yīng)用 ID（appid）。

• 已經(jīng)配置好應(yīng)用的版本號（version）。

等等具備了一系列應(yīng)用上架的前提條件，不再贅述。

2. 修改版本號

首先，需要更新 manifest.json 中的版本號。比如之前是 1.0.0，那么新版本應(yīng)該是 1.0.1 或 1.1.0。要大于現(xiàn)有的版本號。

3. 打包 wgt 包

在 HBuilderX 中打包升級包（wgt）

點(diǎn)擊菜單->發(fā)行->App-制作應(yīng)用 wgt 包

打包結(jié)束會在控制臺輸出 wgt 升級包的具體位置

四. 安裝 wgt

安裝應(yīng)用資源升級包（wgt）通常需要服務(wù)端與客戶端配合完成，下面以本地測試過程中的操作舉例說明：

1. 服務(wù)端

上傳資源：

將上面生成的 wgt 文件存放在服務(wù)器的目錄下，例如完整的示例文件地址為： http://www.example.com/files/DEMO_APP_202504210407.wgt

提供檢測更新接口：

需約定用于檢測升級的接口，示例接口地址為：http://www.example.com/api/checkVersion

注意：服務(wù)端的具體判定邏輯，需根據(jù)自身業(yè)務(wù)需求靈活調(diào)整。

該部分內(nèi)容不做重點(diǎn)講述！

2. 客戶端

客戶端需要在合適的場景下主動檢測升級，如果發(fā)現(xiàn)有新版的 wgt 資源包，需要下載到本地進(jìn)行安裝，一般在應(yīng)用啟動的時候檢測一次即可。

在 App.vue 的 onLaunch 中進(jìn)行檢測升級，代碼如下：

// #ifdef APP-PLUS
plus.runtime.getProperty(plus.runtime.appid, function (widgetInfo) {
  uni.request({
    url: 'http://www.example.com/api/checkVersion',
    data: {
      version: widgetInfo.version,
      name: widgetInfo.name
    },
    success: result => {
      const data = result.data
      if (data.update && data.wgtUrl) {
        uni.downloadFile({
          url: data.wgtUrl,
          success: downloadResult => {
            if (downloadResult.statusCode === 200) {
              plus.runtime.install(
                downloadResult.tempFilePath,
                {
                  force: false
                },
                function () {
                  // 下載資源成功，重啟應(yīng)用
                  plus.runtime.restart()
                },
                function (e) {
                  // 下載資源失敗
                }
              )
            }
          }
        })
      }
    }
  })
})
// #endif

這段代碼主要實(shí)現(xiàn)了：

• 獲取應(yīng)用信息：借助 plus.runtime.getProperty 方法，獲取當(dāng)前應(yīng)用的信息，像版本號、應(yīng)用名稱這類信息會存儲在 widgetInfo 對象里。

• 發(fā)起版本檢測請求：使用 uni.request 方法向服務(wù)端的 http://www.example.com/api/checkVersion 接口發(fā)送請求，請求數(shù)據(jù)包含當(dāng)前應(yīng)用的版本號和名稱。

• 處理服務(wù)端響應(yīng)：當(dāng)請求成功后，檢查服務(wù)端返回的數(shù)據(jù)。若 data.update 為 true 且 data.wgtUrl 存在，就意味著有新的更新包。

• 下載更新包：利用 uni.downloadFile 方法下載服務(wù)端提供的 wgt 資源包。

• 安裝更新包：若下載成功（狀態(tài)碼為 200），則調(diào)用 plus.runtime.install 方法安裝下載好的 wgt 資源包。

• 處理安裝結(jié)果：安裝成功時，并重啟應(yīng)用；安裝失敗時，需要提示或進(jìn)行其他相關(guān)策略。

注意：代碼邏輯僅做了核心演示，實(shí)際情況下可以加入錯誤處理，比如在 uni.request 和 uni.downloadFile 里添加錯誤處理邏輯，從而更好地捕獲和處理請求與下載過程中出現(xiàn)的錯誤。

五. 注意事項(xiàng)

• 平臺限制：使用條件編譯，確保升級邏輯僅在 App 平臺執(zhí)行。

• 版本獲取：plus.runtime.version 或 uni.getSystemInfo() 讀取的是 apk/ipa 包版本號，而非 manifest.json 中的資源版本信息。因此，建議使用 plus.runtime.getProperty() 來獲取準(zhǔn)確的應(yīng)用信息。

• 安裝重啟：安裝 wgt 資源包成功后，務(wù)必調(diào)用 plus.runtime.restart()，否則更新內(nèi)容將無法生效。

• 兼容性測試：若僅升級 wgt 包而不更新 App 原生引擎，需特別注意測試 wgt 資源與原生基座的兼容性。平臺默認(rèn)會對版本不匹配的情況進(jìn)行提醒，如下圖所示：

如果自測沒問題，可以在 manifest 中配置忽略提示：

//...
"app-plus": {
    "compatible": {
        "ignoreVersion": true //true表示忽略版本檢查提示框，HBuilderX1.9.0及以上版本支持
    },
//....
}

六. 熱更新不支持的情況

• 當(dāng) SDK 部分進(jìn)行調(diào)整，例如新增 Maps 模塊時，無法通過熱更新方式升級，必須采用整包升級。

• 若對原生插件進(jìn)行增加或修改，同樣不能使用熱更新方式。

• 若原有項(xiàng)目中沒有 nvue 文件，而更新內(nèi)容包含新增 nvue 文件，也不適用熱更新方式。

七. 熱更新是否影響應(yīng)用審核

應(yīng)用市場出于防止開發(fā)者未經(jīng)審核向用戶提供違法內(nèi)容的考慮，大多對熱更新持謹(jǐn)慎態(tài)度。

然而，熱更新在實(shí)際開發(fā)中應(yīng)用廣泛，無論是原生開發(fā)還是跨平臺開發(fā)領(lǐng)域皆是如此。

Apple 曾封禁過 jspatch，但并未對其他熱更新方案如 Cordova、React Native、DCloud 進(jìn)行打擊。封禁 jspatch 主要是因其存在嚴(yán)重安全漏洞，可能被黑客利用來篡改其他 App 的數(shù)據(jù)。

使用熱更新時，需注意以下幾點(diǎn)：

• 在上架審核期間，切勿彈出熱更新提示。

• 采用 HTTPS 協(xié)議下載熱更新內(nèi)容，防止被第三方網(wǎng)絡(luò)劫持。

• 避免更新違法內(nèi)容，也不要通過熱更新?lián)p害應(yīng)用市場的利益，例如 iOS 的虛擬支付，此類情況需按規(guī)定向 Apple 分成。

只要遵循這些規(guī)則，應(yīng)用使用熱更新通常不會出現(xiàn)問題。

以上就是uni-app實(shí)現(xiàn)熱更新的詳細(xì)操作步驟的詳細(xì)內(nèi)容，更多關(guān)于uni-app熱更新的資料請關(guān)注腳本之家其它相關(guān)文章！

最新評論