App incremental update function based on Html5plus platform

For mobile apps, especially WebApp, how to update has always been a more important topic. Most of the previous apps were version-updated from the store, but for WebApp, using incremental updates saves traffic, and more importantly, it frees up new versions of the App Store's approval process to make the shelf time even more advanced.

First, the premise

1. Environment: Use Html5plus as the middleware for WebView to interact with the mobile platform; for Html5plus, refer to http://www.html5plus.org/#home
   

2. Requirements: Click "Check the Update", the app online check whether the version is updated, if so, download and update;

3. The update package suffix name is. Wgt, production method: Use Zip to package all project root directory under Html/js/css/images/manifest.json; Where: Manifest.json cannot have comments, otherwise the update fails under iOS;

Second, realize:

1. Check the Update button:

<ul class= "Mui-table-view" ><li class= "Mui-table-view-cell" ><a class= "Mui-navigate-right" onclick= " Checkupdate (false); " > Check for Updates </a><button class= "mui-btn mui-btn-link mui-btn-block" id= "Progress_button" style= "Display:none;" ></button></li></ul>

2. Update.js:

Function checkupdate (Auto)  {//api GET request address var checkurl =  "http://app.zimayun.com/REST/ checkupdate?appkey= " + APPKey + " &clientversion= " + plus.runtime.version;var  requestresponse = new object (); Requestresponse.success = function (Result)  {unloading ();var resultobject =  Json.parse (Result);if  (resultobject.apicode == 0)  { //when the API returns code of 0 indicates success if  ( resultobject.needupdate)  {//messagebox ("Need Update",  function ()  {//messagebox ("Download package address:"  +  Resultobject.url, function ()  {confirmbox ("There is a new version, is it updated?") ",  function ()  {document.getelementbyid (" Progress_button ") .style.csstext = " display:  Block; "; Console.log (document.getElementById ("Progress_button"). Style.csstext); Updatekey = resultobject.updatekey;//downloadfile (Resultobject.url);D Ownloadfile (serverHost +   "/APP/UPDATE.WGT");}, function ()  {retuRN;}); /});//});}  else {if  (!auto)  {messagebox ("No update Required",  function ()  {});}}  else {if  (!auto)  {showerror ();}} Requestresponse.error = function (Result)  {unloading (); ShowError ();} Console.log (Checkurl);//Send Request SendData (checkurl, requestresponse);  //send post}//complete update function  Finishupdate ()  {//api GET request address var updateurl =  "Http://app.zimayun.com/REST/FinishUpdate? Updatekey= " + UpdateKey; updateurl = updateurl +  "&model="  + encodeuricomponent (GetDeviceInfo (). Model); updateurl = updateurl +  "&vendor="  + encodeuricomponent (GetDeviceInfo (). Vendor); updateurl = updateurl +  "&uuid="  + encodeuricomponent (GetDeviceInfo (). UUID); updateurl = updateurl +  "&screen="  + encodeuricomponent (GetDeviceInfo (). screen); updateurl = updateurl +  "&dpi="  +&nbSp;encodeuricomponent (Getdeviceinfo (). DPI); updateurl = updateurl +  "&networkinfo="  + encodeuricomponent (GetDeviceInfo () . Networkinfo); updateurl = updateurl +  "&oslanguage="  + encodeuricomponent (GetDeviceInfo (). OS. Language); updateurl = updateurl +  "&osversion="  + encodeuricomponent (GetDeviceInfo (). OS. Version); updateurl = updateurl +  "&osname="  + encodeuricomponent (GetDeviceInfo (). OS. Name); updateurl = updateurl +  "&osvendor="  + encodeuricomponent (GetDeviceInfo (). OS. Vendor); Var requestresponse = new object (); Requestresponse.success = function (Result)  {var resultobject = json.parse (Result ;if  (resultobject.apicode == 0)  { //when API returns code of 0 indicates success} else {//showerror ();}} Requestresponse.error = function (Result)  {}//send request SendData (updatEurl, requestresponse)  //send post}//download function downloadfile (URL)  {var d =  Plus.downloader.createDownload (Url, {}, function (f, s)  {document.getelementbyid ("Progress_ Button ") .style.csstext = " display: none; "; Confirmbox ("Download complete, Update Now",  function ()  {//console.log (f.filename)/* * unzip the  Folder:  *///plus.zip.decompress ( f.filename,  "_doc/",  function () {alert ("decompress success!")} ,  function (Err) {//alert (json.stringify (ERR)),//});p Lus.runtime.install (F.filename, {force:true},  function ()  {//update the server to notify alert ("The update is complete and the app will be restarted!") "); Finishupdate ();p Lus.runtime.restart (),},function (err) {alert (json.stringify (ERR)); Mui.toast ("Installation upgrade Failed");});  function ()  {return;});}, function ()  {messagebox ("Download Failed",  function ()  {}); D.addeventlistener (' statechanged ',  function (download, status)  {//console.log (JSON.stringify ( Download)); IF&NBSP; (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 ();} Confirmation message Function confirmbox (MSG,&NBSP;OKFN,&NBSP;CANCELFN)  {plus.nativeui.confirm (MSG, function (E )  {if  (e.index == 0) &NBSP;{OKFN ();} &NBSP;ELSE&NBSP;{CANCELFN ();}},  "hint",  ["OK",  "Cancel"]); Send data 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&NBSP;==&NBSP;200) &nbsP {responseobject.success (myxmlhttprequest.responsetext);}  else {plus.nativeui.toast ("Check for update Error");} Break;}} Myxmlhttprequest.open ("GET",  url); Myxmlhttprequest.send ();} Get System Information 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] =  "Unknown"; types[ plus.networkinfo.connection_none] =  "Network not Connected"; Types[plus.networkinfo.connection_ethernet] =  "Wired Network";types[plus.networkinfo.connection_wifi] =  "WiFi network"; types[ plus.networkinfo.connection_cell2g] =  "2G cellular network"; types[plus.networkinfo.connection_cell3g] =   "3G Cellular Network";types[plus.networkinfo.connection_cell4g] =  "4G Cellular network";d Evice. Networkinfo = types[plus.networkinfo.getcurrenttype ()];d evice. Os = {language: plus.os.language,version: plus.os.version,name: plus.os.name,vendor:  plus.os.vendor};return device;}

which

Plus.runtime.install (F.filename, {force:true}, function () {

This line,{force:true}, is an essential parameter. This is because there are still some bugs under Android and must be added.

Implementation effect: When the user clicks Check Update, first check whether update, if need update, download zip format. wgt file, call Plus.runtime.install to install, successful installation, then automatically restart the app.

App incremental update function based on Html5plus platform