2

我必须开发一个在所有主要浏览器（Chrome、Firefox、IE9、Safari 和 Opera）上运行的 html5 应用程序，并且要求它也能够播放视频。我正在使用他们提供的视频标签和 2 种不同格式的视频：

<video width="640" height="360" controls autoplay="autoplay">
    <source src="../videos/grafico.ogg" type="video/ogg"/>
    <source src="../videos/grafico.mp4" type="video/mp4"/>
    Your browser doesn't support video
</video>

我的问题是这只能在 IE 上运行。在 Chrome、Firefox 和 Opera 上，它会打开播放器，但图像是黑色的。在 Safari 上，它只显示“您的浏览器不支持视频”消息。我也尝试过使用videojs，但黑屏问题仍然存在。顺便说一句，这是在本地播放时发生的（我无权访问服务器）。

我不知道自己做错了什么，也没有太多关于如何处理视频的知识。有谁知道我应该怎么做？

4

2 回答 2

1

首先，您需要先放置 MP4 源。在较旧的 iPad 上存在一个问题，即它们无法查看列表中的第一个来源。

对于 Chrome、Firefox 和 Opera，这可能是 ogg 文件本身的问题，或者是服务器为该文件发送的 MIME 类型的问题。检查以确保 ogg 可以在其他地方播放，例如 VLC。

如果是，请将扩展名更改为 .ogv。这不应该有什么不同，但它更正确。然后将这些行添加到您的 .htaccess 文件中。这是来自HTML5 Boilerplate。

# Audio
AddType audio/mp4                      m4a f4a f4b
AddType audio/ogg                      oga ogg

# Video
AddType video/mp4                      mp4 m4v f4v f4p
AddType video/ogg                      ogv
AddType video/webm                     webm
AddType video/x-flv                    flv

这似乎是 ogg 文件不能在人们的 HTML5 视频中播放的 #1 原因。

作为旁注，您可能还需要考虑制作一个 WebM 文件，或者使用而不是 Ogg。它具有更好的压缩质量比。您可以使用Firefogg.org免费制作 WebM。

我不明白为什么 IE 会播放 MP4 而 Safari 不会，但希望这些也能解决这个问题。干杯。

于 2012-11-13T19:08:03.393 回答
0 
<video width="320" height="240" controls="controls" autoplay="autoplay">

试试这个方法。为我在所有浏览器中测试并有效。

于 2012-11-13T12:41:45.717 回答