uniapp 内嵌安卓PAD;页面问题大致汇总

背景:uniapp video内置插件和vue-video-js插件问题;
1、video元素在uniapp会被二次编译;所以在uniapp中使用vue-video-js插件,会导致video元素无法渲染,因为html结构不正确;
解决方法:暴力修改,直接修改player.vue中的video元素获取

2、运行环境是webview; 在video没打开时,有一个巨大的灰三角形,极其难看
.video_inner .uni-video-cover-play-button{
display: none;
}

.video_inner .vjs-volume-panel, .vjs-volume-panel{
display: none !important;
}
.vjs-big-play-button{
display: none !important;
}
::v-deep .vjs-big-play-button{
display: none !important;
}

video::--webkit-media-controls-play-button {
display: none !important;
-webkit-appearance: none !important;
}
*::-webkit-media-controls-panel {
display: none!important;
-webkit-appearance: none;
}

*::--webkit-media-controls-play-button {
display: none!important;
-webkit-appearance: none;
}

*::-webkit-media-controls-start-playback-button {
display: none!important;
-webkit-appearance: none;
}

3、封面问题:
1)video元素配置 poster:'图片url'
问题:问题2又出来了,干
解决:手写个img元素,src为封面,在播放开始后100ms,隐藏图片
2)封面,总不能一一截图吧?
本次项目使用的云端是七牛云,七牛云也有类似阿里云的在线视频截帧功能;
在MP4链接加参数?vframe/jpg/offset/1

4、视频问题
代码没问题,视频一直卡顿,或无法播放;本次谷歌浏览器测试无问题,一上环境就卡顿+不能播放;
webview使用的内核是腾讯x5浏览器;
原因:视频源问题,使用 url+'?avinfo'可查看七牛云视频资源的详细参数;
解决:由视频源提供者,重新调整视频格式(不是所有的mp4都是一样的),解决该问题

posted @   Math点PI  阅读(279)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)
点击右上角即可分享
微信分享提示