UNIAPP版本升级及WEB端扫码下载

高级API调用攻城狮

于 2023-02-27 17:31:01 发布

阅读量221

点赞数 1

分类专栏：前端文章标签： uni-app

本文链接：https://blog.csdn.net/PIOnly/article/details/129245901

版权

前端专栏收录该内容

13 篇文章 2 订阅

订阅专栏

版本升级

在首页或者是App.vue

onReady() {
    // #ifdef APP-PLUS
    this.getSysVersion();
    // #endif
},

首先获取当前系统的应用版本号

然后通过接口查询APP所有的版本信息，将当前的版本与最新的版本进行对比，如果不是最新版则提示用户是否升级


    methods: {
        // 获取系统信息
        getSysVersion() {
            let self = this;
            uni.getSystemInfo({
                success: function (res) {
                    self.systemInfo.appName = res.appName;
                    self.systemInfo.appVersion = res.appVersion;
                    self.systemInfo.appVersionCode = res.appVersionCode;
                    self._queryAppInfoByPage();
                },
            });
        },
        // 查询APP版本信息
        _queryAppInfoByPage() {
            queryAppInfoByPage(this.queryParams).then((res) => {
                if (res.code == 200) {
                    if (this.systemInfo.appVersionCode < res.rows[0].app_edition_num) {
						// 如果更新资源为apk文件则强制更新
						if(row.apk_name.includes('.apk')){
							this.$refs.globalModal.open({
								msg: `发现新版本，确认更新吗`,
								iconClass: 'iconfont iconfanhuidingbu com-color-2992ff',
								confirmButtonStyle: { background: 'linear-gradient(0deg, #2992ff, #aacaff)' },
								confirm: () => {
									let row = res.rows[0];
									let fileName = row.apk_path + '/' + row.apk_name;
									this.appdownLoad(fileName, row.apk_name);
								},
								cancel: () => {},
							});
						} else { // 如果更新文件为wgt文件则后台静默下载，待用户第二次启动APP时更新
							plus.io.resolveLocalFileSystemURL(`_downloads/${row.apk_name}`, function(entry) {
								plus.runtime.install(
								    `_downloads/${row.apk_name}`,
								    {
								        force: true,
								    },
								    function (res) {
								        plus.runtime.restart();
								    },
								    function (error) {
								        console.log(error);
								    }
								);
							}, function(error) {
								
							})
						}
                    }
                }
            });
        },
        // 执行下载app
        appdownLoad(params, name) {
            this.openLoading(true, '安装包下载中，请稍后');
            var dtask = plus.downloader.createDownload(
                `${download_url}/common/download?fileName=${encodeURI(params)}&delete=${true}`,
                {
					filename: `_downloads/${name}` // 添加文件后缀
				},
                (d, status) => {
                    if (status == 200) {
                        this.openLoading(false);
                        this.$refs.globalModal.open({
                            msg: `下载成功，是否允许安装新版本？`,
                            iconClass: 'iconfont iconfanhuidingbu com-color-2992ff',
                            confirmButtonStyle: { background: 'linear-gradient(0deg, #2992ff, #aacaff)' },
                            confirm: () => {
                                // 安装
                                plus.runtime.install(
                                    d.filename,
                                    {
                                        force: true,
                                    },
                                    function (res) {
                                        this.openLoading(true, '更新成功，重启中');
                                        plus.runtime.restart();
                                    },
                                    function (error) {
                                        console.log(error);
                                    }
                                );
                            },
                            cancel: () => {},
                        });
                    } else {
                        plus.nativeUI.alert('安装失败，请稍候重试: ' + status);
                    }
                }
            );
            dtask.start();
        },
    },

Web端扫码下载（vue）

首先安装依赖

"qrcodejs2-fix": "^0.0.1",

然后在APP版本管理页面使用

<template>
    <div class="QR-code">
        <div
            :id="'qrCode'"
            :ref="'qrCode'"
        ></div>
    </div>
</template>

<script>
import QRCode from 'qrcodejs2-fix';
export default {
    methods: {
        // 生成二维码
        createQrcode() {
            if (this.qrcode) {
                // 有新的二维码地址，先把之前的清除掉
                this.$refs['qrCode'].innerHTML = '';
            }
            this.$nextTick(() => {
                this.qrcode = new QRCode(this.$refs['qrCode'], {
                    text: this.url, // 页面地址
                    width: 200, // 二维码宽度 （不支持100%）
                    height: 200, // 二维码高度 （不支持100%）
                    correctLevel: QRCode.CorrectLevel.H,
                });
            });
        },
    },
};
</script>