阿里云 实现流媒体 直播 demo

原理图:



我们使用是h5 所以我们直播通过手机端进行访问



让我们一起开始奇妙的流媒体之旅吧!


1、下载nginx-rtmp-module:

nginx-rtmp-module的官方github地址:https://github.com/arut/nginx-rtmp-module

使用命令:

[php]  view plain  copy
  1. git clone https://github.com/arut/nginx-rtmp-module.git  

将nginx-rtmp-module下载到linux中。


2、安装nginx:

nginx的官方网站为:http://nginx.org/en/download.html

[php]  view plain  copy
  1. wget http://nginx.org/download/nginx-1.8.1.tar.gz  
  2. tar -zxvf nginx-1.8.1.tar.gz  
  3. cd nginx-1.8.1  
  4. ./configure --prefix=/usr/local/nginx  --add-module=../nginx-rtmp-module  --with-http_ssl_module    
  5. make && make install  
本次默认安装目录为:/root, add-module为下载的nginx-rtmp-module文件路径。

安装时候可能会报错没有安装openssl,需要执行命令:

[php]  view plain  copy
  1. yum -y install openssl openssl-devel    

3、修改nginx配置文件:


[php]  view plain  copy
  1. vi /usr/local/nginx/conf/nginx.conf  

加入以下内容:

[php]  view plain  copy
  1. rtmp {    
  2.     
  3.     server {    
  4.     
  5.         listen 1935;  #监听的端口  
  6.     
  7.         chunk_size 4000;    
  8.           
  9.            
  10.         application hls {  #rtmp推流请求路径  
  11.             live on;    
  12.             hls on;    
  13.             hls_path /usr/share/nginx/html/hls;    
  14.             hls_fragment 5s;    
  15.         }    
  16.     }    
  17. }  
hls_path需要可读可写的权限。
修改http中的server模块:

[php]  view plain  copy
  1. server {  
  2.     listen       81;  
  3.     server_name  localhost;  
  4.   
  5.     #charset koi8-r;  
  6.   
  7.     #access_log  logs/host.access.log  main;  
  8.   
  9.     location / {  
  10.         root   /usr/share/nginx/html;  
  11.         index  index.html index.htm;  
  12.     }  
  13.   
  14.     #error_page  404              /404.html;  
  15.   
  16.     # redirect server error pages to the static page /50x.html  
  17.     #  
  18.     error_page   500 502 503 504  /50x.html;  
  19.     location = /50x.html {  
  20.         root   html;  
  21.     }  
当然了,root可以跟据自己的需求来改的。
然后启动nginx:

[php]  view plain  copy
  1. /usr/local/nginx/sbin/nginx -c /usr/local/nginx/conf/nginx.conf    

关于更多rtmp的参数可以参考:https://github.com/arut/nginx-rtmp-module/wiki


4、开始推流

做好以上的配置后,就可以开始推流了,我们可以使用obs来推流。

在设置->串流 中填写信息:URL为 rtmp://xxx:1935/hls,xxx为你的服务器的IP地址,hls是用来存放流媒体的。

秘钥可以随便填写一个,用来播放的时候识别播放哪个流媒体的,例如填写test等。

填写完毕后,点击开始串流,就说明我们的流媒体服务器搭建成功了。


5、观看直播(拉流)

观看直播就比较简单了,可以简单的使用h5的vedio标签就可以观看了。

可以访问http://xxx:81/hls/mystream.m3u8来观看直播,其中xxx为你的服务器IP地址,

或者使用

[php]  view plain  copy
  1. <video>    
  2.     <source src="http://xxx:81/hls/test.m3u8"/>    
  3.     <p class="warning">Your browser does not support HTML5 video.</p>    
  4. </video>  


同上, xxx写的是你服务器IP地址。

然后使用手机访问这个网站就能够观看直播了。延迟大概在20S左右。

(在iOS的safari浏览器中可以正常观看)

写在最后

为什么延迟 那么高呢?这是因为服务器将视频流切断成一个个小的以.ts结尾的文件。

(hls文件夹内容。即推流到该文件夹了)

而我们访问的是.m3u8文件,这个文件内容是将一个个ts文件串联起来的,这就达到了一个播放的效果,所以看起来会有很大的延迟。

(m3u8文件内容)

如果降低延迟也不是没有方法,可以设置切片生成的大小以及访问的速度,但是这样大大增加了服务器的压力。

当然,我们也可以用rtmp拉流工具(VLC等)来看该直播,延迟大概在2-5S左右,拉流地址与推流地址一致。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值