草庐IT

【uniapp】(使用webview)引入Dplayer.js以及hls.js用来解析播放m3u8直播流视频

1、在template中添加template> view> uni-navbarfixed="true"title="监控查阅"leftIcon="back">uni-navbar> viewclass="pd-lr-10pd-t-20"> divid="dplayer"class="wp-100h-550">div> view> view>template>在manifest.json文件源码视图中设置app-plus->kernel->ios的值为“WKWebview"或"UIWebview”:"app-plus":{ "kernel":{ "ios":"WKWeb

uniapp小程序全局分享功能Vue3

问题:在小程序的任何界面都能通过点击右上角三个点进行分享好友/朋友圈功能目录1.创建shareMixin文件夹,创建shareMixin.ts文件2.在main.ts进行挂载3.在程序任意处即可实现分享1.创建shareMixin文件夹,创建shareMixin.ts文件exportdefault{ data(){ return{ share:{ title:'程序名称', path:'/pages/xxx', imageUrl:'分享显示的图片链接', desc:'简介' } } }, //分享到微信好友功能 onShareAppMessage(res){

记录下uniapp开发结合webview调用高德地图(路线规划,多路选择,双向通信)

uniapp结合webview实现(微信和app上)简单版导航打车应用,总体实现方案是在uniapp上嵌入web网页,在web网页上调用高德地图api实现渲染地图及路线1.前置准备工作去高德开放平台注册账号并创建web应用,再生成web安全密钥和key如果需要运行到微信上则需要开通微信公众平台上应用需要的定位权限(有啥开通啥),如果需要发版不是本地运行的demo的话足以,否则还要将网站升级成https,备案,开通443端口,将这个网站网址添加到微信公众上那个业务域名里(根据提示将校验文件放在根目录下即可添加),不然线上访问不通(微信安全限制了的没办法)。2.web端开发webvue项目引入这个

uniapp websocket的使用和封装

在uniapp中socket分为两种形式,第一种适用于只有一个socket链接,第二种适用于多个socket链接。传送门这里以socketTask为列子封装在utils新建一个文件在你要使用的页面引入,我这是聊天那种,所以我在拿到用户信息之后连接socket。直接上源码我这里是找了其他人的,然后改良了一下断线重连,如果重连的次数超过你设置的次数,后面就每30秒重连一下,可以根据自己的需求改细节,大体逻辑都一样。//引入vuex,因为我需要使用vuex存储得到的数据importstorefrom"@/store/index.js"importconfigfrom'@/common/config.

前端uniapp封装网络请求详情教程

1,common文件夹下http.api.js,定义接口constinstall=(Vue,vm)=>{   //验证码登陆   letmobilelogin=(params={})=>vm.$u.http.post('api/user/mobilelogin',params);  //将各个定义的接口名称,统一放进对象挂载到vm.$u.http.api(因为vm就是this,也即this.$u.http.api)下   vm.$u.api={      mobilelogin,   };}exportdefault{   install}2,common文件夹下http.intercepto

uniapp+unicloud开发一个网页端,小程序端,APP端,桌面端的博客CMS系统——万能的三三

前言做为一个开发者,怎么能没有一个自己的博客呢?都说现在是小程序,APP时代了,显然只有网页端已经跟不上时代了,于是乎就想找一个免费的能同时支持网页端,小程序,APP的博客系统...于是花了一点点时间,没找到合适的...好吧,那既然自己是开发者,那为什么不能自己写一个博客呢?于是又花亿点点时间...介绍既然要跨端,找了一圈,想要很好的支持小程序,和APP,基本上选定了uniapp,发现官方已经写好了后端和前端的模版,直接拿来用,基本解决了项目搭建问题,于是乎,又过了亿点点时间,完成了这套基于uniapp+unicloud开发,一套代码多端部署的博客CMS系统。由于是基于uniapp开发的博客,

vue 实现 word、ppt、excel、图片、PDF、视频、音频等格式的文件下载,以及uniapp中文件包(文件流)的下载处理

方法一:a标签1、后台返回的url地址//下载constdownLoad=(url:string,name:string,type:string)=>{varxhr=newXMLHttpRequest();xhr.open('GET',url,true);xhr.responseType='arraybuffer';//返回类型blobxhr.onload=function(){if(xhr.readyState===4&&xhr.status===200){letblob=this.response;//转换一个blob链接//注:URL.createObjectURL()静态方法会创建一个

Uniapp/vue 小程序CSS翻牌动画

适合于翻牌抽奖,翻牌小游戏等场景本次案例为6张牌css样式以及图片请自己准备,需要准备两张图片,一张是翻开前一张时翻开后标签结构 JS代码data(){return{card_close_src:"",//翻牌前的图片路径awardCard:'',//中奖的卡路径cardStateArray:[],//牌状态数组}},methods:{ createState(){//初始化数组长度和状态 this.cardStateArray=Array(6)//6张牌 .fill(0).map((item,index)=>{ letobj={ state:false, } r

如何把uniapp项目的推上gitee仓库

目录材料:一个uniapp项目,一个gitee账号(没有就注册一个)1.在gitee创建一个仓库进入到下面这个页面就是创建完成了2、进入Hbuilder安装插件3、安装git4、安装TortoiseGit5、以上步骤全部弄好后,可以进入正题了,把uniapp项目推上gitee仓库1.1首先打开uniapp项目所在的路径的文件窗口1.1.1全局设置用户名1.2这时候在hbuilderx中,我们可以看到需要上传到仓库的uniapp文件已经变色了6、然后返回git仓库页面刷新,就看到上传的文件了材料:一个uniapp项目,一个gitee账号(没有就注册一个)1.在gitee创建一个仓库进入到下面这个

uniapp或微信小程序底栏固定定位在小黑条下全面屏适配解决

使用uni或者微信提供的api uniapp开发者文档 微信小程序微信开发者文档 uni使用safeAreaInsets参数微信使用safeArea参数/**获取到屏幕的安全区域全面屏的值为to顶部状态栏和bottom底部黑线安全区*/exportfunctiongetSafeAreaInsets(){ letsafeAreaInsets=0 uni.getSystemInfo({ success:function(res){ console.log(res.model); console.log(res.pixelRatio); console.log(res.windowWi