uni-app 资源在线升级/热更新

叁歲伎倆 2023-06-13 04:56 48阅读 0赞

# uni-app 资源在线升级/热更新 #

分类：uni-app

[wgt][] [uniapp][] [热更新][Link 1]

注：本文为前端代码资源热更新。如果是整包升级，另见文档[https://ask.dcloud.net.cn/article/34972][https_ask.dcloud.net.cn_article_34972]

HBuilderX 1.6.5 起，uni-app 支持生成 App 资源升级包。

## 生成 App 资源升级包 ##

### 修改版本号 ###

首先，更新 manifest.json 中的版本号。  
比如之前是 1.0.0，那么新版本应该是 1.0.1 或 1.1.0 这样。

[![format_png][]][format_png 1]

### 发行 ###

然后，在 HBuilderX 中生成升级包（wgt）。  
菜单->发行->原生App-制作移动App资源升级包

[![format_png 2][]][format_png 2 1]

生成结束会在控制台告知升级包的输出位置。

[![format_png 3][]][format_png 3 1]

## 安装资源升级包 ##

应用的升级需要服务端与客户端配合完成，下面以本地测试过程中的操作举例说明：

### 存放资源 ###

将 %appid%.wgt 文件存放在服务器的 static 目录下，即 http://www.example.com/static/**UNI**832D722.wgt。

### 服务端接口 ###

约定检测升级的接口，地址为：http://www.example.com/update/

传入参数

<table> 
 <thead> 
  <tr> 
   <th>参数名</th> 
   <th>类型</th> 
   <th>默认值</th> 
   <th>说明</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>name</td> 
   <td>String</td> 
   <td>''</td> 
   <td>客户端读取到的应用名称，定义这个参数可以方便多个应用复用接口。</td> 
  </tr> 
  <tr> 
   <td>version</td> 
   <td>String</td> 
   <td>''</td> 
   <td>客户端读取到的版本号信息</td> 
  </tr> 
 </tbody> 
</table>

返回参数

<table> 
 <thead> 
  <tr> 
   <th>参数名</th> 
   <th>类型</th> 
   <th>默认值</th> 
   <th>说明</th> 
  </tr> 
 </thead> 
 <tbody> 
  <tr> 
   <td>update</td> 
   <td>Boolean</td> 
   <td>false</td> 
   <td>是否有更新</td> 
  </tr> 
  <tr> 
   <td>wgtUrl</td> 
   <td>String</td> 
   <td>''</td> 
   <td>wgt 包的下载地址，用于 wgt 方式更新。</td> 
  </tr> 
  <tr> 
   <td>pkgUrl</td> 
   <td>String</td> 
   <td>''</td> 
   <td>apk/ipa 包的下载地址或 AppStore 地址，用于整包升级的方式。</td> 
  </tr> 
 </tbody> 
</table>

代码示例

下面是一个简单的服务端判定的示例，仅做参考，实际开发中根据自身业务需求处理。

复制代码var express = require('express');  
    var router = express.Router();  
    var db = require('./db');  
    
    // TODO 查询配置文件或者数据库信息来确认是否有更新  
    function checkUpdate(params, callback) {  
        db.query('一段SQL', function(error, result) {  
            // 这里简单判定下，不相等就是有更新。  
            var currentVersions = params.appVersion.split('.');  
            var resultVersions = result.appVersion.split('.');  
    
            if (currentVersions[0] < resultVersions[0]) {  
                // 说明有大版本更新  
                callback({  
                    update: true,  
                    wgtUrl: '',  
                    pkgUrl: result.pkgUrl  
                })  
            } else {  
                // 其它情况均认为是小版本更新  
                callback({  
                    update: true,  
                    wgtUrl: result.wgtUrl,  
                    pkgUrl: ''  
                })  
            }  
        });  
    }  
    
    router.get('/update/', function(req, res) {  
        var appName = req.query.name;  
        var appVersion = req.query.version;  
        checkUpdate({  
            appName: appName,  
            appVersion: appVersion  
        }, function(error, result) {  
            if (error) {  
                throw error;  
            }  
            res.json(result);  
        });  
    });

注意事项

*  以上约定，仅做参考。
 *  服务端的具体判定逻辑，请根据自身的业务逻辑灵活处理。
 *  应用中的路径尽量不要包含特殊符号

### 客户端检测升级 ###

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

复制代码// #ifdef APP-PLUS  
    plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) {  
        uni.request({  
            url: 'http://www.example.com/update/',  
            data: {  
                version: widgetInfo.version,  
                name: widgetInfo.name  
            },  
            success: (result) => {  
                var 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() {  
                                    console.log('install success...');  
                                    plus.runtime.restart();  
                                }, function(e) {  
                                    console.error('install fail...');  
                                });  
                            }  
                        }  
                    });  
                }  
            }  
        });  
    });  
    // #endif

