Question

我正在使用django构建一个网站。我正在尝试使用html5标记在我的网页中添加视频。我的代码如下。

<video controls style="width: 100%; height: 100%;" id="video" preload="none">
                    <source src="{% static 'media/video1.ogv' %}" type='video/ogg; codecs="theora, vorbis"'/>
                    <source src="{% static 'media/video1.webm' %}" type='video/webm'>
                    <source src="{% static 'media/video1.mp4' %}" type='video/mp4'>
                    <p>Video is not visible, most likely your browser does not support HTML5 video</p>
                </video>

但是在Safari浏览器中没有播放视频。我将视频更改为video1.mov文件，但仍然没有播放。我正在使用heroku进行部署。我检查了是否安装了Quickstart。它已经安装好了。显示的错误是

Failed to load resource: Plug-in handled load
http://www.***.com/static/media/video1.mov

有人可以帮我解决这个问题吗？

Answer 1

可能是MP4编码方式的问题。我知道这个问题有点老了，但我遇到了同样的问题，所以万一会帮助你或其他人像我一样找到这个问题：

似乎QuickTime（这是为Safari播放MP4的插件）仅在文件使用特定配置文件进行编码时才有效。这在Apple's FAQ中的问题＃2中指定。

虽然协议规范不限制视频和音频格式，但当前的Apple实现支持以下格式：

视频：   H.264基线等级3.0，基线等级3.1，主等级3.1和高等级等级4.1。

音频：   HE-AAC或AAC-LC，最高48 kHz，立体声音频   MP3（MPEG-1 Audio Layer 3）8 kHz至48 kHz，立体声音频   AC-3（适用于Apple TV，仅限直通模式）

您需要使用其中一个视频配置文件对其进行编码，以使其与QuickTime一起使用，从而使用Safari。

如果您同时定位iOS设备，this table也可能会有所帮助，以便了解您与之兼容的内容：

基线3.0：所有设备

基线3.1： iPhone 3G及更高版本，iPod touch第二代及更高版本。

主要资料3.1： iPad（所有版本），Apple TV 2及更高版本以及iPhone 4及更高版本。

主要配置文件4.0： Apple TV 3及更高版本，iPad 2及更高版本以及iPhone 4S及更高版本

High Profile 4.0： Apple TV 3及更高版本，iPad 2及更高版本以及iPhone 4S及更高版本。

High Profile 4.1： iPad 2及更高版本以及iPhone 4S及更高版本。

最后，以下是创建这些编码的ffmpeg选项： https://trac.ffmpeg.org/wiki/Encode/H.264#AdditionalInformationTips

知道您可以在QuickTime中打开文件（您不必通过Safari加载）以检查文件是否有效，这也很有用。

使用html5视频标签时，视频无法在Safari中播放

1 个答案: