前言
日常APP开发过程中,我们经常会遇到老生常谈的问题,版本升级,当然了自己有一套版本发布器那就更好,这次uni-app官网提供了一套可以私有部署的版本迭代器,还提供云端下载,只能说国内额开源技术更进步了。
uni-app 版本升级 包含两块内容
uni-upgrade-center - App(业务版本)
uni-upgrade-center - Admin(统一管理App发布与升级)
官网:
uni-upgrade-center - App:https://ext.dcloud.net.cn/plugin?id=4542
uni-upgrade-center - Admin:https://ext.dcloud.net.cn/plugin?id=4470
目录
uni-upgrade-center - Admin 部署搭建
uni-upgrade-center - App 业务过程中使用与配置
手机模拟器或基座的测试演示与注意要点
uni-upgrade-center - Admin 部署搭建
创建基于uni-admin框架的项目
由于uni-upgrade-center - Admin 属于一款插件,且部署依赖 uni-admin基础框架,所以首先第一步创建一个基于uni-admin框架的项目,具体如图下:
引入uni-upgrade-center - Admin 插件
插件市场:https://ext.dcloud.net.cn/plugin?id=4470
可能会出现合并文件的弹窗,点击合并即可,安装插件后,安装一下第三方依赖,避免出错
关联云服务空间,命名uni-admin
上传部署
初始化数据库 db_init.json
在pages.json 添加插件内的页面路径
//此结构与uniCloud admin中的pages.json结构一致
"pages": [
// ……其他页面配置
{
"path": "uni_modules/uni-upgrade-center/pages/version/list",
"style": {
"navigationBarTitleText": "版本列表"
}
}, {
"path": "uni_modules/uni-upgrade-center/pages/version/add",
"style": {
"navigationBarTitleText": "新版发布"
}
}, {
"path": "uni_modules/uni-upgrade-center/pages/version/detail",
"style": {
"navigationBarTitleText": "版本信息查看"
}
}
]
在manifest.json -> 源码视图中添加以下配置:
"networkTimeout":{
"uploadFile":1200000 //ms, 如果不配置,上传大文件可能会超时
}
初始化当前项目uni-admin-test的数据 db_init.json和云函数,如果出现覆盖弹窗,可以点击覆盖无影响。
发布运行
首次运行,发布浏览器,需要创建管理员的账号
添加升级中心菜单
登录系统后,系统菜单下是没有升级中心菜单的,需要手动配置,有点蛋疼
点击菜单管理,在待添加选项中,勾选菜单添加
添加过程中,出现了这个弹窗,我一脸茫然,我在哪里,该去何处,于是我点击确定,刷新页面,升级中心菜单出现了,使用功能也是正常的。
可以看到升级中心的发布管理功能,职场uni-upgrade-center - Admin 插件 讲解完毕
uni-upgrade-center - App 业务项目搭建全流程
如果你已经有了自己的业务app项目,可以完全在它的基础上取安装插件,本教程只是为了更好的做测试,所以新建的项目。
项目建立好,记得要关联一下之前的服务空间
安装插件 uni-upgrade-center App https://ext.dcloud.net.cn/plugin?id=4542
上传部署
在pages.json
中添加页面路径。注:请不要设置为pages.json中第一项
"pages": [
// ……其他页面配置
{
"path": "uni_modules/uni-upgrade-center-app/pages/upgrade-popup",
"style": {
"disableScroll": true,
"app-plus": {
"backgroundColorTop": "transparent",
"background": "transparent",
"titleNView": false,
"scrollIndicator": false,
"popGesture": "none",
"animationType": "fade-in",
"animationDuration": 200
}
}
}
]
更新插件的引入与使用,页面路径:/pages/index/index
<template>
<view class="content">
<!--导航-->
<view class="pt60">
<button type="primary" @click="doClick" class="bd" :style="{borderStyle: 'solid'}">监测更新</button>
</view>
</view>
</template>
<script>
import checkUpdate from '@/uni_modules/uni-upgrade-center-app/utils/check-update'
export default {
data() {
return {
}
},
created() {
},
methods: {
doClick(){
//监测升级
checkUpdate();
},
closed(){
//uni.showTabBar();
}
}
}
</script>
<style lang="scss" scoped>
.content {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
height: auto;
overflow: auto;
/* background-image: url('@/static/images/ec43126fgy1giiqcxcu1zg20sg0hix76.gif'); */
}
</style>
到这里,uni-upgrade-center App 版本基本配置完
手机模拟器或基座的测试演示与注意要点
添加应用
在上面提到过的uni-admin-test已启动的项目中添加应用,具体如图:
打包apk
为了方便调试,采用的是云打包方案,uni-business-app,应用版本名称是1.0.0,版本号是100,在manifest.json可查看
打包后会在相应的文件夹内生成apk文件
上传apk 发行版本
选择原生App安装包
上传apk,发行,包的地址是自动在云端生成的,可以在服务空间查看到
手机或者模拟器测试
使用时需要注意,调试时,编译器默认的版本号,目前为 HBuilder, 13.4.7,而不是我们的appId,需要手动的修改一下
此时我们手机上的版本是100,而打包时设置的是101,当项目页启动时,会弹出如下下载页:
修改对应的版本号即可调正是否更新
总结
上面的流程已经基本涵盖了整个升级插件的使用,如果有遗留的可以参考官网,最终还是以官网为主,只不过这里把一些傻瓜的一些东西办了出来,就是为了以后使用时,闭坑,如果对你有用,就点个赞,分享一下吧
点击下方卡片/微信搜索,关注公众号“天宇文创意乐派”(ID:gh_cc865e4c536b)
本文使用 文章同步助手 同步