javascript - HTML5 视频在 IE9+10 中不工作

Question

我正在尝试使用跨多个浏览器的 HTML5 视频制作图像横幅。我的视频可以在大多数操作系统的 Chrome 和 Firefox 中运行，但 Internet Explorer 似乎无法在 IE9 以上运行。横幅所在页面与视频文件不在同一个文件夹中；横幅存在于许多页面中。

我看到的问题是 IE9 和 10 无法在视频 HTML5 代码中看到 Flash 回退选项并且它没有注册。我想创建某种 if-else 语句，强制使用 IE9 或 10 的用户查看 Flash 版本，同时将所有其他浏览器重定向到通用 HTML5 版本。此横幅适用于以下版本，包括 IE8。

我无权访问 .htaccess 文件；我在其他地方看到了这个建议，以便手动添加 MIME 类型(即使在我在每个视频源行中指定它之后。)我查看了 IE9+10 中的控制台以查看 MIME 类型是否有问题，并且没有出现错误向上。右键单击视频出现的空间也为我提供了 HTML5 视频选项，但单击“播放”没有任何反应。

如果有人可以帮助我调试代码或找出使其工作的方法，那就太好了。谢谢你!下面是我正在使用的 HTML5 视频代码，它适用于 Chrome、Firefox 和其他浏览器。

<video autoplay loop>
<source src="http://fulmar.mahopac.k12.ny.us/www/mcsd_FR/site/hosting/Fulmar%20Banner/Fulmar_Banner.mp4" type="video/mp4">
<source src="http://fulmar.mahopac.k12.ny.us/www/mcsd_FR/site/hosting/Fulmar%20Banner/Fulmar_Banner.ogv" type="video/ogg">
<source src="http://fulmar.mahopac.k12.ny.us/www/mcsd_FR/site/hosting/Fulmar%20Banner/FlashFulmar Slideshow.webmhd.webm" type="video/webm">
<object width="954" height="224" type="application/x-shockwave-flash" data="http://fulmar.mahopac.k12.ny.us/www/mcsd_FR/site/hosting/Fulmar%20Banner/Fulmar%20Banner.swf">
    <param name="movie" value="http://fulmar.mahopac.k12.ny.us/www/mcsd_FR/site/hosting/Fulmar%20Banner/Fulmar%20Banner.swf" />
</object>
</video>

编辑:mp4 文件的编解码器是 h.264 + AAC。

Answer 1

IE 仅支持一组有限的视频源编解码器

IE 9+ 支持 h264 和 mp3/aac，vp8 和 vp9 有问题，所有其他似乎不支持。

MDN doc on media browser compatibility

因此您必须提供多个视频源来支持每个浏览器，但不一定要为每个浏览器提供一个视频，因为某些浏览器在支持方面确实存在重叠。

提供 h264 aac/mp3 视频应该可以在 IE、Safari 和 Chrome 上播放。虽然使用 Theora 或 VP8 的视频应该可以在 Firefox 和 Opera 上播放