H5+ app自动更新思路-白红宇

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

你可能感兴趣的文章