uniapp热更新组件(复制直接可用)

<template>
	<u-popup v-model="isShow" mode="center" border-radius="16" :mask-close-able="false">
		<view class="update-box">
			<view class="title">{{'发现新版本'}}</view>
			<textarea class="content" disabled :value="content"></textarea>
			<view class="cu-progress sm striped active" v-if="loading > 0">
				<view class="bg-theme" :style="[{ width: loading+'%'}]"></view>
			</view>
			<view class="foot solid-top">
				<view class="flex-sub text-gray solid-right" @click="handleCancel">{{'下次再说'}}</view>
				<view class="flex-sub text-green" @click="handleConfirm">{{'马上更新'}}</view>
			</view>
		</view>
	</u-popup>
</template>

<script>
	/**
	 * author: SSJ
	 * @description app检测升级组件
	 * @param {boolean} auto 是否自动检测更新
	 * **/
	// import {
	// 	API_BASE_URL,
	// 	SYSTEM_CONFIG
	// } from '@/common/config.js';
  // import {app_url} from '@/api/api.js'
	export default {
		props: {
			auto: {
				type: Boolean,
				default: false
			}, // 是否自动检测更新
		},
		data() {
			return {
				isShow: false,
				content: "",
				apkUrl: "",
				loading: 0,
				isLoad: false,
				downloadTask: null,
			};
		},
		methods: {
			checkAppUpdate() {
				console.log("检查更新");
        // 获取手机当前版本信息
        const _platform = uni.getSystemInfoSync().platform;
				const self = this;
				plus.runtime.getProperty(plus.runtime.appid, async function(widgetInfo) {
					console.log('本地版本信息', widgetInfo);
					// 请求版本检查接口
					// const [error, result] = await uni.request({
					// 	url: API_BASE_URL + global.apiUrls.publicUpdateAPP,
					// 	header: {
					// 		'content-type': 'application/x-www-form-urlencoded'
					// 	},
					// 	data: {
					// 		app_ident: 'user',
					// 		client: SYSTEM_CONFIG.platform === 'Android' ? 3 : 2,
					// 	},
					// 	method: 'POST',
					// });
					// console.log(error, result, 'error')
          const result = await app_url()
					if (result.code == 1) {
						const data = result.data;
						console.log('接口信息', data);
						// if (data.is_take == 1) {
							console.log("是有效的版本");
								console.log("是热更新", widgetInfo.versionCode);
								if (Number(data.version) > Number(widgetInfo.versionCode)) {
									uni.showModal({
										title: '提示',
										content: '已准备好新版本,是否重启体验新版?',
										confirmText: '重启',
										cancelText: '取消',
										showCancel: true,
										success: res => {
											if (res.confirm) {
												uni.showLoading({
													title: '更新中',
													mask: true
												});
												uni.downloadFile({
													url: data.url,
													success: (downloadResult) => {
														
														console.log(downloadResult,'sopsopsop') 
														uni.hideLoading();
														if (downloadResult.statusCode === 200) {
															plus.runtime.install(downloadResult.tempFilePath, {
																force: true
															}, function(){
																setTimeout(function() {
																	plus.runtime.restart();
																}, 1000);
															});
														}
													}
												})
											}
										}
									})
									
								}else{
									if (!self.auto) {
                    self.utils.toast('已是最新版本')
									}
								}
							
						// }
					}
				});
			},
			// 取消
			handleCancel() {
				this.downloadTask && this.downloadTask.abort();
				this.isShow = false;
			},
			// 确定
			handleConfirm() {
				if (plus.os.name.toLowerCase() === 'android') {
					console.log("是安卓系统");
					if (this.isLoad) return;
					this.isLoad = true;
					this.downloadTask = uni.downloadFile({
						url: this.apkUrl,
						success: (downloadResult) => {
							console.log('downloadResult 下载成功', downloadResult);
							if (downloadResult.statusCode == 200) {
								this.isShow = false;
								plus.runtime.install(downloadResult.tempFilePath, {
									force: true
								});
								plus.runtime.restart();
							}
						},
						fail: (err) => {
							console.log('ERROR', err);
							if (err.errMsg == 'downloadFile:fail abort') {
                self.utils.toast('取消下载')
							} else {
                self.utils.toast('下载失败')
							}
						},
						complete: () => {
							this.isLoad = false;
						}
					});
					this.downloadTask.onProgressUpdate(res => {
						this.loading = res.progress;
					});
				} else {
					console.log("是苹果系统,跳转到苹果应用商店");
					plus.runtime.openURL(this.apkUrl);
				}
			},
		},
		created() {
			// #ifdef APP-PLUS
			if (this.auto) {
				setTimeout(() => {
					this.checkAppUpdate();
				}, 2500);
			}
			// #endif
		}
	}
</script>

<style lang="scss" scoped>
	.update-box {
		width: 500rpx;
		background-color: #FFFFFF;

		.title {
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			font-size: 32rpx;
			color: #333333;
			
		}
		.content {
			width: 100%;
			height: 500rpx;
			padding: 0 32rpx 32rpx 32rpx;
			box-sizing: border-box;
		}

		.foot {
			height: 80rpx;
			display: flex;
			line-height: 80rpx;
			text-align: center;
		}
	}
</style>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值