uni-app video组件在荣耀平板上点击全屏按钮无反应

uni-app video组件在荣耀平板上点击全屏按钮无反应

示例代码：

<video id="myVideo" :src="url" @error="videoErrorCallback" @fullscreenchange="qp" class="video"></video>

操作步骤：

新建项目，在组件中创建一个video标签，发布H5,点击视频全屏按钮

预期结果：

点击全屏按钮后视频全屏播放

实际结果：

点击全屏按钮后视频无变化，未全屏

bug描述：

video标签在荣耀平板上使用浏览器打开，点击全屏按钮无反应，无报错信息
平板型号：HUAWEIAGR-W09HN
使用的是video标签，uni项目发布H5

Image

项目 信息
产品分类 uniapp/H5
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 win 10
HBuilderX类型 正式
HBuilderX版本号 3.0.7
浏览器平台 手机系统浏览器
浏览器版本 Mozilla 5.0
项目创建方式 HBuilderX

更多关于uni-app video组件在荣耀平板上点击全屏按钮无反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html

8 回复

没人遇到么？还是组件的问题？

更多关于uni-app video组件在荣耀平板上点击全屏按钮无反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html


报bug谁来看看

你试一下官方demo发布成的h5是否有这个问题，另外确认一下浏览器内核及版本，如果是兼容问题建议找到兼容方式自行解决。

那个平板是离职同事的，现在已经找不到了

回复 小菜啊: 除此之外，其他设备能不能正常使用，常用的谷歌内核浏览器如果没有问题就好，如果说偏要在ie6上运行，我们也办不到。

回复 2104_DLS: 其他的没有发现，就这个型号的有问题

回复 小菜啊: 我们是无法做到兼容所有浏览器的，如果业务有强制要求兼容这种设备/浏览器，建议自行兼容。

这是荣耀平板浏览器对HTML5 video全屏功能的兼容性问题。建议尝试以下解决方案：

  1. 使用uni-app的API强制全屏：
methods: {
    qp(e) {
        if(!e.detail.fullScreen){
            const video = document.getElementById('myVideo')
            video.requestFullscreen()
        }
    }
}
  1. 检查浏览器是否禁用了全屏API，可以尝试在manifest.json中配置：
"h5": {
    "videoFullscreen": "auto"
}
  1. 如果仍无效，可考虑使用uni-app的plus.video全屏API：
const video = this.$refs.myVideo
plus.video.fullscreen(video)
  1. 最后可尝试在video标签添加playsinline和webkit-playsinline属性：
<video id="myVideo" :src="url" playsinline webkit-playsinline></video>
回到顶部