Требуется некоторая техническая установка

Личные записи относятся ко многим статьям

Системная среда: win10

Сначала установите адрес ffmpeg: ffmpeg

Выберите для загрузки win linux в соответствии с вашей системой

После загрузки разархивируйте его в каталог, который вы хотите установить, а затем откройте переменную среды конфигурации системы.

Откройте окно cmd и введите ffmpeg –version, чтобы отобразить номер версии ниже, что означает, что установка прошла успешно.

Установите адрес nginx с rtmp:nginx-rtmp-module

Откройте nginx.conf в разделе conf для настройки Вот содержимое моего файла конфигурации

#user  nobody;
worker_processes  1;
 
#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;
 
#pid        logs/nginx.pid;
 
 
events {
    worker_connections  1024;
}
rtmp {
 
    server {
 
        listen 1935; 
 
        chunk_size 4000;
 
        # TV mode: one publisher, many subscribers
        application mylive {
 
            # enable live streaming
            live on;
 
        }
    }
}
 
http {
    include       mime.types;
    default_type  application/octet-stream;
 
    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';
 
    #access_log  logs/access.log  main;
 
    sendfile        on;
    #tcp_nopush     on;
 
    #keepalive_timeout  0;
    keepalive_timeout  65;
 
    #gzip  on;
 
    server {
        listen       20000;
        server_name  localhost;
 
        #charset koi8-r;
 
        #access_log  logs/host.access.log  main;
 
        location / {
            root   html;
            index  index.html index.htm;
        }
 
        #error_page  404              /404.html;
 
        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
 

 
}

Вот параметры, которые нужно использовать позже

Установите адрес nginx-http-flv-module:nginx-http-flv-module

Преобразуйте потоковое видео RTMP на предыдущем шаге в поток http-flv через сервер и преобразуйте его в формат, который может использоваться веб-стороной (поскольку хром запрещает Flash, RTMP не может воспроизводиться напрямую)

worker_processes  1;

events {
    worker_connections  1024;
}

rtmp {
    server {
        listen 1985;

        application myapp {
            live on;
        }
    }
}

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

    sendfile        on;

    keepalive_timeout  65;


    server {
        listen       80;
        server_name  localhost;

        location / {
            add_header 'Access-Control-Allow-Origin' '*';
            root html;
            index  index.html index.htm;
        }

        location /live {
            flv_live on;
        }

        location /flv {
            add_header 'Access-Control-Allow-Origin' '*';
            flv_live on;
            chunked_transfer_encoding on;
        }
        
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

Первый шаг — открыть два nginx

Дважды щелкните файл nginx-rtmp.exe (rtmp nginx).

Дважды щелкните Nginx.exe (FLV Nginx)

Диспетчер задач показывает четыре процесса на рисунке

Шаг 2 Откройте два окна cmd

Этот шаг заключается в преобразовании необработанных данных камеры rtsp в формат rtmp через nginx (admin:XXXXXX@192.168.XXX.XXX) обычно относится к адресу камеры (это определяется в соответствии с камерой производителя). Следующее: 1935/mylive/test2 соответствует локальному адресу в конфигурации nginx.

ffmpeg -i "rtsp://admin:XXXXXX@192.168.XXX.XXX"  -vcodec copy -acodec copy -f flv "rtmp://192.168.200.225:1935/mylive/test2"

После ввода этой строки инструкций в cmd следующее означает успешное выполнение.

В настоящее время нам нужно использовать nginx-http-flv-module для передачи потока rtmp в поток http-flv.

Во втором окне cmd введите

rtmp://192.168.200.225:1935/mylive/test2 — это адрес, отправленный последним cmd

rtmp://192.168.200.225:1985/myapp/testv — переданный адрес

ffmpeg -re -i rtmp://192.168.200.225:1935/mylive/test2 -c copy -f flv rtmp://192.168.200.225:1985/myapp/testv

После ввода этой строки инструкций в cmd появляется следующее сообщение, указывающее на успех

После завершения настройки, где myapp и testv представляют nginx, имя порта, которое вы настроили, является номером порта, настроенным nginx.

Вот http-flv адрес трансляции

http://xx.xxx.xx.xx/live?port=1985&app=myapp&stream=testv // 原始转播地址
http://xx.xxx.xx.xx/flv?port=1985&app=myapp&stream=testv // flv 转播地址

Здесь вы можете использовать веб-сторону для доступа, но вам нужен FLV Bilibili для разбора

Я использую vue + flv.js здесь

Сначала введите flv.js в проект

<template>
  <div>
    <video autoplay controls width="100%" height="500" id="myVideo"></video>
  </div>
</template>

<script>
import flvjs from "flv.js";

export default {
  props: {
    msg: String,
  },
  mounted() {
    this.$nextTick(() => {
      this.videoPlayer();
    });
  },
  methods: {
    videoPlayer() {
      if (flvjs.isSupported()) {
        var videoElement = document.getElementById("myVideo");
        var flvPlayer = flvjs.createPlayer({
          type: "flv",
          url: "http://192.168.200.225/flv?port=1985&app=myapp&stream=testv", //你的url地址
        });
        flvPlayer.attachMediaElement(videoElement);
        flvPlayer.load();
        flvPlayer.play();
      }
    },
  },
};
</script>

Затем откройте веб-страницу, вы можете получить содержимое камеры

я просто бездельничаю здесь

Проблемы с задержкой камеры все еще требуют решения

И два nginx не нужно открывать одновременно и их можно настроить вместе.Я надеюсь, что большие ребята могут дать мне некоторые идеи.Я продолжу оптимизировать его позже.