博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
H5+ app自动更新思路
阅读量:5876 次
发布时间:2019-06-19

本文共 8462 字,大约阅读时间需要 28 分钟。

第一种是一次自动更新

1.在服务器需要一个json或html文件,json最好

1 {2     "state":"yes",//是否自动更新3     "mark":"1.0.6",//版本号4     "url":"http:\/\/xx\/appproject\/mm.apk"//更新的应用下载地址5 }

2.自动更新函数

t是你当前正在运行的app的版本号

//检查自动更新function svn(t){    var xhr=new plus.net.XMLHttpRequest();    xhr.onreadystatechange=function(){         if(xhr.readyState==4)   {            if(xhr.status==200){                var res=JSON.parse(xhr.responseText);                if(res.state=='yes'){                    if(res.mark!=t){                        var upr;                        plus.nativeUI.confirm('有新版本发布了,是否更新?',function(e){                            upr=(e.index==0)?'Y':'N';                            if(upr=='Y'){                                var wt=plus.nativeUI.showWaiting('下载更新中,请勿关闭');                                var url=res.url;//下载地址                                var dtask=plus.downloader.createDownload(url,{},function(d,status){                                     if(status==200){                                         var path=d.filename;                                         plus.runtime.install(path);                                     }else{
//下载失败 alert('Download failed:'+status); } }); dtask.start(); }else {} },'xx系统',['确认','取消']); }else { console.log('最新'); } } }else { plus.nativeUI.toast('网络连接错误!'); } } } xhr.open('GET','http://xx/appproject/imes/update.json');//这里的地址是上面的json地址 xhr.send();}

3.调用方法:在每次系统打开运行的时候执行上面的函数就行了

svn(版本号);

转载自http://www.bcty365.com/content-146-5156-1.html

第二种是增量更新

对于移动app,尤其是webapp,如何更新一直是比较重要的话题。以前的大部分APP都是从应用商店进行版本更新,但是对于webapp来说,使用增量更新可以节省流量;更重要的是,它免去了新版本在应用商店的审核,使上架时间可以更加提前。

一、前提

  1.环境:使用H5+作为webview与手机平台交互的中间件;关于H5+,请自行参考http://www.html5plus.org/#home

  2.需求:点击“检查更新”,app在线检查版本是否有更新,如果有,下载并更新:

  3.更新包后缀名为:.wgt,制作方式:使用zip打包所有项目根目录下的html/js/css/images/manifest.json;其中:manifest.json不能有注释,否则在ios下将会更新失败;

二、实现

  1.检查更新按钮:

  2.update.js:

function CheckUpdate(auto){    //API的get请求    var checkUrl="http://app.com?appkey="+appkey+"&clientversion="+plus.runtime.version;    var RequestResponse=new Object();    RequestResponse.Success=function(Result){        Unloading();        var ResulteObject=JSON.parse(Result);        if(ResultObject.apicode==0){
//当api返回code为0表示成功 if(ResultObject.needUpdate){ //MessageBox("需要更新",function(){
//MessageBox("下载包地址:"+ResultObject.url,function(){
ConfirmBox("有新版本,是否更新?",function(){ document.getElementById("Progress_Button").style.cssText="display:block;"; UpdateKey=ResultObject.updatekey; DownloadFile(ResultObject.url); DownloadFile(serverHost+"/app/update.wgt"); },function(){ return; }); //}); //}); }else { if(!auto){ MessageBox("不需要更新",function(){}); } } }else { if(!auto){ showError(); } } } RequestResponse.Error=function(Result){ Unloading(); showError(); } console.log(CheckUrl); //发送请求 SendData(Checkrl,RequestResponse);//发送Post}//完成更新function FinishUpdate(){ //API的get请求地址 var UpdateUrl="http://app.zimayan.com/Rest/finishUpdate?updatekey="+UpdateKey; UpdateUrl+="&model="+encodeURIComponent(GetDeviceInfo().Model); UpdateUrl+="&vendor="+encodeURIComponent(GetDeviceInfor().Vendor); Update+="&uuid=" + encodeURIComponent(GetDeviceInfo().UUID); UpdateUrl+="&screen=" + encodeURIComponent(GetDeviceInfo().Screen); UpdateUrl+="&dpi=" + encodeURIComponent(GetDeviceInfo().DPI); UpdateUrl+="&networkinfo=" + encodeURIComponent(GetDeviceInfo().NetworkInfo); UpdateUr+="&oslanguage=" + encodeURIComponent(GetDeviceInfo().OS.Language); UpdateUrl+="&osversion=" + encodeURIComponent(GetDeviceInfo().OS.Version); UpdateUrl+="&osname=" + encodeURIComponent(GetDeviceInfo().OS.Name); UpdateUrl+="&osvendor=" + encodeURIComponent(GetDeviceInfo().OS.Vendor); var RequestResponse=new Object(); RequestResponse.Success=function(Result){ var ResultObject=JSON.parse(Result); if(ResultObject.apicode==0){
//当api返回code为0表示成功 }else { //showError(); } } RequestResponse.Error=function(Result){} //发送请求 SendDate(UpdateUrl,RequestResponse);//发送Post}//下载function DownloadFile(url){ var d = plus.downloader.createDownload(url, {}, function(f, s) { document.getElementById("Progress_Button").style.cssText = "display: none;"; ConfirmBox("下载完成,是否立即更新", function() {// console.log(f.filename) /* * unzip the folder.. */// plus.zip.decompress( f.filename, "_doc/", function(){alert("decompress success!")}, function(err){
// alert(JSON.stringify(err));// }); plus.runtime.install(f.filename, {force:true}, function() { //完成更新向服务器进行通知 alert("更新完毕,将重启应用!"); FinishUpdate(); plus.runtime.restart(); },function(err){ alert(JSON.stringify(err)); mui.toast("安装升级失败"); }); }, function() { return; }); }, function() { MessageBox("下载失败", function() {}); }); d.addEventListener('statechanged', function(download, status) {// console.log(JSON.stringify(download)); if (download.state == 3 && status == 200) { var percent = Math.round((download.downloadedSize / download.totalSize) * 100); document.getElementById("Progress_Button").innerHTML = (percent + "%"); } else if (download.state == 4) {} }, false); d.start();}//确认消息function ConfirmBox(MSG, OKFN, CancelFN) { plus.nativeUI.confirm(MSG, function(e) { if (e.index == 0) { OKFN(); } else { CancelFN(); } }, "提示", ["确定", "取消"]);}//发送数据function SendData(URL, ResponseObject) { var MyXMLHttpRequest = new plus.net.XMLHttpRequest(); MyXMLHttpRequest.onreadystatechange = function() { switch (MyXMLHttpRequest.readyState) { case 0: break; case 1: break; case 2: break; case 3: break; case 4: if (MyXMLHttpRequest.status == 200) { ResponseObject.Success(MyXMLHttpRequest.responseText); } else { plus.nativeUI.toast("检查更新出错"); } break; } } MyXMLHttpRequest.open("GET", URL); MyXMLHttpRequest.send();}//获得系统信息function GetDeviceInfo() { var device = { IMEI: plus.device.imei, IMSI: "", Model: plus.device.model, Vendor: plus.device.vendor, UUID: plus.device.uuid, Screen: plus.screen.resolutionWidth * plus.screen.scale + " x " + plus.screen.resolutionHeight * plus.screen.scale + "", DPI: plus.screen.dpiX + " x " + plus.screen.dpiY, OS: new Object() }; for (var i = 0; i < plus.device.imsi.length; i++) { device.IMSI += plus.device.imsi[i]; } var types = {}; types[plus.networkinfo.CONNECTION_UNKNOW] = "未知"; types[plus.networkinfo.CONNECTION_NONE] = "未连接网络"; types[plus.networkinfo.CONNECTION_ETHERNET] = "有线网络"; types[plus.networkinfo.CONNECTION_WIFI] = "WiFi网络"; types[plus.networkinfo.CONNECTION_CELL2G] = "2G蜂窝网络"; types[plus.networkinfo.CONNECTION_CELL3G] = "3G蜂窝网络"; types[plus.networkinfo.CONNECTION_CELL4G] = "4G蜂窝网络"; device.NetworkInfo = types[plus.networkinfo.getCurrentType()]; device.OS = { Language: plus.os.language, Version: plus.os.version, Name: plus.os.name, Vendor: plus.os.vendor }; return device;}

其中,

plus.runtime.install(f.filename,{force:true},function(){}

这一行,{force:true}这个参数必不可少。这是由于在安卓下目前还有一些bug,必须加上。

实现效果:当用户点击检查更新,先检查是否更新;如果需要更新,则下载自拍格式的.wgt文件,调用plus.runtime.install进行安装,安装成功后弹出成功,然后自动重启应用。

转载自:https://my.oschina.net/u/1866224/blog/382736

转载于:https://www.cnblogs.com/lijia-kapok/p/6553823.html

你可能感兴趣的文章
iOS - OC SQLite 数据库存储
查看>>
PHP-mysqllib和mysqlnd
查看>>
Redis常用命令
查看>>
NeHe OpenGL教程 第三十五课:播放AVI
查看>>
Linux下ping命令、traceroute命令、tracert命令的使用
查看>>
js replace,正则截取字符串内容
查看>>
socket
查看>>
Highcharts使用表格数据绘制图表
查看>>
Thinkphp5笔记三:创建基类
查看>>
hdu5373
查看>>
4.单链表的创建和建立
查看>>
Android 好看的搜索界面,大赞Animation
查看>>
查询反模式 - GroupBy、HAVING的理解
查看>>
[转]动态加载javascript
查看>>
【协议】5、gossip 协议
查看>>
基于配置文件的redis的主从复制
查看>>
hasura graphql 角色访问控制
查看>>
springmvc中controller内方法跳转forward?redirect?
查看>>
C#委托,事件理解入门 (译稿)转载
查看>>
容器的end()方法
查看>>