四月技术伍成才
四月技术伍成才
  • 发布:2015-10-26 23:42
  • 更新:2020-03-22 13:49
  • 阅读:9219

制作app升级包的简单办法

分类:HBuilder

app发布之后,怎么确保app能顺利更新呢?
办法一: 做一个升级按钮,让用户主动去升级。
办法二:启动程序后,检查升级包,有升级包就提示用户当前app可升级。

官方提供了一套制作app升级功能的代码案例。
我这里是记录一下我参考官方的代码后 做的升级功能,和思路;

思路:
当要检测是否有最新升级包是,app必须发送当前的版本号到 服务器的某个接口用于和最新的app发行版本进行比较。

假如当前版本是1.1, 和最新发行版本1.2比较,比较一下版本的数字大小就知道 升级包有新版本,可以进行升级。(为了方便进行大小比较,建议写版本的时候用小数,而不是用 1.1.2 这种类型,不方便比较大小);

在app端,通过mui.ajax 发送版本号到,服务器端接口上。服务器端的接口处理逻辑:
这里用php实现:

 $appinfo = array(  
	'appid'=> 'HBuilder',  
	'version' => '2.0',  
	'fileurl'=>'upgrade/H5366115D.wgt' //这个是相对服务器端网址url 下的根目录,升级包文件  
 );  
 //以上是每次制作好升级包都需要修改一下 version 这个值。值要和你在hbuilder里的app版本号一致。  
  
 if(isset($_POST['ver']) && ($_POST['ver'] < $appinfo['version'])){	   
	$ret = array('code'=>1, 'url'=> $appinfo['fileurl']);	  
 }else{  
	$ret = array('code'=>0, 'url'=>'');   
 }  
 echo json_encode($ret);  
 exit;

所以,ajax 请求接口后,如果有最新升级包,接口会返回 这个升级包的url地址。

下面是app端的 检查可以升级的js代码:

var _config = {url : 'http://www.xxxxx.com/'}  
var checkUrl= _config.url + "appgys/upgrade.php";  
//需要传递当前的版本  
function checkUpdate( wgtVer ){  
	   
	plus.nativeUI.showWaiting("检测更新...");  
	mui.ajax( checkUrl , { dataType : "json", type : 'POST',   
			data : {ver : wgtVer},  
			success : function(json){    
				plus.nativeUI.closeWaiting();  
				if( parseInt(json.code) ==1 ){ 	 						   
				    //可以升级  
				    plus.nativeUI.confirm("检查到当前版本有最新更新,下载升级?",  
					    function(event){  
					    	if(event.index ==0){  
					    		console.log('下载地址:'+_config.url + json.url)  
					    		downWgt(_config.url + json.url); //下载更新版的地址  
					    	}	 			    	   
					    } ,'系统消息',['马上升级','下次再说']);				     
				} else{    
					plus.nativeUI.toast("无新版本可更新!");  
				}  
			},  
			error : function(xhr, error){   
				plus.nativeUI.closeWaiting();  
				plus.nativeUI.toast('检测更新失败!') ;  
			}  
		}) ;	   
}  
// 下载wgt文件  
   
function downWgt(wgtUrl){  
	plus.nativeUI.showWaiting("下载更新文件...");  
	plus.downloader.createDownload( wgtUrl, {filename:"_doc/update/"}, function(d,status){  
		if ( status == 200 ) {   
			//console.log("下载wgt成功:"+d.filename);  
			installWgt(d.filename);	// 安装wgt包  
		} else {  
			//console.log("下载wgt失败!");  
			plus.nativeUI.alert("下载更新失败!");  
		}  
		plus.nativeUI.closeWaiting();  
	}).start();  
}  
// 更新应用资源    
function installWgt(path){  
	plus.nativeUI.showWaiting("安装更新文件...");  
	plus.runtime.install(path,{},function(){  
		plus.nativeUI.closeWaiting();		   
		plus.nativeUI.alert("应用资源更新完成!",function(){  
			plus.runtime.restart();  
		});  
	},function(e){  
		plus.nativeUI.closeWaiting();		   
		plus.nativeUI.alert("安装更新文件失败["+e.code+"]:"+e.message);  
	});  
}  
 
2015-10-26 23:42 负责人:无 分享
已邀请:

最佳回复

四月技术伍成才

四月技术伍成才 (作者)

接下来 是 用户主动进行升级的时候:
需要做一个按钮让用户点击,然后开始升级代码:

 <script type="text/javascript">  
//在页面中初始化plus插件  
    	 mui.init();  
    	 mui.plusReady(function(){  
    	 	plus.runtime.getProperty(plus.runtime.appid,function(inf){   
					 document.getElementById("version_id").innerHTML = inf.version;    
					   
				});    
    	 });  
    	 //检测升级  
function  upgrade_app_wgt(){  
	plus.runtime.getProperty(plus.runtime.appid,function(inf){   
		checkUpdate( inf.version);   
		console.log(inf.version)  
		//sessionStorage.setItem('upgrade','1');  
	});    
}  
    
    </script>

接着,放一个按钮,让用户一点运行检查升级

  
 <button onclick="upgrade_app_wgt()">当前版本<span id="version_id"></span></button> 
四月技术伍成才

四月技术伍成才 (作者)

另外是 app自动检查到有最新升级包,然后提示用户安装升级包:

//检查更新  
			if(sessionStorage.getItem('upgrade') !='1'){  
				plus.runtime.getProperty(plus.runtime.appid,function(inf){   
					checkUpdate( inf.version);   
					sessionStorage.setItem('upgrade','1');  
	   			});  
   			}

这里利用app 的sessionStorage来保存是否有检测过更新,
这样就每次在用户打开app 的时候,app主动去检查是否有更新。

  • 卡卡啦

    http://www.dcloud.io/helloh5/update.json 我用这个地址 怎么不行啊?


    2016-02-25 18:12

c***@163.com

c***@163.com

有没有做好的升级程序直接下载来用的啊?谢谢

1***@qq.com
2***@qq.com

2***@qq.com

你好,我的一直提示无法降级安装,怎么回事,手机版本1.0,服务端版本是1.1

人走板凳凉

人走板凳凉

最近在学习制作app,刚好到了升级这块。学习了

该问题目前已经被锁定, 无法添加新回复