首页
留言
导航
统计
Search
1
追番推荐!免费看动漫的网站 - 支持在线观看和磁力下载
1,260 阅读
2
推荐31个docker应用,每一个都很实用
719 阅读
3
PVE自动启动 虚拟机 | 容器 顺序设置及参数说明
709 阅读
4
一条命令,永久激活!Office 2024!
519 阅读
5
优选 Cloudflare 官方 / 中转 IP
377 阅读
默认分类
服务器
宝塔
VPS
Docker
OpenWRT
Nginx
群晖
前端编程
Vue
React
Angular
NodeJS
uni-app
后端编程
Java
Python
SpringBoot
SpringCloud
流程引擎
检索引擎
Linux
CentOS
Ubuntu
Debian
数据库
Redis
MySQL
Oracle
虚拟机
VMware
VirtualBox
PVE
Hyper-V
计算机
网络技术
网站源码
主题模板
登录
Search
标签搜索
Java
小程序
Redis
SpringBoot
docker
Typecho
Cloudflare
虚拟机
WordPress
群晖
uni-app
CentOS
docker部署
Vue
Java类库
Linux命令
防火墙配置
Mysql
脚本
Nginx
微醺
累计撰写
259
篇文章
累计收到
8
条评论
首页
栏目
默认分类
服务器
宝塔
VPS
Docker
OpenWRT
Nginx
群晖
前端编程
Vue
React
Angular
NodeJS
uni-app
后端编程
Java
Python
SpringBoot
SpringCloud
流程引擎
检索引擎
Linux
CentOS
Ubuntu
Debian
数据库
Redis
MySQL
Oracle
虚拟机
VMware
VirtualBox
PVE
Hyper-V
计算机
网络技术
网站源码
主题模板
页面
留言
导航
统计
搜索到
8
篇与
的结果
2024-07-31
还学鸿蒙原生?vue3 + uniapp 可以直接开发鸿蒙啦!
前言7月20号,uniapp 官网 “悄咪咪” 的上线了 uniapp 开发鸿蒙应用 的文档,算是正式开启了 Vue3 + uniapp 开发鸿蒙应用 的时代。开发鸿蒙的前置准备想要使用 uniapp 开发鸿蒙,我们需要具备三个条件:DevEco-Studio 5.0.3.400 以上(下载地址:https://developer.huawei.com/consumer/cn/deveco-studio/)鸿蒙系统版本 API 12 以上 (DevEco-Studio有内置鸿蒙模拟器)HBuilderX-alpha-4.22 以上PS: 这里不得不吐槽一下,一个 DevEco-Studio 竟然有 10 个 G......[安装好之后,我们就可以通过 开发工具 运行 示例代码]运行时,需要用到 鸿蒙真机或者模拟器。但是这里需要 注意: Windows系统需要经过特殊配置才可以启动,mac 系统最好保证系统版本在 mac os 12 以上windows 系统配置方式(非 windows 用户可跳过): 打开控制面板 - 程序与功能 - 开启以下功能Hyper-VWindows 虚拟机监控程序平台虚拟机平台注意: 需要win10专业版或win11专业版才能开启以上功能,家庭版需先升级成专业版或企业版启动鸿蒙模拟器整个过程分为三步(中间会涉及到鸿蒙开发者申请):下载 uni-app 鸿蒙离线SDK template-1.3.4.tgz (下载地址:https://web-ext-storage.dcloud.net.cn/uni-app/harmony/zip/template-1.3.4.tgz)解压刚下载的压缩包,将解压后的模板工程在 DevEco-Studio 中打开等待 Sync 结束,再 启动鸿蒙模拟器 或 连接鸿蒙真机(如无权限,则需要申请(一般 3 个工作日),申请地址:https://developer.huawei.com/consumer/cn/activity/201714466699051861/signup)配置 HBuilderX 吊起 DevEco-Studio打开HBuilderX,点击上方菜单 - 工具 - 设置,在出现的弹窗右侧窗体新增如下配置[注意:值填你自己的 DevEco-Studio 启动路径]"harmony.devTools.path" : "/Applications/DevEco-Studio.app"创建 uni-app 工程BuilderX 新建一个空白的 uniapp 项目,选vue3在 manifest.json 文件中配置鸿蒙离线SDK路径(SDK 路径可在 DevEco-Studio -> Preferences(设置) z中获取)编辑 manifest.json 文件,新增如下配置:然后点击 运行到鸿蒙即可最后这样我们就有了一个初始的鸿蒙项目,并且可以在鸿蒙模拟器上运行。关于更多 uniapp 开发鸿蒙的 API,大家可以直接参考 uniapp 官方文档:https://zh.uniapp.dcloud.io/tutorial/harmony/dev.html#nativeapi
2024年07月31日
23 阅读
0 评论
0 点赞
2023-06-25
最新版云喵圈子兴趣社区交友小程序源码全开源版本
云喵圈子小程序系统 定位为移动端兴趣社区圈子系统,功能分为四大模块,分别为圈子、话题、帖子、商城,基于四大板块衍生出其他功能模块,前后端源码完全开源,完美支持二次开发,可学习可商用兴趣社区圈子论坛程序,后台服务端基于thinkphp6开发,是一套兴趣社区论坛+电商的系统1、php版本 >=8.02、uniapp端下载后在根目录:utils/config.js中配置站点域名,运行到小程序源码地址隐藏内容,请前往内页查看详情
2023年06月25日
18 阅读
0 评论
0 点赞
2023-06-25
全开源的基础商城销售功能的RF微商城多端源码
RF微商城多端源码 全开源的基础商城销售功能的开源微商城。前端基于 uni-app ,一端发布多端通用。目前已经适配 H5、微信小程序、QQ小程序、Ios App、Android App 源码地址隐藏内容,请前往内页查看详情
2023年06月25日
16 阅读
0 评论
0 点赞
2023-02-15
uniapp webview 直接调用原生摄像头拍照 拍视频
uniapp webview 直接调用原生摄像头拍照 拍视频 img video,通过ajax获取blob(file为特殊的blob)对象并上传到后端服务器web-view中通过plus方法调用摄像头拍照或者拍视频并上传后端的操作步骤如下:plus.camera.getCamera()获取摄像头对象 cmrcmr.captureImage(callback)\ cmr.startVideoCapture(callback)获得临时资源的临时路径 pathplus.io.resolveLocalFileSystemURL(‘路径path’,callback) 通过临时路径获得文件对象 entryentry.toRemoteURL() 获得网络路径通过ajax,设置responseType为blob,获取文件的blob对象,根据后端接口要求进行处理并上传例子中的后端接口要求表单数据formData的形式上传附上htm5文档地址http://www.html5plus.org/doc/zh_cn/io.html#plus.io.DirectoryEntry.toRemoteURL 以图片为例,代码如下,let cmr = plus.camera.getCamera() //获取相机对象 cmr.captureImage( //调用拍照方法,获得临时路径 function (p) { plus.io.resolveLocalFileSystemURL(p, function (entry) { //通过临时路径,获得文件系统中的文件对象entry entry.file(function (file) { // 可通过entry对象的file方法,获取文件数据对象(该文件数据对象仍无法直接使用) axios({ method: 'get', url: entry.toRemoteURL(), responseType: 'blob', }).then(res => { let blob = res.data const uploadFile = new FormData() uploadFile.append('file', blob ) axios({ method: 'post', url: '/file/api/Upload', headers: { 'Content-Type': 'multipart/form-data'}, data: uploadFile, }) }) file.close() }) }) }, function (error) { console.log('---' + 'Capture image failed: ' + error.message) }, )视频相同,将 captureImage 换成 startVideoCapture 即可
2023年02月15日
22 阅读
0 评论
0 点赞
2023-02-15
用uni-app开发自定义微信小程序头部导航
uni-app 官网:uni-app 官网微信小程序开发文档:微信开放文档官方介绍 uni-app:uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可编译到 iOS、Android、H5、以及各种小程序等多个平台。即使不跨端,uni-app同时也是更好的小程序开发框架。个人感受(功能很丰富,bug 也很丰富)*接下来我会将在项目中用到的一些我感觉还不错的东西记录一下,以供分享以及自己的积累=。=如有不足,请大佬们指教!!1.环境介绍编译器就用官方的 HBuilderX 编译器, 然后好像没了,创建一个 uni-app 项目就可以开始撸了。2.首先要先去除小程序自带的头部导航,在 page.json 文件里的对应的页面的 style 配置项里加上:"style":{ "navigationStyle":"custom" }就可以开始自定义导航了。3.为了适配不同型号手机的头部高度,所以要通过(异步)uni.getSystemInfo()或者(同步)uni.getSystemInfoSync()获取顶部状态栏的高度得到的状态栏高度可以存 vuex 里。(增加,获取头部高度,定义在全局)/*main.js*/ import Vue from 'vue' import App from './App' import store from './store' Vue.prototype.$store = store Vue.config.productionTip = false Vue.prototype.isBarHeight999 = function() { return new Promise((resolve, reject) => { var that = this var isTemp = {} uni.getSystemInfo({ success(res) { let totalTopHeight = 68 if (res.model.indexOf('iPhone X') !== -1) { totalTopHeight = 88 } else if (res.model.indexOf('iPhone') !== -1) { totalTopHeight = 64 } isTemp['statusBarHeight'] = res.statusBarHeight isTemp['titleBarHeight'] = totalTopHeight - res.statusBarHeight isTemp['allHeight'] = totalTopHeight resolve(isTemp) }, fail(e) { reject(e) } }) }) } App.mpType = 'app' const app = new Vue({ store, ...App }) app.$mount()4.在 components 文件里创建头部导航组件,名字自己起,我这边是 navTop.vue,直接上代码:/*navTop.vue*/<template> <view> <view class="nav_top" :style="{height:barHeight.allHeight+'px','background-color':hasBgc}"> <view class="status-bar" :style="{height:barHeight.statusBarHeight+'px'}"></view> <view class="topContent"> <view v-if="isBack" class="goBack" @click="goBack(backUrl)" hover-class="bgBlack999"> <image :src="'../static/icon_back_'+backColor+'.png'" mode=""></image> </view> <view class="title" :style="{color:color}">{{title}}</view> </view> </view> <view v-if="isHeight" class="marginBox" :style="{height:barHeight.allHeight+'px'}"></view> </view> </template> <script> import {mapState} from 'vuex' export default { props:{ title:{ type:String, default:'XXX' }, hasBgc:{ //背景色 type:String, default:'#5FCBAD' }, color:{ //字体颜色 type:String, default:'#fff;' }, isBack:{ //是否有返回箭头 type: Boolean, default:false }, backColor:{ //回退箭头颜色 type:String, default:'white' }, isHeight:{ //头部撑开高度 type:Boolean, default:true }, isNavBack:{ //固定返回前面的页面 type:Boolean, default:true }, backUrl:{ //返回到那个页面 type:String, default:'index' }, backNum:{ //返回几个页面 type:Number, default:1 } }, computed:{ ...mapState(['barHeight']) }, data() { return { }; }, methods:{ goBack(url){ if(this.isNavBack){ const that = this uni.navigateBack({ delta:that.backNum }) }else{ var isUrl = `/pages/${url}/${url}` console.log(isUrl) uni.switchTab({ url: isUrl }) } } }, created() { if(!this.barHeight.allHeight||!this.barHeight.statusBarHeight){ this.isBarHeight999().then((isTemp)=>{ this.$store.state.barHeight = isTemp }) } } } </script> <style lang="scss"> .nav_top{ width: 100vw; position: fixed; top: 0; left: 0; z-index: 900; display: flex; flex-direction: column; background-color: transparent; &.bgColor{ background-color: #5FCBAD; } .topContent{ width: 100vw; height: 100upx; position: relative; .goBack{ position: absolute; top: 0; left: 0; width: 10vw; height: 100upx; display: flex; align-items: center; padding-left: 20upx; box-sizing: border-box; image{ width: 40upx; height: 42upx; } } .title{ text-align: center; width: 100%; height: 100%; line-height: 100upx; font-size: 40upx; font-family:'自定义字体'; } } } </style>使用:/*test.vue*/<template> <view> <navTop :title="navtop.title" :isHeight="false" hasBgc="red" :color="navtop.color" :isBack="true"></navTop> </view> </template> <script> import navTop from '../../components/navTop.vue' export default { components: { navTop }, data() { return { navtop: { title: 'XXX', color: '#024230' } }; } } </script>效果图如下:已适配大部分机型,具体尺寸可以根据需求自行调整。。(还有不足之处,慢慢完善吧 o(∩_∩)o 哈哈)
2023年02月15日
41 阅读
0 评论
0 点赞
2023-02-15
uni-app人脸识别功能
在听到人脸识别,连忙去看看,去阿里 腾讯 看他们的人脸识别方法,官方sdk什么的。到后来,需求确定了,拍照(照片)上传,后台去识别是不是本人,这一瞬间从天堂到地狱,放着官方那么好的方法,不要。用照片,还的自己去写,去实现。下面为大家提供一个 uni-app 自动拍照 上传照片 后端做匹配处理。参考插件市场的 https://ext.dcloud.net.cn/plugin?id=4892在使用前 先去manifest.json 选择APP模块配置, 勾选直播推流 直接采用nvue开发,直接使用live-pusher组件进行直播推流,如果是vue开发,则需要使用h5+的plus.video.LivePusher对象来获取 nuve js注意事项 注意nuve 页面 main.js 的封装函数 。无法直接调用(小程序其他的端没有测试)在APP端 this.api报错,显示是undefined,难道nvue页面,要重新引入api文件在APP端,main.js中挂载Vuex在nvue页面无法使用this.$store.state.xxx简单粗暴点直接用uni.getStorageSync 重新获取一遍//获取用户数据 userInfo在Data里定义 this.userInfo = uni.getStorageSync('userInfo')nuve css注意事项 单位只支持px其他的em,rem,pt,%,upx 都不支持需要重新引入外部css不支持使用 import 的方式引入外部 css<style src="@/common/test.css"></style>默认flex布局display: flex; //不需要写 //直接用下面的标签 flex-direction: column; align-items: center; justify-content: space-between;页面样式<view class="live-camera" :style="{ width: windowWidth, height: windowHeight }"> <view class="title"> {{second}}秒之后开始识别 </view> <view class="preview" :style="{ width: windowWidth, height: windowHeight-80 }"> <live-pusher id="livePusher" ref="livePusher" class="livePusher" mode="FHD" beauty="1" whiteness="0" aspect="2:3" min-bitrate="1000" audio-quality="16KHz" :auto-focus="true" :muted="true" :enable-camera="true" :enable-mic="false" :zoom="false" @statechange="statechange" :style="{ width: cameraWidth, height: cameraHeight }"></live-pusher> <!--提示语--> <cover-view class="remind"> <text class="remind-text" style="">{{ message }}</text> </cover-view> <!--辅助线--> <cover-view class="outline-box" :style="{ width: windowWidth, height: windowHeight-80 }"> <cover-image class="outline-img" src="../../static/idphotoskin.png"></cover-image> </cover-view> </view> </view>JS部分<script> import operate from '../../common/operate.js' import api from '../../common/api.js' export default { data() { return { //提示 message: '', //相机画面宽度 cameraWidth: '', //相机画面宽度 cameraHeight: '', //屏幕可用宽度 windowWidth: '', //屏幕可用高度 windowHeight: '', //流视频对象 livePusher: null, //照片 snapshotsrc: null, //倒计时 second: 0, ifPhoto: false, // 用户信息 userInfo: [] }; }, onLoad() { //获取屏幕高度 this.initCamera(); //获取用户数据 this.userInfo = uni.getStorageSync('userInfo') setTimeout(() => { //倒计时 this.getCount() }, 500) }, onReady() { // console.log('初始化 直播组件'); this.livePusher = uni.createLivePusherContext('livePusher', this); }, onShow() { //开启预览并设置摄像头 this.startPreview(); }, methods: { //获取屏幕高度 initCamera() { let that = this uni.getSystemInfo({ success: function(res) { that.windowWidth = res.windowWidth; that.windowHeight = res.windowHeight; that.cameraWidth = res.windowWidth; that.cameraHeight = res.windowWidth * 1.5; } }); }, //启动相机 startPreview() { this.livePusher.startPreview({ success(res) { console.log('启动相机', res) } }); }, //停止相机 stopPreview() { let that = this this.livePusher.stopPreview({ success(res) { console.log('停止相机', res) } }); }, //摄像头 状态 statechange(e) { console.log('摄像头', e); if (this.ifPhoto == true) { //拍照 this.snapshot() } }, //抓拍 snapshot() { let that = this this.livePusher.snapshot({ success(res) { that.snapshotsrc = res.message.tempImagePath; that.uploadingImg(res.message.tempImagePath) } }); }, // 倒计时 getCount() { this.second = 5 let timer = setInterval(() => { this.second--; if (this.second < 1) { clearInterval(timer); this.second = 0 this.ifPhoto = true this.statechange() } }, 1000) }, // 图片上传 uploadingImg(e) { let url = e // console.log(url); let that = this uni.uploadFile({ url: operate.api + 'api/common/upload', filePath: url, name: 'file', formData: { token: that.userInfo.token }, success(res) { // console.log(res); let list = JSON.parse(res.data) // console.log(list); that.request(list.data.fullurl) } }) }, //验证请求 request(url) { let data = { token: this.userInfo.token, photo: url } api.renzheng(data).then((res) => { // console.log(res); operate.toast({ title: res.data.msg }) if (res.data.code == 1) { setTimeout(() => { operate.redirectTo('/pages/details/details') }, 500) } if (res.data.code == 0) { setTimeout(() => { this.anew(res.data.msg) }, 500) } }) }, // 认证失败,重新认证 anew(msg) { let that = this uni.showModal({ content: msg, confirmText: '重新审核', success(res) { if (res.confirm) { // console.log('用户点击确定'); that.getCount() } else if (res.cancel) { // console.log('用户点击取消'); uni.navigateBack({ delta: 1 }) } } }) }, } }; </script>css 样式<style lang="scss"> // 标题 .title { font-size: 35rpx; align-items: center; justify-content: center; } .live-camera { .preview { justify-content: center; align-items: center; .outline-box { position: absolute; top: 0; left: 0; bottom: 0; z-index: 99; align-items: center; justify-content: center; .outline-img { width: 750rpx; height: 1125rpx; } } .remind { position: absolute; top: 880rpx; width: 750rpx; z-index: 100; align-items: center; justify-content: center; .remind-text { color: #dddddd; font-weight: bold; } } } } </style>
2023年02月15日
46 阅读
0 评论
0 点赞
2023-02-14
uni-app云打包成ipa文件安装到iPhone上全过程记录
今天记录一下关于uniapp开发出来的项目怎么进行云打包,到本地手机上,这篇文章将从注册苹果开发者开始记录,一直到安装到 iPhone 手机上整个完整的过程,之所以写这篇文章第一是我自己需要记录一下,第二是很多博主也有写,但是都是片段,我也早就想写了,但是之前的例子没有截图,所以借助这次又写类似项目的机会,记录一下,我希望您在我这可以直接解决关于云打包中遇到的大部分问题。ok 废话不多说,开整,篇幅较长,我尽量分段加导航的模式进行! 本文主要是记录 ios 的打包过程,安卓的不写原因是他没有那么多的要求,放张图说明一下:我们就下面的四个红框的文件怎么来的分别进行讲解。(获取的地方我都进行加粗标记了,看的时候可以注意一下)不喜欢看我的可以看官方的官方地址 我们今天就是搞定上面需要的四个文件。需要的准备工作一个苹果的开发者账号 申请流程APP 的一系列大小的 logo (配置 manifest.json)登录到开发者平台(使用注册的开发者账号)进行证书、设备、开发人员的配置Hbuilder 开发工具进行云打包一台 MAC 笔记本,需要用到 mac 自带的钥匙串功能进行证书的申请APP 图标配置找到项目中的 manifest.json 文件,打开以后将本地的图标配置好就 ok,此步骤在 hbuilder 中操作 下面的步骤都是在您申请开发者账号以后需要做的事情。证书、设备、开发人员的配置登录到开发者平台进行配置开发者平台 添加开发者如果需要别的开发人员进行开发这个项目,可以直接打开 People,进行添加开发者,需要注意的是这一步只有注册者可以打开,也就是被拉进去的开发者是没有权限拉别人的。下面说一下具体拉人的步骤: 然后就到邀请成功,被邀请的开发者会收到一封邮件,点击同意就可以了 配置 App ID App 的唯一标识打开登录以后的开发者中心,点击下面的 Certificates 点击 ➕ 选择注册 选择 App 这里的配置名字的时候建议是域名反过来,加上你的描述,保证唯一就可以 不要选择太多,每一个的审核不一样,太多到时候审核失败了,不好搞! 下一步就是点击确认注册 至此 AppID 就创建结束了,也就意味着我们云打包的截图上面的第一个红框(BundleID(AppID))内容有了。生成证书请求文件这里需要 mac 笔记本自带的钥匙串功能,我们打开钥匙串,可以 command+空格,输入钥匙串 我这里没办法截图了,尴尬, 点击钥匙串访问-证书管理-从证书颁发机构请求证书 至此先放着,我们接着注册申请开发证书和描述文件这个东西申请下来以后就可以将 APP 安装到我们的 iPhone 上,进行测试,但是这个需要注意的一个点是,一个描述文件最多可以绑定 100 台测试手机 此时 cer 文件双击可以打开这个证书,会直接打开钥匙串,这个 cer 文件是为了后面导出 p12 证书,也就是为第一张红框中的最后一个文件进行准备导出 p12 证书导出证书的目的就是添加到红框中最后一个选项,我们打开刚才下载的证书 我们右键进行导出 这里设置的密码就是我们云打包里面的第二个红框里面需要输入的密码(证书私钥密码) p12 文件就是红色框中的最后一个文件(私钥证书) 至此我们云打包需要的四个地方已经搞定了三个,就剩第三个红框中的内容了,我们接着看申请开发 描述文件这个文件是云打包中的第三个红框需要的文件,这个文件可以确定哪些设备可以进行安装 beta 版本的 APP,也就是没有发布之前可以在哪些手机上进行安装。 在生成描述文件之前要先添加设备信息添加设备 UDID 获取 UDID这个方式很多,最快的方式就是直接使用 mac 自带的 itunes 程序连接手机 这里很多人看到的是序列号,没事,点击序列号会变,变到 UDID 的时候右键进行拷贝就好了。 这样就获取到 udid,然后按照上面的步骤继续,最后保存就好了。至此设备就添加结束了。生成描述文件 下一步就是点击下载到本地,至此云打包中的第三个红色框(证书 profile 文件)的文件也准备完毕,现在就可以打包了。打包结束安装到本地 至此 ipa 文件就生成了,但是他和安卓不同的是 iPhone 不支持直接点击安装,这个时候我们需要下载一个爱思助手进行帮助我们安装本地的 ipa 文件,爱思助手下载地址 下载好以后连接上手机 如果是 windows 电脑也是可以安装的,只是没办法打包,如果给你一个 ipa 文件,你需要的是下载一个爱思助手 windows 版本的,然后安装 itunes,windows 版本的,连接上你的 iPhone 手机,下面的操作都一样了,我们接着看,打开以后添加本地文件,或者将 ipa 文件直接拖进去也可以,如图: 然后就等待安装结束,提示成功以后手机上就可以正常使用了。常见问题安装失败安装失败很大一个原因是没有配置 UDID,配置以后没有重新成功描述文件,也就是云打包中的第三个红框中文件没有更换就打包了。手机连接不上数据线是不是有问题是不是没有解锁是不是没有点击信任是不是 type-c 或者 usb 口坏掉了博客转载与 uni-app云打包成ipa文件安装到iPhone上全过程记录
2023年02月14日
71 阅读
1 评论
0 点赞
2023-02-11
uni-app中的版本更新
主要是拿本地的版本号和后端返回的版本号做对比(在每次修改完代码以后,要打个更新包或者整包给后端喔) <template> <view> <sxPopup ref="appUpdate" @closeMaks="closeMaks"> <view class="update-main"> <image src="/static/images/update_close.png" class="update-close" @tap="hide"></image> <view class="update-content"> 最新安装包已准备就绪恭请主人体验尝 </view> <view class="update-btn btn-solid" @tap="updateApp"> 立即体验 </view> </view> </sxPopup> </view> </template> 在data中定义 version:"", // 当前版本 serverVersion:"", // 服务器版本 clientType:'', // 客户端类型 updateInfo:{}, // 更新信息 curDownSize:0, // 当前下载大小 在props中 autoChangeUpdate:{ // 是否自动检测更新 type:Boolean, default:false } mounted() { _this = this; this.changeUpdate() }, 在methods中 show(){ //显示更新弹窗 this.$refs.appUpdate.open() }, hide(){ //隐藏更新弹窗 uni.showTabBar(); this.$refs.appUpdate.close() }, changeUpdate(){ // 检测更新 //如果父组件选择自动更新 if(this.autoChangeUpdate){ this.getServerVersion() } }, isUpdate(curVersion,serVersion){ // 判断是否需要更新 let [serArray,curArray] = [serVersion.split("."),curVersion.split(".")] if(parseInt(serArray[0]) > parseInt(curArray[0])){ return true }else if(parseInt(serArray[1]) > parseInt(curArray[1])){ return true }else if(parseInt(serArray[1]) >= parseInt(curArray[1]) && parseInt(serArray[2]) > parseInt(curArray[2])){ return true }else{ return false } }, computedVersion(version){ // 计算版本 let array = version.split("."); let sum = 0; sum += array[0]*10 sum += array[1]+array[2] return sum; }, getServerVersion(){ // 获取服务器版本 if(!this.autoChangeUpdate){ uni.showLoading({ title:"检测更新" }) } this.$ajax("index/apiUpdateVersion",{}).then(res=>{ uni.hideLoading() if(res.code == 200){ this.updateInfo = res.data plus.runtime.getProperty(plus.runtime.appid, function(wgtinfo) { // 获取当前app版本 _this.version = wgtinfo.version; console.log(uni.getSystemInfoSync().platform) // 判断手机类型 switch (uni.getSystemInfoSync().platform) { case 'android': if (_this.isUpdate(_this.version,res.data.android_version)) { _this.serverVersion = res.data.android_version; _this.clientType = 'android' _this.show() uni.hideTabBar(); }else{ if(!_this.autoChangeUpdate){ _this.$toast("当前已是最新版本") } } break; case 'ios': if (_this.isUpdate(_this.version,res.data.ios_version)) { _this.serverVersion = res.data.ios_version; _this.clientType = 'ios' _this.show() uni.hideTabBar(); }else{ if(!_this.autoChangeUpdate){ _this.$toast("当前已是最新版本") } } break; } // _this.$emit('isUpdata',false) }); }else{ this.$toast(res.data.msg) } }) }, updateApp(){ // 更新app let version = this.version.split('.'); let updateVersion = this.serverVersion.split('.'); this.hide() // 大更新 if (parseInt(updateVersion[0]) > parseInt(version[0])) { if(_this.clientType == 'android'){ console.log(_this.clientType) console.log(this.updateInfo.android_url) this.downApp(this.updateInfo.android_url,'bigUpdate'); }else{ plus.runtime.openURL(this.updateInfo.ios_url) } } else if (parseInt(updateVersion.join('.').replace(/\./g, '')) > parseInt(version.join('.').replace(/\./g, ''))) { //小更新 // 热更新 this.downApp(this.updateInfo.hot_update,'thermalRenewal'); } }, downApp(url,updateType){ // 文件大小 let fileSize = ''; if(updateType == 'bigUpdate'){ fileSize = this.updateInfo.android_url_file_size; }else{ fileSize = this.updateInfo.hot_update_file_size; } fileSize = parseFloat(fileSize) * 1024 * 1024 console.log(fileSize) let waiting = plus.nativeUI.showWaiting('下载中...'); // 创建下载任务 let dtask = plus.downloader.createDownload(url,{ filename: '_doc/update/' // 文件下载保存路径 },function(d, status) { console.log(status,5555) if (status == 200) { console.log(status,'.............') waiting.setTitle('安装中...'); // 下载成功 plus.runtime.install(d.filename, {}, function() { plus.nativeUI.closeWaiting(); plus.nativeUI.alert('更新完成!', function() { uni.showTabBar(); // 清除所有下载的包 plus.downloader.clear(-1); // 热更新自动安装 if(updateType == 'thermalRenewal'){ plus.runtime.restart(); } }); }, function(e) { plus.nativeUI.closeWaiting(); plus.nativeUI.alert('安装失败[' + e.code + ']:' + e.message); }); } else { //下载失败 plus.nativeUI.alert('下载失败!'); setTimeout(()=>{ plus.nativeUI.closeWaiting(); },1000) if(updateType == 'bigUpdate'){ plus.runtime.openURL(url) //打开网页手动下载 } } }) // 监听下载状态 // dtask.addEventListener("statechanged", function(download, status) { // // console.log(`监听:下载状态${status}`) // if (status == 200) { // let i = download.downloadedSize // i *= 100 / fileSize; // console.log(`监听:下载大小${i}`) // if(!isNaN(i)){ // i = parseInt(i) // waiting.setTitle('已下载 ' + i + "%"); // // waiting.setTitle(i); // } // }else if(status == 404){ // plus.nativeUI.closeWaiting(); // plus.runtime.toast("下载地址错误") // } // }, true); dtask.start(); }
2023年02月11日
37 阅读
0 评论
0 点赞