flowplayer：如果先指定webm，chr​​ome将不会加载mp4

Question

flowplayer html5 5.4.6
chome 35 +

在流媒体html5中，在chrome上我一直得到html5：不支持视频编码或者html5：找不到视频。

我通过javascript加载流程图，并且有一个如此定义的播放列表：

$(function () {
    $('#fp').flowplayer({
        playlist:[ [
            { webm: "/usermedia/update_sets/140704/videos/02-480p.webm"},
            { mp4: "/usermedia/update_sets/140704/videos/02-480p.mp4"} ] ],                     
        splash: true
    });
});

我检查了mp4的视频格式，一切都很顺利。我甚至可以将mp4拖放到chrome中，然后播放np。

在chrome dev工具中我打开了网络选项卡，可以看到它试图打开webm文件，获取部分内容，然后取消get get。 它永远不会尝试加载mp4文件。

所以我尝试颠倒顺序，以便mp4是播放列表中的第一个。 瞧。视频没问题。 我也在firefox中测试过它没有问题。

问题是，如果在播放列表中首先指定了webm源，为什么chrome上的flowplayer html5会失败？

='（

Answer 1

看看here

我希望这可以帮助你

浏览器检查哪些有效，但它从上到下看起来如此，如果第一个适用于他，他将使用它，所以更改顺序，它假设工作

给你举个例子

<div class="flowplayer">
<video>
  <source type="video/webm" src="http://example.com/intro.webm">
  <source type="video/mp4" src="http://example.com/intro.mp4">
  <source type="video/ogg" src="http://example.com/intro.ogv">
  </video>
</div>

现在webm将首先出现， 如果你把它改成：

<div class="flowplayer">
<video>
  <source type="video/mp4" src="http://example.com/intro.mp4">
  <source type="video/webm" src="http://example/intro.webm">
  <source type="video/ogg" src="http://example.com/intro.ogv">
</video>
</div>

.mp4先行。