nginx+ffmpeg实现海康rtsp转换为前端video播放http-flv

作者前言：近期由于硬性需求，把海康的rtsp转换为前端可播放的视频流格式，寻了好多文章不详细，不准确，不负责，还有一些写的很详细的不知为何偏偏就不能成功访问，通过整整一天时间的整理最终达到预想的结果，下面我做了一些整理，服务器是windows server如果不是那么跳过。两个步骤：第一步需要nginx注意这里是带nginx-http-flv-module模块需要整合（已上传）。第二步需要ffmp

猿人南瓜皮

3331人浏览 · 2021-07-12 18:29:54

猿人南瓜皮 · 2021-07-12 18:29:54 发布

作者前言：近期由于硬性需求，把海康的rtsp转换为前端可播放的视频流格式，寻了好多文章不详细，不准确，不负责，还有一些写的很详细的不知为何偏偏就不能成功访问，通过整整一天时间的整理最终达到预想的结果，下面我做了一些整理，服务器是windows server如果不是那么跳过。

两个步骤：

第一步需要nginx注意这里是带nginx-http-flv-module模块需要整合（已上传）。

https://download.csdn.net/download/weixin_39917985/20221113

第二步需要ffmpeg，这个东西下载比较慢，下载完配置环境。

详细

一、nginx起到的作用是监听ffmpeg转换的rtmp格式流媒体，所以这个必须要先启动，整合好的资源已上传，解压就可以用，下面是nginx.conf全部内容

worker_processes  1;
events {
    worker_connections  1024;
}
# 添加RTMP服务
rtmp {
    server {
        listen 1935; # 监听端口

       #chunk_size 4000;
        application live {
            live on;
			gop_cache on;
        }

    }
}
# HTTP服务
http {
    include       mime.types;
    default_type  application/octet-stream;

    #access_log  logs/access.log  main;

    server {
        listen       8899; # 监听端口
        server_name	 localhost;
		
		location /live {
			flv_live on;
            chunked_transfer_encoding  on; #open 'Transfer-Encoding: chunked' response
			add_header 'Access-Control-Allow-Credentials' 'true'; #add additional HTTP     
            header
			add_header 'Access-Control-Allow-Origin' '*'; #add additional HTTP header
			add_header Access-Control-Allow-Headers X-Requested-With;
			add_header Access-Control-Allow-Methods GET,POST,OPTIONS;
			add_header 'Cache-Control' 'no-cache';
        }
    }
}

二、ffmpeg的下载以及环境变量设置

官网：http://www.ffmpeg.org/download.html

1：如图选择windows版本的，点第一个

2：如图直接点击链接就能下载

3：解压以及环境变量

4：配置好后CMD（命令与提示符）

输入：ffmpeg -version 后会出现如图所示就成功了

如果提示不是内部命令或外部命令，就是环境变量没弄好，如果你的系统变量不是我这样的，是一条输入框的话，那path里面的这个分号"；"可能是你忘加了（添加路径前后都要加分号）

三、下面直接在这个命令与提示符框内输入你要转换的命令

ffmpeg -re -rtsp_transport tcp -i “rtsp://xxxx/Streaming/Channels/101?transportmode=multicast” -f flv -vcodec libx264 -vprofile baseline -acodec aac -ar 44100 -strict -2 -ac 1 -f flv -s 1280x720 -q 10 “rtmp://localhost:1935/live/mystream”

注意：命令中双引号内rtsp://你的视频地址，后面双引号内rtmp://是你要转换的rtmp地址，请注意端口号和你设置的路径名要对应nginx里你监听的端口号以及路径名；

还有最重要的一个情况，有很多教程命令都是粘贴过来的，在你这无法使用，是大多数无法推流成功，这里要明确命令是否正确，判断成功的图如下。

成功的图示

如果出现如图所示的错误问题是nginx导致的，你要检查好nginx是否启动，nginx的配置路径，以及服务器是否开启了端口等问题。

三、测试以及调用

1：用vlc测试一下可否可以播放视频

2：前端调用

这里是我随意档的一个html，你们也可以试一试

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>播放页面</title>
    </head>
    <body>
        <script src="https://cdn.bootcdn.net/ajax/libs/flv.js/1.5.0/flv.min.js"></script>
        <video style="height: 400px;width: 600px;" id="videoElement" muted autoplay controls></video>
        <script>
            var flvPlayer = null;
            if (flvjs.isSupported()) {
                var videoElement = document.getElementById('videoElement');
                flvPlayer = flvjs.createPlayer({
                    type: 'flv',                 
                    url: 'http://localhost:8899/live?port=1935&app=live&stream=mystream'
                });
                flvPlayer.attachMediaElement(videoElement);
                flvPlayer.load();
            }
        </script>
    </body>
</html>

最后：如果你真的完全按照我的教程以及也正确的使用了我的nginx包与config配置还是无法转流成功，那么请重启电脑再试，再见