[Apache]Apache配置支持流媒体服务

Apache配置

下载mod_flvx.so、mod_h264_streaming.so模块。
注意：Apache以及模块的x86、x64的版本对应 [下述模块针对Apache x86 2.2及以下版本]。
下载地址：链接：http://pan.baidu.com/s/1dEzYX4d 密码：jb0i

编辑apache\conf\httpd.conf，查找LoadModule，在LoadModule的最后面（或者附近）配置：

1
2
3
4


LoadModule flvx_module modules/mod_flvx.so
AddHandler flv-stream .flv
LoadModule h264_streaming_module modules/mod_h264_streaming.so
AddHandler h264-streaming.extensions .mp4

重启Apache即可，如果Apache不能启动，请确认模块的版本是否与Apache版本一致。

视频播放示例

ckplayer下载
网页视频播放器不限制，本示例使用的是ckplayer，下载地址是：
http://www.ckplayer.com/
配置方式：
http://www.ckplayer.com/tool/flashvars.htm
将ckplayer文件夹放置网站根目录，将示例视频example.flv放置网站根目录。

新建video.html，代码如下：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18


<html>
<meta charset="utf8">
<head>
<title>视频流播放</title>
</head>
<body>
<div id="a1"></div>
<script type="text/javascript" src="/ckplayer/ckplayer.js" charset="utf-8"></script>
<script type="text/javascript">
    var flashvars={
        f:'http://localhost/example.flv',
        c:0
    };
    var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:'transparent'};
    CKobject.embedSWF('/ckplayer/ckplayer.swf','a1','ckplayer_a1','600','400',flashvars,params);
</script>
</body>
</html>

打开浏览器访问http://localhost/video.html，可以拖动视频滚动条。
Chrome效果：

IE效果：

————Update 20160106————
之前的测试有问题，因为flv太小了，所以应该是local下载下来再播放的。
Apache视频流验证的方法是：
准备一个较大MP4/FLV，替换上述的视频网址；
打开Chrome [建议使用Chrome浏览器]，输入http://localhost/example.mp4?start=10；
如果视频能从第10秒开始播放，并支持拖动播放，Apache端配置成功。

上述的ckplayer经验证，依然需要等待下载完成才可顺序播放，建议使用video.js。不过需要浏览器支持HTML5。
html代码如下：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17


<html>
<head>
  <link href="/video-js/video-js.css" rel="stylesheet">
  <!-- If you'd like to support IE8 -->
  <script src="/video-js/ie8/videojs-ie8.min.js"></script>
</head>
<body>
  <video id="my-video" class="video-js" controls preload="auto" width="auto" height="auto" poster="http://vjs.zencdn.net/v/oceans.png" data-setup="{}">
    <source src="/video/example.mp4" type='video/mp4'>
    <p class="vjs-no-js">
      To view this video please enable JavaScript, and consider upgrading to a web browser that
      <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
  </video>
  <script src="/video-js/video.js"></script>
</body>
</html>

经测试，视频在未加载完全的情况下，能拖动到任意位置开始播放，至此，Apache实现了伪视频流播放。