uni-app: 如何实现增量更新功能?

都知道,不少APP都有增量更新功能,Uni APP也是在今年初,推出了增量更新功能,今天咱们就来学习一波。 固然,不少应用市场为了防止开发者不经市场审核许可,给用户提供违法内容,对增量更新大多持排斥态度,特别是apple。因此拥有增量更新的app,须要注意如下几点:javascript

一、上架审核期间不要弹出增量更新提示vue

二、增量更新内容使用https下载,避免被三方网络劫持java

三、不要更新违法内容、不要经过增量更新破坏应用市场的利益,好比iOS的虚拟支付要给Apple抽佣等node

经过本章节你能学到那些?

一、如何实现增量更新功能 二、Uni-App 如何制做增量更新升级包 三、Uni-App 增量更新功能须要注意些什么 四、Uni-App 部分相关api学习数据库

uni-app: 引导页功能如何实现?

话很少说,直接上干货!express

如何实现增量更新功能

这里不是针对Uni-App开发,全部的增量更新都应如此(但代码以Uni-App为例)。json

一、app端,先调用服务端接口,判断是否须要更新小程序

二、须要更新,直接下载更新升级包微信小程序

三、安装升级包,app重启便可完成升级api

ok,咱们以Uni-App为例,看看代码具体实现

客户端实现 在 根目录 App.vue 的 onLaunch 中检测升级,代码以下:

// #ifdef APP-PLUS 
plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) {  
    uni.request({  
        url: 'http://www.javanx.cn/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) {
                              // 这里的错误很重要,最好能记录的服务器日志中,方便调试或之后维护了解更新错误状况,及时解决
                              // 如何更新到服务器?
                              // 调用一个接口,将e返回咯
                              console.error('install fail...');  
                            });  
                        }  
                    }  
                });  
            }  
        }  
    });  
});  
// #endif
复制代码

代码解析: 一、#ifdef APP-PLUS 判断是app端,才检测是否须要更新

二、plus.runtime.getProperty 获取指定APPID对应的应用信息

plus.runtime.getProperty( plus.runtime.appid, function ( wgtinfo ) {
  //appid属性
  var wgtStr = "appid:"+wgtinfo.appid;
  //version属性
  wgtStr += "<br/>version:"+wgtinfo.version;
  //name属性
  wgtStr += "<br/>name:"+wgtinfo.name;
  //description属性
  wgtStr += "<br/>description:"+wgtinfo.description;
  //author属性
  wgtStr += "<br/>author:"+wgtinfo.author;
  //email属性
  wgtStr += "<br/>email:"+wgtinfo.email;
  //features 属性
  wgtStr += "<br/>features:"+wgtinfo.features;
  console.log( wgtStr );
} );
复制代码

三、uni.request调用服务端接口,传入当前版本,服务端返回update是否须要更新,须要更新时返回wgtUrl更新升级包路径。

四、uni.downloadFile 下载文件资源到本地,客户端直接发起一个 HTTP GET 请求,返回文件的本地临时路径tempFilePath。如何咱们须要监听下载进度,能够这样:

var downloadTask = uni.downloadFile({
    url: 'https://www.javanx.cn/file/uni-app.rar',
    complete: ()=> {}
});
downloadTask.onProgressUpdate(function(res)=>{
  console.log('下载进度' + res.progress);
  console.log('已经下载的数据长度' + res.totalBytesWritten);
  console.log('预期须要下载的数据总长度' + res.totalBytesExpectedToWrite);
})
复制代码

downloadTask 对象的还提供了一下方法: (1)、abort 中断下载任务

(2)、onHeadersReceived` 监听 HTTP Response Header 事件,会比请求完成事件更早,仅微信小程序平台支持

(3)、offProgressUpdate 取消监听下载进度变化事件,仅微信小程序平台支持

(4)、offHeadersReceived 取消监听 HTTP Response Header 事件,仅微信小程序平台支持

五、plus.runtime.install(filePath, options, installSuccessCB, installErrorCB)。 支持如下类型安装包:

(1)、应用资源安装包(wgt),扩展名为'.wgt';

(2)、应用资源差量升级包(wgtu),扩展名为'.wgtu';

(3)、系统程序安装包(apk),要求使用当前平台支持的安装包格式。 注意:仅支持本地地址,调用此方法前需把安装包从网络地址或其余位置放置到运行时环境能够访问的本地目录。

服务端实现 以nodejs为例:

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 // apk,ipa包可下载地址
            })  
        } else if (currentVersions[currentVersions.length-1] < resultVersions[resultVersions.length-1]) {
          // 认为是小版本更新 
            callback({  
                update: true,  
                wgtUrl: result.wgtUrl, // wgt包可下载地址
                pkgUrl: ''  
            }) 
        }  else {  
            // 其它状况均不更新
            callback({  
                update: false
            })  
        }  
    });  
}  

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);  
    });  
});
复制代码

ok,有了以上的功能,咱们就用HBuilderx制做升级包.wgt,放到服务器上,共升级使用。

Uni-App 如何制做增量更新升级包

一、更新 manifest.json 中的版本号。若是上一个版本的版本号是1.0.0,这里打升级包的时候就能够是1.0.1,反正要不前面的大,你们也可看到服务端接口实现了,就是经过版本号来判断的。

uni-app: 引导页功能如何实现?

二、菜单->发行->原生App-制做移动App资源升级包

uni-app: 引导页功能如何实现?

三、等待控制台生成升级包的输出位置

uni-app: 引导页功能如何实现?

四、将升级包上传到服务器,接口实现并返回:wgtUrl=刚刚打的升级包

这样,咱们的app就拥有了,增量更新功能。每次若是是小量更新,就能够经过wgt包,来实现增量更新。

下面来看看,Uni App增量更新时,须要注意哪些问题?

Uni-App 增量更新功能须要注意些什么

一、SDK 部分有调整,好比新增了 Maps 模块等,不可经过此方式升级,必须经过整包的方式升级。

二、若是是老的非自定义组件编译模式,以前没有 nvue 文件,但更新中新增了 nvue 文件,不能使用此方式。由于非自定义组件编译模式若是没有 nvue 文件是不会打包weex引擎进去的,原生引擎没法动态添加。自定义组件模式默认就含着weex引擎,无论工程下有没有nvue文件。

三、原生插件的增改,一样不能使用此方式。

四、#ifdef APP-PLUS 条件编译,仅在 App 平台执行此升级逻辑。

五、appid 以及版本信息等,在 HBuilderX 真机运行开发期间,均为 HBuilder 这个应用的信息,所以须要打包自定义基座或正式包测试升级功能。

六、plus.runtime.version 或者uni.getSystemInfo() 读取到的是 apk/ipa 包的版本号,而非 manifest.json 资源中的版本信息,因此这里用 plus.runtime.getProperty() 来获取相关信息。

七、安装 wgt 资源包成功后,必须执行 plus.runtime.restart(),不然新的内容并不会生效。

八、若是App的原生引擎不升级,只升级wgt包时须要注意测试wgt资源和原生基座的兼容性。平台默认会对不匹配的版本进行提醒,若是自测没问题,能够在manifest中配置忽略提示

总结

今天你学到了什么?Uni-App 增量更新你学会了吗?

最后,谢谢你们支持。

uni-app: 如何实现增量更新功能?
喜欢的能够关注我哦!

原文地址:www.javanx.cn/20190920/un…

相关文章
相关标签/搜索