解决html5中video标签无法播放mp4问题的办法
程序员文章站
2023-11-23 21:58:16
这篇文章主要给大家介绍了关于解决html5中video标签无法播放mp4问题的办法,文中介绍的非常详细,相信会对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起看看吧... 17-05-07...
前言
最近发现了一个问题,在手机录制了一个1.mp4文件,主流浏览器都能正常播放。但使用格式工厂将rmvb文件转码为2.mp4却不能播放。通过查找相关的资料终于解决了,下面分享出来供大家参考学习,下面来看看详细的介绍:
问题分析
手机录制的视频属性:
格式化工厂转码的视频属性:
首先排除代码问题,路径问题,浏览器不支持等问题。转码后的视频编码是mp4v,这是不能播放的原因,转换为avc(h264)编码即可。
查阅文档,关于video标签所支持的视频格式和编码:
- mpeg4 = 带有h.264视频编码和aac音频编码的mpeg4文件
- webm = 带有vp8视频编码和vorbis音频编码的 webm文件
- ogg = 带有theora视频编码和vorbis音频编码的ogg文件
通过上面的信息我们发现只有h264编码的mp4视频(mpeg-la公司)、vp8编码的webm格式的视频(google公司)和theora编码的ogg格式的视频(itouch开发)可以支持html5的<video>标签。
解决方法
video标签允许多个source元素,source元素可以链接不同的视频文件,浏览器将使用第一个可识别的格式,这样可用来解决浏览器兼容问题。
<video controls="controls" width="100%"> <source src="1.mp4" type="video/mp4"> <source src="1.ogg" type="video/ogg"> your browser does not support the video tag. </video>
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对的支持。
推荐阅读
-
解决html5中video标签无法播放mp4问题的办法
-
HTML5的Video标签有部分MP4无法播放的问题解析(多图)
-
录制的视频在html5网页中用video标签无法播放的问题如何解决?
-
解决html5中video标签无法播放mp4问题的办法
-
HTML5的Video标签有部分MP4无法播放的问题解析(多图)
-
解决html5中的video标签ios系统中无法播放使用的问题
-
分析H5网页中video标签中的MP4视频无法播放的缘由
-
Chrome、firefox浏览器中video标签无法播放MP4视频的问题解决
-
分享一个video标签无法播放mp4的问题以及解决方案
-
录制的视频在html5网页中用video标签无法播放的问题如何解决?