ffmpeg推流摄像头，web实现-CFANZ编程社区

使用 FFmpeg 向 Nginx 服务器推流 FLV 格式，并通过 Nginx 的 http-flv 模块实现在网页上直播播放，是一种广泛应用于低延迟直播场景的方法。以下是这一过程的基本步骤：

1. 安装和配置 Nginx HTTP-FLV 模块

安装 Nginx：首先确保 Nginx 已安装。如果还没有安装，可以通过包管理器（如 apt 或 yum）或手动编译安装。
安装 nginx-http-flv-module：这是一个第三方模块，允许 Nginx 直接通过HTTP协议提供FLV格式的流。你可以从GitHub或其他可靠来源下载此模块，并在编译Nginx时通过--add-module参数添加。
配置 Nginx：在 Nginx 的配置文件中（如 /etc/nginx/nginx.conf），添加 HTTP-FLV 相关的配置。一个基本的配置示例如下：

worker_processes  1;

events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;

    keepalive_timeout  65;

    #gzip  on;

    server {
		listen       81;
		server_name  localhost;

		#charset koi8-r;

		#access_log  logs/host.access.log  main;

		location / {
		    root   html;
		    index  index.html index.htm;
		}
		
      location /live {
            flv_live on;
            #flv_buffer 5s;
            chunked_transfer_encoding on;
            add_header 'Access-Control-Allow-Origin' '*';
       }
      
    }

}


rtmp {
    out_queue                4096;
    out_cork                   8;
    max_streams            128; #Nginx能接受的最大的推流数
    timeout                    15s;
    drop_idle_publisher 15s;

    log_interval 5s; 
    log_size     1m; 

    server {
        listen 1935; #Nginx监听的RTMP推流/拉流端口，可以省略，默认监听1935
        server_name 127.0.0.1;

        application myapp {
            live on; #当推流时，RTMP路径中的APP（RTMP中一个概念）匹配myapp时，开启直播
            record off; #不记录视频
            gop_cache on;  #开启GOP（Group of Picture）缓存，播放器解码时，收到一个完整的GOP才会开始播放，这个是减少播放延迟的选项
        }
    }
}

这里，/live 是你将用来访问直播流的URL路径，flv_live on 启用了HTTP-FLV直播功能，flv_buffer 设置了缓冲区大小，chunked_transfer_encoding on 启用了分块传输编码，有助于适应不同网络条件。

2. 使用 FFmpeg 推流

安装 FFmpeg：确保你的系统中已安装 FFmpeg，这是用于音视频处理和流媒体推流的强大工具。
推流命令：使用 FFmpeg 将本地视频文件或实时摄像头输入推送到 Nginx。一个典型的推流命令如下：

ffmpeg -re -i input.mp4 -c copy -f flv rtmp://127.0.0.1:1935/live/stream_key

或者，如果推流来自摄像头：

ffmpeg -f v4l2 -i /dev/video0 -c:v libx264 -preset veryfast -b:v 1000k -c:a aac -ar 44100 -ac 2 -b:a 128k -f flv rtmp://your_server_ip:1935/live/stream_key

这里，input.mp4 是你要推流的视频文件，/dev/video0 可能是一个摄像头设备，stream_key 是你自己设定的一个标识符，用于区分不同的直播频道。

3. 在网页上播放

要在网页上播放这个FLV流，你可以使用像 flv.js 这样的JavaScript库。首先，将 flv.js 库添加到你的网页项目中，然后使用如下JavaScript代码初始化播放器：

<!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="https://cdn.jsdelivr.net/npm/flv.js@latest/dist/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:81/live?port=1935&app=myapp&stream=stream_key'
          });
        flvPlayer.attachMediaElement(videoElement);
        flvPlayer.load();
        flvPlayer.play();
      }
    }

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

</body>

</html>

这样，用户就可以在支持的浏览器中直接观看直播视频了。记得将 http://your_server_ip:8080/live/stream_key.flv替换成你的实际流地址。