0

我正在尝试在网络上流式传输视频文件。我的服务器是 httpd 2.2 runnin gon centos 5 64 位。到目前为止，它在 ie9、chrome、opera 上运行良好，但我在 firefox 上遇到了问题。我不能依赖用户安装某些插件。如果不支持，我希望视频能够在 html5 中播放，然后滚动到 Flash。以下是我拥有的当前代码。

<!DOCTYPE html>
<html>

<head>
<SCRIPT type="text/javascript" src="jquery-1.7.2.min.js"></SCRIPT>
<SCRIPT type="text/javascript" src="modernizr.custom.13466.js"></SCRIPT>
<script type="text/javascript" src="excanvas.js"></script>
<script type="text/javascript">

function supports_canvas() {
      return !!document.createElement('canvas').getContext;
    }

function supports_video() {
    console.log("supports video");
    console.log(document.createElement('video').canPlayType);
      return !!document.createElement('video').canPlayType;
    }

function supports_h264_baseline_video() {
      if (!supports_video()) { return false; }
      var v = document.createElement("video");
      return v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
    }


function supports_ogg_theora_video() {
      if (!supports_video()) { return false; }
      var v = document.createElement("video");
      return v.canPlayType('video/ogg; codecs="theora, vorbis"');
    }

function supports_webm_video() {
      if (!supports_video()) { return false; }
      var v = document.createElement("video");
      return v.canPlayType('video/webm; codecs="vp8, vorbis"');
    }

</script>
</head>

<body>
    <script type="text/javascript">
$(document).ready(function() {  
    /*console.log("document ready");
    if ( !supports_video() ) { 
        console.log("false");   
        return false; 
    }
*/

    if (Modernizr.canvas) {
          // let's draw some shapes!
        } else {
          // no native canvas support available :(
        }
});
</script>

    <!-- first try HTML5 playback: if serving as XML, expand `controls` to `controls="controls"` and autoplay likewise -->
    <!-- warning: playback does not work on iOS3 if you include the poster attribute! fixed in iOS4.0 -->
    <video width="640" height="360" controls>
        <!-- MP4 must be first for iPad! -->
        <source src="movie.mp4" type="video/mp4" />
        <!-- Safari / iOS video    
        <source src="movie.ogv" type="video/ogg" />-->
        <!-- Firefox / Opera / Chrome10 -->
        <!-- fallback to Flash: -->
        <object width="640" height="360" type="application/x-shockwave-flash"
            data="movie.swf">
            <!-- Firefox uses the `data` attribute above, IE/Safari uses the param below -->
            <param name="movie" value="movie.swf" />
            <param name="flashvars"
                value="controlbar=over&amp;image=movie.jpg&amp;file=movie.mp4" />
            <!-- fallback image. note the title field below, put the title of the video there -->
            <img src="movie.jpg" width="640" height="360" alt="__TITLE__"
                title="No video playback capabilities" />
        </object>
    </video>
    <!-- you *must* offer a download link as they may be able to play the file locally. customise this bit all you want 
    <p>
        <strong>Download Video:</strong> Closed Format: <a
            href="movie.mp4">"MP4"</a> Open Format: <a href="movie.ogv">"Ogg"</a>
    </p>-->

</body>
</html>

我已将以下内容放在 .htaccess 文件和 httpd conf

AddType video/mp4 mp4
AddType video/ogg ogg
AddType video/webm webm

我还将以下内容加载到 httpd

AddHandler h264-streaming.extensions .mp4
LoadModule h264_streaming_module /usr/lib64/httpd/modules/mod_h264_streaming.so

我得到的 Firefox 消息是：firefox 没有支持格式的视频

有什么建议么？

4

1 回答 1

1

火狐不支持 MP4。如果浏览器支持 HTML5 视频，它将寻找可以播放的文件。如果找不到，它不会自动回退到 Flash 版本，因此对于 Firefox（和 Opera，也不支持 MP4），您还需要提供 WebM 格式（如果是 Ogg你想支持 Firefox 3.6）。

于 2012-12-10T13:06:55.763 回答