需求:提示一个升级弹窗,点击升级可以下载新的包
因为是uniapp直接发布到多端的可以发布到苹果和安卓系统,所以我们就需要适配苹果和安卓了
接下来分别讲解一下升级弹窗实现:
1.判断是什么系统
if(plat == 'ios'||plat == "IOS") {
//是苹果系统,检查苹果是否需要更新
that.checkIosUpdate()
}else{
//是安卓系统,检查安卓是否需要更新
that.checkAnriodUpdate()
}
2. 获取本地是什么版本,服务端是什么版本
uni.request({
url: 'xxxxx服务器地址',
data: {
text: 'uni.request'
},
success: (res) => {
//接口请求成功应该返回的苹果版本信息和安卓信息,具体信息大概如下
//用来展示的最新版本号 '1.0.0'
//用来判断的最新版本值 100
//服务端设置的下载地址
//此次更新的内容 本次为系统优化,优化了客服系统
}
});
3.获取完版本之后,通过定义在globalData的版本信息,对比版本值
export default {
globalData: {
version: {banbenhao:"1.0.0",vers:100}, //安卓本地版本信息
iosversion: {banbenhao:"1.0.0",vers:100},//苹果本地版本信息
},
};
4.对比完版本信息,当本地版本值小于服务端返回的最新版本值,进行下载包,进行安装
var that = this
if (plus.os.name == "iOS" || plus.os.name == "ios") {
//苹果端直接跳转从服务端获取苹果应用商店地址
plus.runtime.openURL(that.version.appUploadUrl)
} else {
//安卓通过自定义的downNewVersion函数然后下载安装
that.downNewVersion(that.version.appUploadUrl);
}
//res为服务端安卓包的下载地址
function downNewVersion(res){
//创建下载任务
let task = plus.downloader.createDownload(res, {
filename: '_downloads/update/' + new Date().getTime() + '/'
}, function(download, status) {
if (status == 200) {
//下载成功就安装安卓包
plus.runtime.install(download.filename, {}, function(e) {
console.log("install success")
that.cmdShow = false
uni.getSubNVueById('genxin').hide('slide-in-bottom', 300);
}, function(e) {
console.log("install fail")
that.cmdShow = false
uni.getSubNVueById('genxin').hide('slide-in-bottom', 300);
})
} else {
console.log("更新失败")
that.cmdShow = false
plus.nativeUI.closeWaiting()()
}
})
/**监控文件下载*/
task.addEventListener("statechanged", function(download, status) {
that.jinduFlag=true
let downSize = download.downloadedSize; //已下载大小
let totalSize = download.totalSize; //文件大小
that.max = "100%";
that.jindu = downSize;
let yu = that.jindu / that.max; //获取下载进度
that.width = Math.round(yu * 100);
//通过下载进度的状态做出
switch (download.state) {
case 2:
that.jindu = downSize;
//plus.nativeUI.showWaiting('正在下载')
break;
case 3:
that.jindu = Math.round(downSize / totalSize * 100);
console.log(that.jindu)
break;
case 4:
that.jinduFlag=false
that.cmdShow = false;
console.log("下载完成");
//关闭系统等待的对话框
plus.nativeUI.closeWaiting();
}
});
task.start();
}
接下来就自己写一个升级的弹窗页面就行了,把代码放进去,有什么不懂请私聊我,会给你解决问题!
有什么不足还请指出,谢谢大家看完!
分享不易,请大家动动发财的小手留下个点赞吧!