html - 为什么有些 MP4 文件不能通过 HTML5 播放？

Question

很奇怪，有些 MP4 文件可以在 HTML5 中播放，但有些则不能。这是一个测试页 http://psdtucss.com/test/test2.html , 在 Chrome 19.0.1084.46 m 中打开它。第一个 MP4 播放，但另一个不播放。什么原因。代码非常简单:

<h3>the first mp4 file can play</h3> 
<p><video width="640" height="264" controls="controls"><source src="1.mp4" type="video/mp4" />Your browser does not support the video tag.</video></p> 
<h3>but the other can't play</h3> 
<p><video width="640" height="264" controls="controls"><source src="2.mp4" type="video/mp4" />Your browser does not support the video tag.</video></p>

我该如何解决这个问题？

我尝试了 videojs，但仍然无法播放某些 MP4 文件。测试页面在这里: http://psdtucss.com/test/test.html

Answer 1

mp4 只是容器 格式。它可能包含采用多种编解码器 的视频和音频。播放器(包括浏览器中的播放器)需要支持容器格式和所有使用的编解码器才能正确播放视频。

使用 VideoJS 绝对是个好主意，它可以为您处理许多特定于浏览器的解决方法。

---

然而，它并没有解决一个问题:并非所有浏览器都支持单一的视频编解码器。 (另请参阅 Wikipedia: HTML5 video: Browser_support)

实际的解决方案可能是提供两个版本:在 mp4 容器中的 h264 和通常称为 webm 的版本(在特定的 Matroska 容器中的 VP8 视频和 vorbis 音频)。有了这两个，您就可以涵盖所有主要浏览器。

---

对于视频转换/重新编码，有一些工具和服务可用。我不知道您的操作系统或要求。所以就像一个疯狂的猜测:

我用来帮助 friend 在他的小博客上发布一些视频的东西是this shell script using ffmpeg进行转换。它仍然有很大的改进潜力(在所有视频质量、性能和编码方面)，但应该足以开始了。