如何处理 H5 video标签 在UC，miui浏览器上的兼容问题（弹出了内置播放器）？
0
悬赏园豆：100
[待解决问题]
正常情况下视频的播放为一下样式。
而在UC，miui浏览器上的播放视频的时候，会弹出其内置播放器。变成下面这样
MIUI：
UC：
非常离谱。。
而B站的视频，在这两个浏览器上是正常播放的，看了下他的video标签，放上去依然是这个效果，有大佬能帮忙解决下吗，球球了
所有回答(3)
0
我记得b站用的自己的h5播放器
0
解决了么？
0
H5 video标签在不同浏览器和操作系统中可能会存在兼容性问题，尤其是一些国产浏览器和定制系统。对于UC、MIUI浏览器等存在内置播放器的浏览器，可以通过以下方式进行处理：
- 添加playsinline属性
在video标签中添加playsinline属性，可以禁用iOS Safari中的全屏播放，同时也可以在UC、MIUI浏览器中播放原生video标签，避免出现内置播放器。代码示例：
<video src="example.mp4" playsinline>
- 添加x-webkit-airplay="allow"属性
在video标签中添加x-webkit-airplay="allow"属性，可以允许iOS Safari在AirPlay传输视频时，把视频源直接传输给Apple TV，避免弹出本地内置播放器。代码示例：
<video src="example.mp4" x-webkit-airplay="allow">
- 使用js插件播放视频
在UC、MIUI浏览器中，可以通过使用第三方的JavaScript插件播放视频，如Video.js、HLS.js等。这些js插件可以通过一些技术手段，来绕过浏览器本身的限制，实现流畅的视频播放体验。需要注意的是，使用js插件播放视频也可能会出现一些兼容性问题，需要进行充分测试和验证。
以上是一些可能的解决方法，实际应用中需要根据具体的情况进行选择和调整。同时，为了确保最佳的兼容性和体验，建议在开发过程中尽可能使用标准的HTML5视频标签，同时注意测试和验证在不同浏览器和操作系统环境下的兼容性。
以下是一个添加playsinline属性的代码示例：
<video src="example.mp4" playsinline>
以下是一个添加x-webkit-airplay="allow"属性的代码示例：
<video src="example.mp4" x-webkit-airplay="allow">
以下是一个使用Video.js插件播放视频的代码示例：
<!doctype html>
<html>
<head>
<link href="//vjs.zencdn.net/6.6.3/video-js.css" rel="stylesheet">
<script src="//vjs.zencdn.net/6.6.3/video.js"></script>
</head>
<body>
<video id="my_video" class="video-js" controls preload="auto" width="640" height="264"
poster="//vjs.zencdn.net/v/oceans.png" data-setup="{}">
<source src="example.mp4" type='video/mp4'>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
<a href="//videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>
</video>
</body>
</html>
需要注意的是，以上代码只是一个简单的示例，实际的代码需要根据具体的问题和需求进行编写和修改，同时需要进行充分的测试和验证，以确保在不同浏览器和操作系统下有良好的兼容性和体验。
