Question

我想使用HTML5 <video>标记在IE9中播放mp4视频。我将MIME类型添加到IIS 7中，因此如果我浏览http://localhost/video.mp4它同时在Chrome和IE9中播放但在HTML5中播放，则Chrome会以HTML格式播放视频。这是代码：

<html>
<body>
  <video src="video.mp4" width="400" height="300" preload controls>
  </video>
</body>
</html>

有什么想法吗？

由于

更新

在Firefox 5.0中尝试过相同的文件但它也无法正常工作，只有Chrome才能播放mp4视频。

Answer 1

对于IE9我发现需要一个元标记来设置模式

<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>

<video width="400" height="300" preload controls>
<source src="movie.mp4" type="video/mp4" />
Your browser does not support the video tag
</video>

Answer 2

使用http://videojs.com/结束支持所有浏览器。

但为了让视频在IE9和Chrome中运行，我只添加了html5 doc类型并使用了mp4：

<!DOCTYPE html>
<html>
<body>
  <video src="video.mp4" width="400" height="300" preload controls>
  </video>
</body>
</html>

Answer 3

如果它仍然不能在这里工作，那肯定是一个解决方案：用压缩格式H.264编码mp4。如果您使用格式mpeg4或divx对其进行编码，否则它将无法在IE9上运行，并且可能会使Google Chrome崩溃。为此，我使用Any Video Converter免费软件。但它可以通过任何好的视频工具完成。

我一直在尝试这里列出的所有解决方案，并尝试了几天的其他解决方法，但问题在于我创建mp4的方式。 IE9不会解码除H.264之外的其他格式。

希望这有帮助，麦

Answer 4

Dan有一个最好的答案，我建议你在目标浏览器上使用html5test.com来查看支持的视频格式。

如上所述，没有单一格式可行，我使用的是MP4编码为H.264，WebM和闪回后备。这让我看看以下视频：

Win 7 - IE9，Chrome，Firefox，Safari，Opera

Win XP - IE7，IE8，Chrome，Firefox，Safari，Opera

MacBook OS X - Chrome，Firefox，Safari，Opera

iPad 2，iPad 3

Linux - Android 2.3，Android 3

<video width="980" height="540" controls>
        <source src="images/placeholdername.mp4" type="video/mp4" />
        <source src="images/placeholdername.webm" type="video/webm" />
        <embed src="images/placeholdername.mp4" type="application/x-shockwave-flash" width="980" height="570" allowscriptaccess="always" allowfullscreen="true" autoplay="false"></embed>  <!--IE 8 - add 25-30 pixels to vid height to allow QT player controls-->    
    </video>

注意： .mp4视频应以h264基本配置文件编码，以便在所有移动设备上播放。

更新：为Flash回退添加了autoplay =“false”。这可以防止MP4在IE8加载页面时立即开始播放，一旦按下播放按钮，它就会开始播放。

Answer 5

Internet Explorer 9使用H.264编解码器支持MPEG4。但它还要求文件一开始下载就可以开始播放。

以下是如何制作在IE9中工作的MPEG文件的基本步骤（在Ubuntu上使用avconv）。我花了很多时间才弄明白，所以我希望它可以帮助别人。

使用H.264编解码器将视频转换为MPEG4。你不需要任何花哨的东西，只需让avconv为你完成这项工作：
```
avconv -i video.mp4 -vcodec libx264 pre_out.mp4
```
此视频适用于所有支持MPEG4的浏览器，IE9除外。要添加对IE9的支持，您必须将文件信息移动到文件头，以便浏览器可以在开始下载后立即开始播放。这是IE9的关键!!!
```
qt-faststart pre_out.mp4 out.mp4
```

qt-faststart是一个Quicktime实用程序，也支持H.264 / ACC文件格式。它是libav-tools包的一部分。

Answer 6

据我所知，视频支持充其量只是微不足道。

来自http://diveintohtml5.ep.io/video.html#what-works：

在撰写本文时，这是HTML5视频的格局：



Mozilla Firefox（3.5及更高版本）在Ogg容器中支持Theora视频和Vorbis音频。 Firefox 4还支持WebM。



Opera（10.5及更高版本）支持Ogg容器中的Theora视频和Vorbis音频。 Opera 10.60也支持WebM。



Google Chrome（3.0及更高版本）在Ogg容器中支持Theora视频和Vorbis音频。 Google Chrome 6.0还支持WebM。



Mac和Windows PC上的Safari（3.0及更高版本）将支持QuickTime支持的任何内容。理论上，您可以要求您的用户安装第三方QuickTime插件。实际上，很少有用户会这样做。因此，您将获得QuickTime支持的“开箱即用”格式。这是一个很长的列表，但它不包括WebM，Theora，Vorbis或Ogg容器。但是，QuickTime确实在MP4容器中支持H.264视频（主配置文件）和AAC音频。



Apple的iPhone和Google Android手机等手机在MP4容器中支持H.264视频（基线配置文件）和AAC音频（“低复杂度”配置文件）。



