uni-app 实现热更新的详细操作步骤

一、背景

App 成功上架后，更新频率可能逐渐增加。传统应用更新需用户重新下载安装，耗时耗流量且影响体验。热更新技术由此产生，提供更便捷的更新方式。

二、什么是热更新？

uni-app 热更新技术无需重新安装应用即可动态更新内容。它能在应用运行状态下升级功能、样式及资源，提升体验，缩短等待时间，降低更新成本。

简言之，uni-app APP 包含两种更新方式：

• 整包升级：将应用更新至最新版本，属全量更新。优点是更新全面、速度快；缺点是需重新安装应用。

• wgt 资源升级：仅更新应用资源至最新版本，属增量更新。优点是速度快、对用户影响小；缺点是存在局限性，不适用于所有更新类型。

uni-app 热更新实现流程如下：

• 在应用中集成热更新功能。
• 将更新内容打包为 wgt 资源包。
• 将 wgt 资源包上传至服务器。
• 应用启动时检查是否存在更新。
• 若存在更新，应用下载 wgt 资源包并安装。
• 应用重启后，更新内容生效。

三、生成 wgt

1. 前提条件

• 已在 HBuilderX 中创建应用并完成编译打包。

• 已配置应用 ID（appid）。

• 已配置应用版本号（version）。

具备其他应用上架所需条件，此处不再赘述。

2. 修改版本号

首先更新 manifest.json 中的版本号。例如从 1.0.0 升级至 1.0.1 或 1.1.0，新版本号必须大于现有版本。

3. 打包 wgt 包

在 HBuilderX 中执行升级包（wgt）打包操作。

点击菜单 -> 发行 -> App - 制作应用 wgt 包。

打包完成后，控制台将输出 wgt 升级包的具体路径。

四、安装 wgt

安装应用资源升级包（wgt）需服务端与客户端协同完成，以下以本地测试操作为例：

1. 服务端

上传资源：

将生成的 wgt 文件存放于服务器目录，例如完整示例文件地址为： http://www.example.com/files/DEMO_APP_202504210407.wgt

提供检测更新接口：

需约定用于检测升级的接口，示例接口地址为：http://www.example.com/api/checkVersion

注意：服务端的具体判定逻辑需根据业务需求灵活调整。

该部分内容非重点，不做详细讲述。

2. 客户端

客户端需在合适场景主动检测升级。若发现新版 wgt 资源包，需下载至本地安装，通常在应用启动时检测一次。

在 App.vue 的 onLaunch 中进行检测升级，代码如下：

// #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 () {
                  // 下载资源成功，重启应用
                  plus.runtime.restart()
                },
                function (e) {
                  // 下载资源失败
                }
              )
            }
          }
        })
      }
    }
  })
})
// #endif

该代码主要实现以下功能：

• 获取应用信息：通过 plus.runtime.getProperty 方法获取当前应用信息，如版本号和名称，存储于 widgetInfo 对象中。

• 发起版本检测请求：使用 uni.request 方法向服务端 http://www.example.com/api/checkVersion 接口发送请求，包含当前应用版本号和名称。

• 处理服务端响应：请求成功后检查返回数据。若 data.update 为 true 且 data.wgtUrl 存在，则表明有新更新包。

• 下载更新包：利用 uni.downloadFile 方法下载服务端提供的 wgt 资源包。

• 安装更新包：若下载成功（状态码为 200），调用 plus.runtime.install 方法安装下载的 wgt 资源包。

• 处理安装结果：安装成功则重启应用；失败则提示或执行其他策略。

注意：代码逻辑仅为核心演示，实际应用中应加入错误处理，如在 uni.request 和 uni.downloadFile 中添加逻辑以捕获和处理请求及下载错误。

五、注意事项

• 平台限制：使用条件编译，确保升级逻辑仅在 App 平台执行。

• 版本获取：plus.runtime.version 或 uni.getSystemInfo() 读取的是 apk/ipa 包版本号，而非 manifest.json 中的资源版本信息。因此，建议使用 plus.runtime.getProperty() 获取准确应用信息。

• 安装重启：安装 wgt 资源包成功后，务必调用 plus.runtime.restart()，否则更新内容无法生效。

• 兼容性测试：若仅升级 wgt 包而不更新 App 原生引擎，需特别注意 wgt 资源与原生基座的兼容性。平台默认会对版本不匹配情况进行提醒，如下图所示：

如果自测无误，可在 manifest 中配置忽略提示：

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

六、热更新不支持的情况

• 当 SDK 部分进行调整，例如新增 Maps 模块时，无法通过热更新方式升级，必须采用整包升级。

• 若对原生插件进行增加或修改，同样不能使用热更新方式。

• 若原有项目中没有 nvue 文件，而更新内容包含新增 nvue 文件，也不适用热更新方式。

七、热更新是否影响应用审核

应用市场出于防止开发者未经审核向用户提供违法内容的考虑，大多对热更新持谨慎态度。

然而，热更新在实际开发中应用广泛，无论是原生开发还是跨平台开发领域皆是如此。

Apple 曾封禁过 jspatch，但并未对其他热更新方案如 Cordova、React Native、DCloud 进行打击。封禁 jspatch 主要是因其存在严重安全漏洞，可能被黑客利用来篡改其他 App 的数据。

使用热更新时，需注意以下几点：

• 在上架审核期间，切勿弹出热更新提示。

• 采用 HTTPS 协议下载热更新内容，防止被第三方网络劫持。

• 避免更新违法内容，也不要通过热更新损害应用市场的利益，例如 iOS 的虚拟支付，此类情况需按规定向 Apple 分成。

只要遵循这些规则，应用使用热更新通常不会出现问题。

以上就是uni-app实现热更新的详细操作步骤的详细内容，更多关于uni-app热更新的资料请关注本站其它相关文章！