uniapp实现整包更新和热更新

进度条提示基于uView框架，如何安装使用请查看官方文档，这里不做赘述    uView文档地址  介绍 | uView - 多平台快速开发的UI框架 - uni-app UI框架 (uviewui.com)

在App.vue中的onLaunch或者onShow里写方法获取服务器版本数据

<script lang="ts">
	import {
		baseURL
	} from '../services/request'
	import Vue from 'vue';
	export default Vue.extend({
		mpType: 'app',
		onLaunch() {
	

		},
		onShow() {
			//	#ifdef APP-PLUS
			// 获取本地应用资源版本号  
			plus.runtime.getProperty(plus.runtime.appid, (inf) => {
				uni.setStorageSync('versionInfo', inf)

				uni.request({
					url: baseURL + '/edition_manage/get_edition', //后台接口地址
					data: {
						edition_type: plus.runtime.appid, //应用的appid
						version_type: uni.getSystemInfoSync().platform, // android还是ios    
					},
					success: (res: any) => {

					 if (res.data.payload.edition_number > inf.versionCode &&res.data.payload.edition_issue === "1") {
						uni.reLaunch({
							url: '../update/update?obj=' + JSON.stringify(res.data.payload)
						    })

						}
					}

				})

			});

			//	#endif
		},
		onHide() {

		},

		globalData: {
			

		},

	});
</script>

　　

res.data.payload.edition_number是服务器的版本号 例如111
inf.versionCode是 manifest基础配置里的应用版本号，整数那个 例如111，
res.data.payload.edition_issue 代表是否提示更新，如果在提交ios应用审核期间，千万不要提示更新

　　

更新页update.vue 如下

<template>
	<view class="">
		<u-modal v-model="show1" confirm-text="升级" :show-cancel-button="cancelButton" :title='title'
			@confirm="confirm(1)">
			<view class="u-update-content">
				<rich-text :nodes="data.describe"></rich-text>
			</view>
		</u-modal>
		<u-modal v-model="show2" @confirm="confirm(2)" title="升级APP" ref="uModal" :show-confirm-button="false">
			<view class="tec fs24 mtb40">
				正在为您更新，请耐心等待
			</view>
			<view class="plr32 mb40">
				<u-line-progress :striped="true" :percent="percent" :striped-active="true"></u-line-progress>
			</view>

		</u-modal>
	</view>


</template>

<script>
	const app = getApp()
	export default {
		data() {
			return {
				title: '发现新版本',
				percent: 0,
				show1: true,
				show2: false,
				content: '',
				cancelButton: false,
				data: {
					application_name: "", 
					describe: "",
					edition_name: "",
					edition_number: "",
					edition_type: "",
					edition_url: "",//下载地址
					edition_force: "",
					id: "",
					package_type: "",
					version_type: "",
				}
			}
		},
		onLoad(options) {
			this.data = JSON.parse(options.obj)
			if (this.data.edition_force === "0") { //是否强制更新
				this.cancelButton = true
			}

		},
		methods: {
			download() {
				const downloadTask = uni.downloadFile({
					url: this.data.edition_url,
					success: (res) => {
						if (res.statusCode === 200) {
							plus.runtime.install(res.tempFilePath, {
								force: true, //true表示强制安装，不进行版本号的校验；false则需要版本号校验，
							}, function() {
								// console.log('install success...');
								plus.runtime.restart();
							}, function(e) {
								console.log(e);
								console.error('install fail...');
							});
						}
					}
				});
				downloadTask.onProgressUpdate((res) => {
					this.percent = res.progress

				});
			},
			cancel() {
				uni.navigateBack({
					delta: 1
				})
			},
			confirm(num) {
				if (num == 1) {
					this.show1 = false
					if (this.data.package_type === '0') { //整包升级
						if (this.data.edition_url.indexOf(".apk") != -1) {
							this.show2 = true
							this.download();
						} else {
							plus.runtime.openURL(this.data.edition_url);
						}

					} else { //资源包升级
						this.show2 = true
						this.download();
					}

				} else {
					this.show2 = false
				}
			},
		}
	}
</script>

<style scoped lang="scss">
	.u-full-content {
		background-color: #00C777;
	}

	.u-update-content {
		font-size: 26rpx;
		color: $u-content-color;
		line-height: 1.7;
		padding: 30rpx;
	}

	.plr32 {
		padding: 0 32rpx;
	}

	.mb40 {
		margin-bottom: 40rpx;
	}
</style>

　　在pages.json配置

{
			"path": "pages/update/update",
			"style": {
				"navigationStyle": "custom", // 取消本页面的导航栏
				"app-plus": {
					"animationType": "fade-in", // 设置fade-in淡入动画，为最合理的动画类型
					"background": "transparent", // 背景透明
					"backgroundColor": "rgba(0,0,0,0)", // 背景透明
					"popGesture": "none" // 关闭IOS屏幕左边滑动关闭当前页面的功能
				}
			}

		},