uniapp APP项目提示用户有新版本更新

自己想的更新思路,有较好办法的欢迎指出 !

我的思路是,通过接口判断,当前是否为最新版本,如果不是最新版本提示用户是否更新.这块版本判断是前端判断还是后端判断都无所谓,我这边例子是后端判断的,逻辑都是一样的,可以自行修改.

首先判断获取接口判断当前是否为最新版本

	onLoad() {
			this.updateApp();//检测是否有新版本
		},
methods:{
		//检查软件更新
			updateApp() {
				let _this = this;
				//plus.runtime.getProperty 这块是获取当前版本号的
				plus.runtime.getProperty(plus.runtime.appid, widgetInfo => {
				//这块是自己封装的请求接口 你们直接按照自己的请求修改即可
					this.$api.post(global.apiUrls.publicUpdateAPP, {
						version_name: widgetInfo.version,//这块是我给后端传的当前版本号
						type: 1,//因为我们分 员工端和用户端这块是用来做区分的 你们传参和后端订好字段 按需修改即可
					}).then(res => {
						if (res.data.code == 1 && res.data.data.is_new == 1) {
						
							//检测当前处于安卓 还是ios
							if (uni.getSystemInfoSync().platform === 'android') {
							//如果要做热更新的话可以自己在这块写逻辑,选择性的赋值下载地址,可以赋值wgt包也可以赋值apk包都是可以的
								_this.upDataUrl= res.data.data.version_url;//赋值最新版本下载地址
								_this.version = res.data.data.version;//赋值最新版本号
								_this.updata = true;//显示更新弹框

							} else {
								_this.iosupdata = true;//显示苹果更新弹框
								_this.version = res.data.data.version;//赋值最新版本号
							}
						}
					})
				});
			},



}

目前主流app分为,安卓和苹果两大类.
咱们先说安卓版本更新!
安卓因为各家手机都有自己的应用平台,所以想直接跳转到应用市场上面更新的办法,我这边没有想到.有大佬实现的可以评论学习.既然没办法跳转应用市场进行更新,那么我们就需要拿到一个可以下载最新包的地址.拿到后下载,然后跳转到安装界面.
html界面 此处使用了uview ui组件 ,想复制粘贴html的兄弟需要,引用uview.

<u-popup  v-model="updata" mode="center" :mask-close-able="false"  :mask-custom-style='styles'  border-radius="14">
				<view class="update-box" v-show="!isupdate">
					<view class="update-text">
						检测到有新版本{{version}},是否现在更新?
					</view>
					<view class="update-button">
						<view class="no-button" @tap.stop="noUpdate">
							暂不更新
						</view>
						<view class="ok-button" @tap.stop="okUpdate">
							立即更新
						</view>
					</view>
				</view>		
				<!-- 更新进度条 -->
				<view class="update-box" v-show="isupdate">
					<view class="update-text">
						更新增请勿退出!
					</view>
					<view class="schedule">
						<u-line-progress :striped-active="true" :striped="true" :percent="schedule"  active-color="#ff9900"></u-line-progress>
					</view>	
				</view>
			
		</u-popup>

一个是提示用户是否更新,如果用户点击更新按钮后,显示下载进度,如果用户取消更新,关闭提示弹框.

data需要用到的值 苹果安卓共用

data() {
			return {
				updata: false, //更新弹框显示
				version:'',//版本号				
				styles:{background: 'rgba(0, 0, 0, 0.1)'},	
				schedule:'',//进度
				isupdate:false,//是否更新
				upDataUrl:0,//下载地址
				iosupdata:false,//苹果更新
			}
		},	

methods:{
//安卓界面用户点击更新
			okUpdate(){
				this.isupdate = true;
				const downloadTask = uni.downloadFile({
					url: this.upDataUrl, //这块地址就是后端返回的最新版本安装包地址
					success: (res) => {
						if (res.statusCode === 200) {
							console.log('下载成功');
							//安装
							plus.runtime.install(res.tempFilePath, {
								force: false
							}, function() {
								console.log('install success...');
								plus.runtime.restart();
							}, function(e) {
								console.error('install fail...');
							});

						} else {
							uni.saveFile({
								tempFilePath: res.tempFilePath,
								success: function(red) {
									// console.log('保存成功')
									console.log('下载失败，中断下载任务')
									downloadTask.abort() //中断下载任务  
								}
							});
						}
					},
				});
				
				
				downloadTask.onProgressUpdate((res) => {
					console.log(res.progress)
					this.schedule = res.progress;
					// setTimeout(() => {
				
					// }, 1000);
					// _this.schedule = res.progress;
					// console.log(_this.schedule)
					// 测试条件，取消下载任务。
					if (res.progress > 99) {
						this.updata = false;
					}				
				});
				
				
			},
//用户点击取消  不更新
			noUpdate(){
				this.updata = false;
			},
}

苹果端的话咱们可以引导客户调转苹果appstore进行更新
html
因为苹果不需要有下载进度所以html中没有进度条

	<u-popup  v-model="iosupdata" mode="center" :mask-close-able="false"  :mask-custom-style='styles'  border-radius="14">
			<view class="update-box" v-show="!isupdate">
				<view class="update-text">
					检测到有新版本{{version}},是否现在更新?
				</view>
				<view class="update-button">
					<view class="no-button" @tap.stop="iosNoUpdata">
						暂不更新
					</view>
					<view class="ok-button" @tap.stop="iosOkUpdate">
						立即更新
					</view>
				</view>
			</view>
		</u-popup>

data所需的参数在上方安卓更新的data中已经包含

method:{
// ios端点击取消更新
			iosNoUpdata(){
				this.iosupdata = false;
			},
			//ios 更新
			iosOkUpdate(){
			//这块是appleId 获取方式可参考下方链接 这块可以使用变量数据也从后端接口获取 为了方便读者理解此处没有用变量
				let appleId=1549**8327 //app的appleId
				plus.runtime.launchApplication({
				  action: `itms-apps://itunes.apple.com/cn/app/id${appleId}?mt=8`
				}, function(e) {
				  console.log('Open system default browser failed: ' + e.message);
				});
			},
}

ios获取appleId的方法参考如下链接
appleId获取
https://blog.csdn.net/SLife4599/article/details/114033109