Adobe Flash（9.0.60.184及更高版本）支持MP4容器中的H.264视频（所有配置文件）和AAC音频（所有配置文件）。



Internet Explorer 9支持所有H.264视频配置文件以及MP4容器中的AAC或MP3音频。如果您安装第三方编解码器，它也将播放WebM视频，默认情况下，该编解码器未安装在任何版本的Windows上。 IE9不支持其他第三方编解码器（与Safari不同，它可以播放QuickTime可以播放的任何内容）。



Internet Explorer 8根本没有HTML5视频支持，但几乎所有Internet Explorer用户都拥有Adobe Flash插件。在本章的后面部分，我将向您展示如何使用HTML5视频，但优雅地回归Flash。

同样，您应该在同一页面的下方注意这一部分：

在所有HTML5浏览器中都没有单一的容器和编解码器组合。

这不太可能在不久的将来改变。

要在所有这些设备和平台上观看您的视频，您需要多次对视频进行编码。

Answer 7

我有一个在一台服务器上播放的基本配置文件.mp4视频，而不是另一个。

唯一的区别是：
一个给出标题"Content-Length: ..."
另一个"Trasfer-Encoding: chunked".

我发现不需要Content-Length，唯一重要的是，应该没有分块标头。这可以通过关闭.mp4文件的压缩（deflate或gzip）来完成。如何做到这一点是另一个问题和另一个话题： How to disable Apache gzip compression for some media files in .htaccess file?

可能存在其他服务器问题：
它必须给"Content-Type: video/mp4" 而不是"Content-Type: text/plain"

Answer 8

使用这两种格式在所有浏览器中都能正常工作：

<video width="640" height="360" controls>
    <!-- MP4 must be first for iPad! -->
    <source src="unbelievable.mp4" type="video/mp4" /><!-- Safari / iOS video    -->
    <source src="movie.ogg" type="video/ogg" /><!-- Firefox / Opera / Chrome10 -->
</video>

Answer 9

如果上述任何答案都不起作用，并且您在Apache服务器上，请将以下内容添加到.htaccess文件中：

//most of the common formats, add any that apply
AddType video/mp4 .mp4 
AddType audio/mp4 .m4a
AddType video/mp4 .m4v
AddType video/ogg .ogv 
AddType video/ogg .ogg
AddType video/webm .webm

我遇到了类似的问题，添加它解决了我所有的播放问题。

Answer 10

Internet Explorer和Edge不支持Chrome的某些MP4格式。您可以使用ffprobe查看确切的MP4格式。就我而言，我有这两个视频：

Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'a.mp4':
  Metadata:
    major_brand     : isom
    minor_version   : 512
    compatible_brands: isomiso2avc1mp41
    encoder         : Lavf56.40.101
  Duration: 00:00:12.10, start: 0.000000, bitrate: 287 kb/s
    Stream #0:0(und): Video: h264 (High 4:4:4 Predictive) (avc1 / 0x31637661), yuv444p, 1000x1000 [SAR 1:1 DAR 1:1], 281 kb/s, 60 fps, 60 tbr, 15360 tbn, 120 tbc (default)
    Metadata:
      handler_name    : VideoHandler


Input #0, mov,mp4,m4a,3gp,3g2,mj2, from 'b.mp4':
  Metadata:
    major_brand     : isom
    minor_version   : 512
    compatible_brands: isomiso2avc1mp41
    encoder         : Lavf57.66.102
  Duration: 00:00:33.83, start: 0.000000, bitrate: 505 kb/s
    Stream #0:0(und): Video: h264 (Constrained Baseline) (avc1 / 0x31637661), yuv420p, 1280x680, 504 kb/s, 30 fps, 30 tbr, 15360 tbn, 60 tbc (default)
    Metadata:
      handler_name    : VideoHandler

两者在Chrome中都运行良好，但第一个在IE和Edge中失败。问题是 IE和Edge不支持yuv444 。你可以转换为像这样的较小的颜色空间：

ffmpeg -i input.mp4 -pix_fmt yuv420p output.mp4

Answer 11

尝试以下操作，看看它是否有效：

<video width="400" height="300" preload controls>
  <source src="video.mp4" type="video/mp4" />
  Your browser does not support the video tag.
</video>

Answer 12

我必须从Windows Web App Gallery安装IIS Media Services 4.1。

http://www.microsoft.com/web/gallery/install.aspx?appsxml=http://www.microsoft.com/web/webpi/3.0/MediaProductList.xml&appid=MediaServices

Answer 13

没有JavaScript，我唯一可以毫无错误地玩游戏的方式：

<!--[if lte IE 9]>
<!-- PUT HERE A FLASH PLAYER WITH video.flv -->
<![endif]-->

<!--[if gt IE 9]><!-->
<video controls class="video">
    <source src="video.mp4" type="video/mp4">
    <!-- REPEAT FLASH PLAYER CODE HERE -->
</video>
<!--<![endif]-->

HTML5 - mp4视频无法在IE9中播放

13 个答案: