一. 背景

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

二. 什么是熱更新？

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

簡(jiǎn)而言之，uni-app APP 有兩種更新方式：

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

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

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

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

三. 生成 wgt

1. 前提條件

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

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

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

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

2. 修改版本號(hào)

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

3. 打包 wgt 包

在 HBuilderX 中打包升級(jí)包（wgt）

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

打包結(jié)束會(huì)在控制臺(tái)輸出 wgt 升級(jí)包的具體位置

四. 安裝 wgt

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

1. 服務(wù)端

上傳資源：

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

提供檢測(cè)更新接口：

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

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

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

2. 客戶端

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

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

// #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)用的信息，像版本號(hào)、應(yīng)用名稱這類信息會(huì)存儲(chǔ)在 widgetInfo 對(duì)象里。

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

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

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

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

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

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

五. 注意事項(xiàng)

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

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

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

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

如果自測(cè)沒(méi)問(wèn)題，可以在 manifest 中配置忽略提示：

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

六. 熱更新不支持的情況

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

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

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

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

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

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

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

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

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

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

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

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

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

最新評(píng)論