基于浏览器功能替换MediaElementsJS中的媒体源（http为rtmp）

Question

首先，如果 John Dyer 正在阅读本文，非常感谢您的播放器，这太棒了！ :-)

现在，我的问题。我正在尝试使用 HTML5（iPad、iPhone、Android、Chrome 桌面）提供 MP4 视频，并回退到 Flash（Firefox、IE、Opera）。 MediaElementJS 开箱即用，除了 HTML5 解决方案允许使用 HTTP 随机跳转到视频中，而 Flash 回退使浏览器在播放之前下载整个文件。

因此，当使用 Flash 后备时，我想使用 rtmp 而不是 http（除了传统的网络服务器，我们还有一个 Flash 媒体服务器准备好提供视频），所以我想在这些情况下更改源.但我不知道 MediaElementJS 是否以及如何告诉我是否会使用 Flash。我试过这个：

<video autoplay controls width="800" height="600" id="video-tag" preload="auto">
  <source id="media-source-mp4" type="video/mp4" src="http://localhost/video1.mp4" />
  <object width="800" height="600" type="application/x-shockwave-flash" data="js/flashmediaelement.swf">
    <param name="movie" value="js/flashmediaelement.swf" />
    <param name="flashvars" value="controls=true&amp;autostart=true&amp;file=rtmp://localhost/video1.mp4" />
  </object>
</video>
<script type="text/javascript">$("#video-tag").mediaelementplayer({
     success: function(media, node, player) {
         if (media.pluginType != 'native') {
             media.setSrc('rtmp://localhost/video1.mp4');
             media.load();
             media.play();
         }
     }
 });</script>

但这显然行不通。我浏览了 medialement.js 代码，我认为 media 元素公开了 pluginType 属性，但我可能错了。在

中创建的

【问题讨论】：

Answer 1

我刚刚通过 Github 的 MediaElementJS 问题跟踪器找到了我自己问题的答案：

https://github.com/johndyer/mediaelement/issues/337

诀窍是在 URL 中的媒体文件名称前添加“mp4:”。所以，在我的例子中，最后几行是：

if (media.pluginType != 'native') {
    media.setSrc('rtmp://localhost/mp4:video1.mp4'); // NOTE the "mp4:" prefix
    media.load();
    media.play();
}

它适用于我们的 Flash Media Server 3.5。 :-)