分享

Centos7搭建Nginx+Rtmp/HLS视频直播服务端

 江边微影 2020-03-10

1.介绍

本文介绍在Centos7下搭建Nginx+Rtmp/HLS视频推送服务端。通过本地推送摄像头视频/图片帧(需要转成rtmp与HLS能够视频的格式)到Centos7下的视频推送服务端,接着,客户端通过视频插件获取特定链接获取视频。

2.步骤

2.1 安装模块

安装Nginx与nginx-rtmp-module、Openssl等模块,可参考:参考链接
其中,与之不同的是我创建的模块存放路径为modules不是module.

//创建nginx安装目录与模块目录
mkdir -p /usr/local/nginx/modules

2.2 配置文件
1) 首先看到我们的路径下的文件:

文件目录
   其中conf存放配置文件,modules 存放rtmp模块信息,myapp存放推送来的视频文件。
2) 将/usr/local/nginx/modules/nginx-rtmp-module/test下的nginx.conf替换/usr/local/nginx/conf 路径下的nginx.conf.
在这里插入图片描述
在这里插入图片描述
3) 并修改nginx.conf(请注意看里面的注释)。由于我的端口8080被占用了,所以改成8787。

worker_processes  1;

error_log  logs/error.log debug;

events {
    worker_connections  1024;
}

rtmp {
    server {
        listen 1935;
        application rtmplive {
            live on;
        }
        
          application hls {   #application后面的hls十分重要!
              live on;
              hls on;
              hls_path  /usr/local/nginx/myapp; #视频存放路径
              hls_fragment 5s;
          }
    }
}

http {
    server {
        listen      8787;

        location /stat {
            rtmp_stat all;
            rtmp_stat_stylesheet stat.xsl;
        }

        location /stat.xsl {
            root /path/to/nginx-rtmp-module/;
        }

        location /control {
            rtmp_control all;
        }
		  location /hls { 
              # Serve HLS fragments
              types {
                  application/vnd.apple.mpegurl m3u8;
                  video/mp2t ts;
              }
          alias  /usr/local/nginx/myapp; #HLS 路径
          expires -1;
          }

        #location /publish {
        #    return 201;
        #}

        #location /play {
        #    return 202;
        #}

        #location /record_done {
        #    return 203;
        #}

        location /rtmp-publisher { #rtmp路径
            root /usr/local/nginx/modules/nginx-rtmp-module/test;
        }

        location / {  # nginx 打开的路径
            root /usr/local/nginx/modules/nginx-rtmp-module/test/www; #输入IP:8787 就指向/usr/local/nginx/modules/nginx-rtmp-module/test/www 下的index.html
        }
    }
}

3) 现在,需要配置Index.html(/usr/local/nginx/modules/nginx-rtmp-module/test/www路径下的)文件,我用的是sewise-player
代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"/>
	<title>Sewise Player</title>
	<script type="text/javascript" src="player/sewise.player.min.js"></script>
</head>
<body>
	<div id="player" style="width: 640px; height: 352px; ">
		<script type="text/javascript">
			SewisePlayer.setup({
				server: "vod",
				type: "m3u8",
				autostart: "true",
				poster: "http://jackzhang1204./materials/poster.png",
				videourl: "http://你的IP:8787/hls/mystream1.m3u8",  //是HTTP呀,8787,如果是rtmp则是1935
		        skin: "vodWhite",
		        title: "Live M3U8",
		        claritybutton: "disable",
		        lang: "zh_CN"
			}, "player");
		</script>

	</div>
	<div style="padding: 20px;float: left;">注:如果当前平台为PC,播放器将启用Flash播放m3u8文件。如果当前平台为Mobile,播放器将启用HTML5播放m3u8文件。</div>
		<div style="float: left; width: 100%; padding: 10px 30px; "><a href="https://github.com/jackzhang1204/sewise-player" target="_blank">Fork it on GitHub</a></div>
</body>
</html>

注意:HLS用的http协议,用8787,RTMP用1935端口。

4) 我们再创建一个index1.html,如下所示路径,index1.html 则使用rtmp推流。
在这里插入图片描述
index1.html 如下,index1.html使用自带的jwplayer,如下所示,

<b>Play</b> | <a href="record.html">Record</a>
<br/>
<script type="text/javascript" src="/jwplayer/jwplayer.js"></script>

<div id="container">Loading the player ...</div>
    <script type="text/javascript">
        jwplayer("container").setup({
        sources: [
            {
                file: "rtmp://你的IP:1935/hls?carg=1/mystream1?sarg=2"
            }
        ],
        image: "bg.jpg",
        autostart: false,
        width: 640,
        height: 480,
        primary: "flash"
});
</script>

此时我们需要重启nginx,在Xshell中输入:

cd /usr/local/nginx/sbin
./nginx -s reload
/usr/local/nginx/sbin/nginx -c/usr/local/nginx/conf/nginx.conf

3.推流

3.1 用开源推流软件OBS,如图所示设置推流:
在这里插入图片描述
在这里插入图片描述

3.2 注意:设置信息推流信息(hls对应上面的nginx.conf中的application名称,mystream1(与上述html中对应)则是指出要生成的流文件,其最终会在myapp目录下生成指定文件)。

在这里插入图片描述
3.3 选择来源,就可以开始推流了。
在这里插入图片描述

4.结果

注意浏览器的选择也重要,可以换几个浏览器,谷歌默认禁止flash,在手机web端需要加装index.html的。
在这里插入图片描述
  
在这里插入图片描述

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多