推流拉流RMTP方案:Nginx+ffmpeg/obs+vlc/h5-CFANZ编程社区

RMTP方案:Nginx+ffmpeg/obs+vlc/h5

服务器安装

1.依赖

sudo apt-get update

sudo apt-get install libpcre3 libpcre3-dev

sudo apt-get install openssl libssl-dev

2.安装Nginx

下载nginx-1.17.9.tar.gz+nginx-http-flv-module.zip放到同级目录解压

https://nginx.org/download/

https://github.com/winshining/nginx-http-flv-module

cd nginx-1.17.9/

./configure --prefix=/usr/local/nginx --add-module=../nginx-http-flv-module --with-http_ssl_module

make

sudo make install

安装目录:/usr/local/nginx/sbin/nginx

3.修改配置文件/usr/local/nginx/conf/nginx.conf

在http同级下面添加rmtp模块

rtmp {
    server {
    listen 1935; #监听的端口
        chunk_size 4000;
        application live {
            live on; #当推流时，RTMP路径中的APP（RTMP中一个概念）匹配myapp时，开启直播
            record off; #不记录视频
            gop_cache on;
        }

        application hls { #rtmp推流请求路径
            live on;
            hls on;
            hls_path /tmp/hls;
            hls_fragment 2s;
     hls_playlist_length 60s; #总共可以回看的事件，这里设置的是1分钟
        }
    }
}

tips1:hls_path 目录hls,需要改权限可读可写的权限

tips2:如果部署在云端,添加SSL，需要修改#user nobody;为自己的用户名，配置文件的root权限

RTMP使用flash插件播放，不兼容所有浏览器

推流地址是 rtmp://127.0.0.1:1935/live/ +密钥（例如mystream）

拉流地址是 rtmp://127.0.0.1:1935/live/mystream

HTTP_FLV

推流地址是 rtmp://127.0.0.1:1935/live/ +密钥（例如mystream）

拉流地址 http://127.0.0.1:80/live?port=1935&app=live&stream=mystream

HLS使用http协议，兼容所有浏览器。延时非常大，不太适合实时视频源，适合文件点播或历史录像直播

http://127.0.0.1:80/live/mystream.m3u8

延迟太大

4.启动

启动:/usr/local/nginx/sbin/nginx

停止:/usr/local/nginx/sbin/nginx -s stop

修改后重启:sudo /usr/local/nginx/sbin/nginx -s reload

检查:ps aux | grep nginx

出现类似如下信息表示启动成功

nginx: [b][color=red]master[/color][/b] process ./nginx

nginx: worker process

master是主进程，关闭的时候kill这个进程，其他子进程会自动关掉

打开浏览器http://localhost/即可看到nginx的默认欢迎页

nginx默认是用80端口，我们可以在nginx安装目录下的conf/nginx.conf文件中更改

推流工具测试

ffmpeg

ffmpeg -re -i /dev/video0 -vcodec h264 -f flv rtmp://127.0.0.1:1935/live/mystream //可以将/dev/video0改为本地视频测试

obs

1.单击界面中来源窗口的加号，视频捕获设备，在设备中选择摄像头，作为推流输入

2.单击设置，流，输入地址和流名称

地址：rtmp://127.0.0.1:1935/live，流名称:mystream

3.单击开始推流

拉流测试,延迟7-8秒

ffplay:RTMP拉流

ffplay rtmp://127.0.0.1:1935/live/mystream -fflags nobuffer

vlc:RTMP,HTTP-FLV拉流

rtmp://127.0.0.1:1935/live/mystream

http://127.0.0.1:80/live?port=1935&app=live&stream=mystream

H5:http-flv拉流

http://127.0.0.1/live?port=1935&app=live&stream=mystream

H5.html

<!DOCTYPE html>
<html>

<head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <title>flv.js demo</title>
    <style>
        .mainContainer {
            display: block;
            width: 1024px;
            margin-left: auto;
            margin-right: auto;
        }

        .urlInput {
            display: block;
            width: 100%;
            margin-left: auto;
            margin-right: auto;
            margin-top: 8px;
            margin-bottom: 8px;
        }

        .centeredVideo {
            display: block;
            width: 100%;
            height: 576px;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: auto;
        }

        .controls {
            display: block;
            width: 100%;
            text-align: center;
            margin-left: auto;
            margin-right: auto;
        }
    </style>
</head>

<body>

<p class="mainContainer">
    <video name="videoElement" id="videoElement" class="centeredVideo" controls muted autoplay width="1024"
           height="576">
        Your browser is too old which doesn't support HTML5 video.
    </video>
</p>

<script src="js/flv.min.js"></script>

<script>

    function start() {
        if (flvjs.isSupported()) {
            var videoElement = document.getElementById('videoElement');
            var flvPlayer = flvjs.createPlayer({
                type: 'flv',
                url: 'http://127.0.0.1/live?port=1935&app=live&stream=mystream'
            });
            flvPlayer.attachMediaElement(videoElement);
            flvPlayer.load();
            flvPlayer.play();
        }
    }

    document.addEventListener('DOMContentLoaded', function () {
        start();
    });
</script>

</body>

</html>

同级创建js文件夹，存放文件flv.min.js

手机端安卓拉流

http://127.0.0.1/live?port=1935&app=live&stream=mystream