ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

uni-app检测版本升级并显示下载进度

2021-12-15 14:31:13  阅读:319  来源: 互联网

标签:console log res app 版本升级 version plus result uni


uni-app检测版本升级并显示下载进度

一、检测版本

1、自动检测

即打开应用是就检测应用版本,检测方法需要写在app.vue文件中,代码如下

image-20211215134920591

//APP更新
import configService from '@/common/service/config.service.js'
import store from '@/store'
console.log('configService', configService)
export default function appUpdate() {
	console.log('=============000000', configService.apiUrl)
	console.log('=============111111', uni.getStorageSync('base_url'))
	uni.request({
		url: configService.apiUrl +
			'/qd/app/version/queryNewOne', // 'http://app.jeecg.com/update.json', //检查更新的服务器地址
		data: {
			appid: plus.runtime.appid,
			version: plus.runtime.version,
			imei: plus.device.imei
		},
		header: {
			'X-Access-Token': store.state.token
		},
		success: (data) => {
			let res = data.data
			console.log('----------app res--' + JSON.stringify(res))
			//return;
			plus.runtime.getProperty(plus.runtime.appid, function(wgtinfo) {
				let client_version = wgtinfo.version
				console.log('client_version')
				console.log(client_version.split(".").splice(0, 2).join(""))
				console.log(res.result.versionCode.split(".").splice(0, 2).join(""))
				console.log(client_version.split(".").splice(0, 2).join("") < res.result.versionCode
					.split(".").splice(0, 2).join(""))
				console.log(client_version.split(".").splice(0, 2).join("") == res.result
					.versionCode.split(".").splice(0, 2).join(""))
				var flag_update = client_version.split(".").splice(0, 2).join("") < res.result
					.versionCode.split(".").splice(0, 2).join("")

				var ifEqual = client_version.split(".").splice(0, 2).join("") == res.result
					.versionCode.split(".").splice(0, 2).join("")
				var flag_hot = (Number(client_version.split(".")[2]) < Number(res.result.versionCode
					.split(".")[2])) && !flag_update
				console.log(client_version)
				console.log(flag_update)
				console.log(flag_hot)

				if (flag_update) {
					// 提醒用户更新
					uni.showModal({
						title: '更新提示',
						content: res.result.content || `更新新版本${res.result.versionCode}`,
						success: (showResult) => {
							if (showResult.confirm) {
								plus.nativeUI.toast("正在准备环境,请稍后!");
								console.log(res.result.androidUpdateUrl, )
								var dtask = plus.downloader.createDownload(res.result
									.androidUpdateUrl, {
										method: 'GET',
										filename: '_doc/update/'
									},
									function(d, status) {
										if (status == 200) {
											var path = d.filename; //下载apk
											plus.runtime.install(path); // 自动安装apk文件
										} else {
											plus.nativeUI.alert('版本更新失败:' + status);
										}
									});
								
								try {
									dtask.start(); // 开启下载的任务
									var prg = 0;
									var showLoading = plus.nativeUI.showWaiting(
										"正在下载"); //创建一个showWaiting对象 
									dtask.addEventListener('statechanged', function(
										task,
										status
									) {
										// 给下载任务设置一个监听 并根据状态  做操作
										switch (task.state) {
											case 1:
												showLoading.setTitle("正在下载");
												break;
											case 2:
												showLoading.setTitle("已连接到服务器");
												break;
											case 3:
												prg = parseInt(
													(parseFloat(task
															.downloadedSize
														) /
														parseFloat(task
															.totalSize)) *
													100
												);
												showLoading.setTitle("  正在下载" +
													prg + "%  ");
												break;
											case 4:
												plus.nativeUI.closeWaiting();
												//下载完成
												break;
										}
									});
								} catch (err) {
									plus.nativeUI.closeWaiting();
									uni.showToast({
										title: '更新失败-03',
										mask: false,
										duration: 1500
									});
								}
							}
						}
					})
					store.commit('SET_IFLASTVER', false)
				} else if (ifEqual && flag_hot) {
					uni.downloadFile({
						url: res.result.hotUpdateUrl,
						success: (downloadResult) => {
							console.log(downloadResult.tempFilePath)
							if (downloadResult.statusCode === 200) {
								plus.nativeUI.toast(`正在热更新!${res.result.versionCode}`);
								plus.runtime.install(downloadResult.tempFilePath, {
									force: false
								}, function() {
									plus.nativeUI.toast("热更新成功");
									plus.runtime.restart();
								}, function(e) {
									console.log(e)
									plus.nativeUI.toast(`热更新失败:${e.message}`);
								});
							}
						}
					});
					store.commit('SET_IFLASTVER', false)
				} else {
					store.commit('SET_IFLASTVER', true)
				}

			});
			console.log('-------------------------------res.result.androidUpdateUrl' + res.result
				.androidUpdateUrl)
			store.commit('SET_ANDROIDLINK', res.result.androidUpdateUrl)
			store.commit('SET_IOSLINK', res.result.iosUpdateUrl)

		}
	})
}

2.在个人中心显示应用版本,可以手动点击校验升级

image-20211215135614628

在个人中心的vue文件中的created方法中写入

image-20211215135754397

image-20211215135851788

image-20211215135911310

二、升级

1、版本升级,上面js代码中flag_update为true部分的代码,简略

image-20211215140758983

2、热更新

什么是热更新

代码中如何实现热更新,此处简略,详细见上文js对应部分

image-20211215141033757

我的设置解释如下:版本设置1.3.0,对应的版本号为130

image-20211215141206300

当后台返回过来的版本号大于应用的版本号时需要更新,举个例子:应用版本为1.2.0时,后台返回过来的版本号为1.3.0则需要全更新;当应用版本为1.2.0时,后台返回过来的版本号为1.2.1则需要进行热更新,热更新不需要用户确认才更新,可以理解为默默的自动更新

总结:就是当后台返回过来的版本号前两位大于应用版本号前两位时,则需要全更新;当后台返回过来的版本号前两位等于应用版本号前两位,但是后台的版本号最后一位大于应用版本号最后一位时,则需要热更新

附上项目的版本号管理页面

image-20211215141900818

三、下载进度

代码如下:

image-20211215140315299

就是上面js文件中try-catch部分代码,此处简略

注意:在实现下载进度时,可能会遇到NAN的bug,此时是因为task.totalSize=0 ,作为分母时为零,所得到的值为非数值,此时就不能显示对应的下载进度百分比

解决办法:我这边是后台返回了apk的大小,可以参考如下

image-20211215142230878

下载进度代码转自:https://blog.csdn.net/weixin_36185028/article/details/103126680

标签:console,log,res,app,版本升级,version,plus,result,uni
来源: https://www.cnblogs.com/Plume-blogs/p/15692629.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有