### 不支持的情况 ###

*  SDK 部分有调整，比如新增了 Maps 模块等，不可通过此方式升级，必须通过整包的方式升级。
 *  如果是老的非自定义组件编译模式，之前没有 nvue 文件，但更新中新增了 nvue 文件，不能使用此方式。因为非自定义组件编译模式如果没有nvue文件是不会打包weex引擎进去的，原生引擎无法动态添加。自定义组件模式默认就含着weex引擎，不管工程下有没有nvue文件。
 *  原生插件的增改，同样不能使用此方式。

### 注意事项 ###

*  条件编译，仅在 App 平台执行此升级逻辑。
 *  appid 以及版本信息等，在 HBuilderX 真机运行开发期间，均为 HBuilder 这个应用的信息，因此需要打包自定义基座或正式包测试升级功能。
 *  plus.runtime.version 或者 uni.getSystemInfo() 读取到的是 apk/ipa 包的版本号，而非 manifest.json 资源中的版本信息，所以这里用 plus.runtime.getProperty() 来获取相关信息。
 *  安装 wgt 资源包成功后，**必须**执行 plus.runtime.restart()，否则新的内容并不会生效。
 *  如果App的原生引擎不升级，只升级wgt包时需要注意测试wgt资源和原生基座的兼容性。平台默认会对不匹配的版本进行提醒，如果自测没问题，可以在manifest中配置忽略提示，详见[https://ask.dcloud.net.cn/article/35627][https_ask.dcloud.net.cn_article_35627]
 *  www.example.com 是一个仅用做示例说明的地址，实际应用中应该是真实的 IP 或有效域名，请勿直接复制粘贴使用。

### 关于热更新是否影响应用上架 ###

应用市场为了防止开发者不经市场审核许可，给用户提供违法内容，对热更新大多持排斥态度。

但实际上热更新使用非常普遍，不管是原生开发中还是跨平台开发。

Apple曾经禁止过jspatch，但没有打击其他的热更新方案，包括cordovar、react native、DCloud。封杀jspatch其实是因为jspatch有严重安全漏洞，可以被黑客利用，造成三方黑客可篡改其他App的数据。

使用热更新需要注意：

*  上架审核期间不要弹出热更新提示
 *  热更新内容使用https下载，避免被三方网络劫持
 *  不要更新违法内容、不要通过热更新破坏应用市场的利益，比如iOS的虚拟支付要老老实实给Apple分钱

如果你的应用没有犯这些错误，应用市场是不会管的。

[wgt]: https://ask.dcloud.net.cn/topic/wgt
[uniapp]: https://ask.dcloud.net.cn/topic/uniapp
[Link 1]: https://ask.dcloud.net.cn/topic/%E7%83%AD%E6%9B%B4%E6%96%B0
[https_ask.dcloud.net.cn_article_34972]: https://ask.dcloud.net.cn/article/34972
[format_png]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly9pbWctY2RuLXFpbml1LmRjbG91ZC5uZXQuY24vdXBsb2Fkcy9hcnRpY2xlLzIwMTkwMzA4LzBhYWFmZGFkYWNkMWM5MjJkNGQ0ZGZhN2VmZTdkOWViLnBuZw?x-oss-process=image/format,png
[format_png 1]: https://img-cdn-qiniu.dcloud.net.cn/uploads/article/20190308/0aaafdadacd1c922d4d4dfa7efe7d9eb.png
[format_png 2]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly9pbWctY2RuLXFpbml1LmRjbG91ZC5uZXQuY24vdXBsb2Fkcy9hcnRpY2xlLzIwMTkwMzA4L2MzMzMxZWJhMDFhMWNjYjZiYmNiOWYyZjExMjk5OTk2LnBuZw?x-oss-process=image/format,png
[format_png 2 1]: https://img-cdn-qiniu.dcloud.net.cn/uploads/article/20190308/c3331eba01a1ccb6bbcb9f2f11299996.png
[format_png 3]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly9pbWctY2RuLXFpbml1LmRjbG91ZC5uZXQuY24vdXBsb2Fkcy9hcnRpY2xlLzIwMTkwMzA4LzBiODFkYjRlNGU4YTRiZmQyY2Q2YTk3MmI5MGNmODlkLnBuZw?x-oss-process=image/format,png
[format_png 3 1]: https://img-cdn-qiniu.dcloud.net.cn/uploads/article/20190308/0b81db4e4e8a4bfd2cd6a972b90cf89d.png
[https_ask.dcloud.net.cn_article_35627]: https://ask.dcloud.net.cn/article/35627