uniapp实现app版本自动检测升级

该文章描述了一个前端实现的检查和更新APP版本的流程。通过调用后台接口获取新版本信息,比较当前版本号,如果不同则提示用户更新。在iOS设备上跳转至AppStore,Android设备则显示模态对话框供用户选择。对于Android,未在应用市场发布的版本直接下载更新,已发布版本引导用户在市场更新。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

实现思路:将打包好的apk安装包放到后台服务器,通过后台返回更新版本的版本号和当前版本号做比较,不同则提示有新版本需要更新,下载地址由后台返回。下面是前端部分的代码实现。

创建check.js文件

import api from './api.js'

function check(param = {}) {
	// 合并默认参数
	param = Object.assign({
			title: "检测到有新版本!",
			content: "请升级app到最新版本!",
			canceltext: "暂不升级",
			oktext: "立即升级",
		},
		param
	);
	plus.runtime.getProperty(plus.runtime.appid, (widgetInfo) => {
		let platform = plus.os.name.toLocaleLowerCase();
		api.request({
			url: api.getVersionList,
			method: "GET",
			success: (result) => {
				let data = result.data.length ? result.data[0] : null;
				if (widgetInfo.version === data.versionCode) {
					return;
				}

				if (result.statusCode == 200) {
					if (platform == "ios") {
						// 如果是ios,则跳转到appstore
						plus.runtime.openURL(result.data.iosUrl);
						return;
					}
					// android进行如下操作
					uni.showModal({
						title: param.title,
						content: data.versionRemark ? data.versionRemark : param.content,
						showCancel: data.force ? false : true,
						confirmText: param.oktext,
						cancelText: param.canceltext,
						success: (res) => {
							if (!res.confirm) {
								//取消升级
								// plus.runtime.quit(); 不升级退出app加上这行代码
								return
							}
							if (data.shichang === 1) {
								//去应用市场更新
								plus.runtime.openURL(data.shichangurl);
								plus.runtime.restart();
							} else {
								// 创建下载任务
								var dtask = plus.downloader.createDownload(
									data.versionUrl, {
										filename: "_downloads/",
									},
									function(d, status) {
										// 下载完成
										if (status == 200) {
											plus.runtime.install(
												d.filename, {
													force: true,
												},
												function() {
													//进行重新启动;
													plus.runtime.restart();
												},
												(e) => {
													uni.showToast({
														title: "安装升级包失败:" +
															JSON
															.stringify(
																e),
														icon: "none",
													});
												}
											);
										} else {
											this.tui.toast(
												"下载升级包失败,请手动去站点下载安装,错误码: " +
												status
											);
										}
									}
								);

								let view = new plus.nativeObj.View("maskView", {
									backgroundColor: "rgba(0,0,0,.6)",
									left: plus.screen.resolutionWidth / 2 - 45 +
										"px",
									bottom: "80px",
									width: "90px",
									height: "30px",
								});

								view.drawText(
									"开始下载", {}, {
										size: "12px",
										color: "#FFFFFF",
									}
								);

								view.show();

								dtask.addEventListener(
									"statechanged",
									(e) => {
										if (e && e.downloadedSize > 0) {
											let jindu = (
												(e.downloadedSize / e
													.totalSize) *
												100
											).toFixed(2);
											view.reset();
											view.drawText(
												"下载进度:" + jindu + "%", {}, {
													size: "12px",
													color: "#FFFFFF",
												}
											);
										}
									},
									false
								);
								dtask.start();
							}
						},
					});
				}
			},
		});
	});
}

export default {
	check,
};

在app的主页面调用检测更新

import checkappupdate from '@/utils/check.js';

onLoad(){
    checkappupdate.check({
        title: '检测到有新版本!',
		content: '请升级app到最新版本!',
		canceltext: '暂不升级',
		oktext: '立即升级'
    })
}
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值