uniapp前端实现APP整包升级和APP资源热更新

App整包升级和APP资源热更新

uni-app App整包升级检测： https://ask.dcloud.net.cn/article/34972

uni-app App资源热更新： https://ask.dcloud.net.cn/article/35667

App资源热更新

思路：

1、首先，在主页或app.vue中使用plus.runtime.getProperty()获取到app的当前wgt包版本号。

2、然后，通过后端返回给你的接口里有一个版本号（需要手动去后台管理系统中上传一个wgt包，并输入这个wgt包的版本号）。

3、再之后，将这个版本号与app当前版本号进行对比，若当前版本号大于后端给你的版本号，就不升级，反之，则显示升级弹框，请用户下载升级（开发者调用下载安装api）。

4、最后，使用plus.runtime.restart()进行app重启刷新，在设置中加一个plus.runtime.getProperty()获取到版本号。

热更新所使用到的api：

1、获取app当前wgt包版本号：plus.runtime.getProperty()；

2、下载：uni.downloadFile（）；

3、安装wgt包：plus.runtime.install（）；

4、重启app：plus.runtime .restart（）；

代码

1、先获取app当前版本号与后端最新wgt包进行对比

//用于对比的函数
            duibi(version1 ,version2){
                    let arr1=version1.split(".");
                    let arr2=version2.split(".");
                    let length=Math.max(arr1.length,arr2.length);
                    for (let i = 0; i < length; i++) {
                        const n1 = Number(arr1[i]||0)
                        const n2 = Number(arr2[i]||0)
                        // 第一个版本号大
                        if (n1 > n2) return 1
                        //第二个版本号大
                        if (n1 < n2) return 2
                    }
                    return false;
            }

//获取app当前版本号
plus.runtime.getProperty(plus.runtime.appid, (widgetInfo) => {
                this.version  = widgetInfo.version; 
            });

注意：千万千万不要用这个（plus.runtime.version）作为判断，它获取的是当前app的安装包版本，上面的那个是获取wgt包的版本，两个不一样，plus.runtime.version始终是一个恒定的值，除非安卓整包更新。plus.runtime.version不能用做wgt热更新判断！！！

2、进行弹框询问和下载安装api调用，重启app完成热更新

if ('当前通过上面的对比需要更新时') {
  uni.showModal({
    title: "系统提示",
    content: `当前版本号为（当前版本号），邀您更新版本（最新版本号）`,
    success: (res) => {
      //用户确认更新
      if (res.confirm) {
        //使用下载api(uni.downloadFile)
        let uploadTask = uni.downloadFile({
          url: '下载地址',
          success: (downloadResult) => {
            //使用安装wgtapi(plus.runtime.install)
            plus.runtime.install(
              downloadResult.tempFilePath, {
              force: true
            },
              function () {
                uni.showModal({
                  title: '系统提示',
                  content: '新版本已经更新完成，需要重启应用',
                  showCancel: false,
                  //用户点击确认重启
                  success: function (
                    res) {
                    if (res
                      .confirm) {
                      调用重启api（plus.runtime
                        .restart）
                      plus.runtime
                        .restart();
                    } else if (res
                      .cancel) {
                      console
                        .log(
                          '用户点击取消'
                        );
                    }
                  }
                });
              }
            )

          }
        });

        //在这里监听用户下载进度
        uploadTask.onProgressUpdate((res) => {
          this.pro = res.progress;
          console.log(this.pro);
          if (this.pro == 100) {
            this.isDown = false;
          }
        })

      }
    }
  });
}

3、监听用户下载进度并优化弹框

为了使本文看起来不过于繁琐，就不单独再开一个代码块了，需要了解详情的可以进入官方文档

https://uniapp.dcloud.net.cn/api/request/network-file.html#uploadfile