搭建在线直播

技术选型

直播端：采用 ffmpeg 软件，对视频来源进行推流至服务器端或CDN

播放端：采用 Nginx 服务器解析，利用 nginx-rtmp-module 插件，对视频流进行播放，播放媒介采用 HLS

nginx-rtmp-module

插件地址：https://github.com/arut/nginx...

进入 nginx 源码目录，重新编译，加入 rtmp 插件

./configure --add-module=/path/to/nginx-rtmp-module --with-http_ssl_module --with-debug
make
make install

至此，rtmp 模块就配置好了！

FFmpeg

是一套可以用来记录、转换数字音频、视频，并能将其转化为流的开源计算机程序。采用LGPL或GPL许可证。它提供了录制、转换以及流化音视频的完整解决方案。它包含了非常先进的音频/视频编解码库libavcodec，为了保证高可移植性和编解码质量，libavcodec里很多codec都是从头开发的。

tar jxvf ffmpeg-3.0.tar.bz2
cd ffmpeg-3.0
./configure --enable-shared --prefix=/usr/local/ffmpeg --disable-yasm
make （10分钟左右）
make install

查看依赖库是否缺失

ldd `which /usr/local/ffmpeg/bin/ffmpeg
linux-vdso.so.1 =>  (0x00007ffeecbf7000)
libavdevice.so.57 => not found
libavfilter.so.6 => not found
libavformat.so.57 => not found
libavcodec.so.57 => not found
libswresample.so.2 => not found
libswscale.so.4 => not found
libavutil.so.55 => not found
libm.so.6 => /lib64/libm.so.6 (0x000000393a800000)
libpthread.so.0 => /lib64/libpthread.so.0 (0x0000003939c00000)
libc.so.6 => /lib64/libc.so.6 (0x0000003939800000)
/lib64/ld-linux-x86-64.so.2 (0x0000003939000000)

将一些依赖的库地址放进去

vim /etc/ld.so.conf
/usr/local/ffmpeg/lib  //依赖库地址

ldconfig //生效

Nginx配置

在原有的 nginx.conf 中加入如下配置

rtmp {  
  
    server {  
  
        listen 1935;  
  
        chunk_size 4000;  
        
        #HLS  
  
        # For HLS to work please create a directory in tmpfs (/tmp/app here)  
        # for the fragments. The directory contents is served via HTTP (see  
        # http{} section in config)  
        #  
        # Incoming stream must be in H264/AAC. For iPhones use baseline H264  
        # profile (see ffmpeg example).  
        # This example creates RTMP stream from movie ready for HLS:  
        #  
        # ffmpeg -loglevel verbose -re -i movie.avi  -vcodec libx264   
        #    -vprofile baseline -acodec libmp3lame -ar 44100 -ac 1   
        #    -f flv rtmp://localhost:1935/hls/movie  
        #  
        # If you need to transcode live stream use 'exec' feature.  
        #  
        application hls {  
            live on;  
            hls on;  
            hls_path /usr/local/nginx/html/hls; //你的 nginx 的 html 目录 
            hls_fragment 5s;  
        }  
    }  
}

在 http 指令里，加入以下代码

server {  
  
    listen  8081;  
    location /hls {  
        # Serve HLS fragments  
        types {  
            application/vnd.apple.mpegurl m3u8;  
            video/mp2t ts;  
        }  
        root html;  
        expires -1;  
    }  
}

重启 Nginx，让配置生效！

netstat -nlp，查看端口占用情况

看看 rtmp 服务和 hls 服务的端口 1935 和 8081 是否都打开了。

开始直播了

接下来，看 rtmp 源的配置

ffmpeg -re -i sample.mp4 -vcodec copy -acodec copy -f flv rtmp://localhost/hls/mystream

根据 nginx.conf 中的 hls_path 配置，这个命令会向192.168.0.1主机的 /usr/local/nginx/html/hls 下面写入ts片段和m3u8文件，参见下面

-rw-r--r-- 1 nobody nobody 1029300 03-08 18:06 mystream-70.ts
-rw-r--r-- 1 nobody nobody 940564 03-08 18:06 mystream-71.ts
-rw-r--r-- 1 nobody nobody 1758928 03-08 18:06 mystream-72.ts
-rw-r--r-- 1 nobody nobody 912552 03-08 18:06 mystream-73.ts
-rw-r--r-- 1 nobody nobody 1279340 03-08 18:07 mystream-74.ts
-rw-r--r-- 1 nobody nobody 1148116 03-08 18:07 mystream-75.ts
-rw-r--r-- 1 nobody nobody 960304 03-08 18:07 mystream-76.ts
-rw-r--r-- 1 nobody nobody 2623728 03-08 18:07 mystream-77.ts
-rw-r--r-- 1 nobody nobody 257 03-08 18:07 mystream.m3u8

这个目录下的文件会动态刷新，前面写入的 ts 片段会被后面的 ts 片段覆盖。当这个直播流播完后，所有相关的 ts 片段和 m3u8 文件都将被删除。

HLS

HTTP Live Streaming（缩写是 HLS）是一个由苹果公司提出的基于HTTP的流媒体网络传输协议。是苹果公司QuickTime X和iPhone软件系统的一部分。它的工作原理是把整个流分成一个个小的基于HTTP的文件来下载，每次只下载一些。当媒体流正在播放时，客户端可以选择从许多不同的备用源中以不同的速率下载同样的资源，允许流媒体会话适应不同的数据速率。在开始一个流媒体会话时，客户端会下载一个包含元数据的extended M3U (m3u8) playlist文件，用于寻找可用的媒体流。

对比：HLS只请求基本的HTTP报文，与实时传输协议（RTP)不同，HLS可以穿过任何允许HTTP数据通过的防火墙或者代理服务器。它也很容易使用内容分发网络来传输媒体流。

此协议详细内容请参考apple官方网站：https://developer.apple.com/r...

HLS Player

play.html

<!--HLSPlayer代码开始-->
<div class="video" id="HLSPlayer" >
<SCRIPT LANGUAGE=JavaScript>
<!--
/*
* HLSPlayer参数应用=======================
* @param {Object} vID        ID
* @param {Object} vWidth     播放器宽度设置
* @param {Object} vHeight    播放器宽度设置
* @param {Object} vPlayer    播放器文件
* @param {Object} vHLSset    HLS配置
* @param {Object} vPic       视频缩略图
* @param {Object} vCssurl    移动端CSS应用文件
* HLSPlayer参数应用=======================
* 提示1：本实例请在IIS/Apache等网站环境下测试
* 提示2：本实例仅支持hls(m3u8)/不支持flv,mp4,f4v
*/
var vID        = "";
var vWidth     = "100%";                //播放器宽度设置
var vHeight    = 400;                   //播放器宽度设置
var vPlayer    = "HLSPlayer.swf?v=1.5"; //播放器文件
var vHLSset    = "HLS.swf";             //HLS配置
var vPic       = "images/start.jpg";    //视频缩略图
var vCssurl    = "images/mini.css";     //移动端CSS应用文件

//HLS(m3u8)地址,适配PC,安卓,iOS,WP
var vHLSurl    = "../mystream.m3u8"; //找到对应play.html文件与流文件的对应关系
//-->
</SCRIPT>
<script type="text/javascript" src="hls.min.js?rand=3396fsa778"></script>
</div>
<!--HLSPlayer代码结束-->

在线观看

http://localhost:8081/hls/pla...