Geekly articles weekly

Video de la cámara de vigilancia en el sitio de forma gratuita y sin SMS

Era necesario mostrar el video de la cámara en el sitio en línea. Vi varias opciones (complementaré las opciones de los comentarios, si las hay):

  • Dar acceso a la cámara. Simplemente dar acceso a la cámara no vale la pena por razones de seguridad. La cámara ya se acostará con una carga muy pequeña.
  • Servicio comercial Les damos acceso a la cámara y dinero, nos dan un enlace para publicar en el sitio. Resuelven el problema de la compatibilidad de la cámara y el navegador del usuario, el rendimiento del canal y la disponibilidad.
  • En sus instalaciones. Entre el usuario y la cámara, se coloca algo que es responsable de la compatibilidad, el rendimiento y la accesibilidad del navegador. Resolvemos los problemas nosotros mismos.

Consideraremos esta opción a continuación. Porque " flash murió " o " flash está a punto de morir " , no se consideró la opción de colocar un reproductor flash en un sitio. El camino espinoso de encontrar soluciones en Internet no ha llevado a una solución llave en mano. Tuve que inventar una bicicleta.

Más inventos bajo cat.

Descripción de la bicicleta resultante con más detalle:


  • La cámara CCTV se transmite a través del protocolo rtsp .
  • ffmpeg toma una transmisión de video de la cámara y crea un video para mostrar a través de la etiqueta de video del estándar html5 .
  • nginx entrega archivos creados a los usuarios
  • mostrar el video en la página usando hls , más precisamente, esta implementación

Más acerca de la configuración


En cada transmisión desde la cámara, debe ejecutar ffmpeg para convertir rtsp a archivos que hls entienda .

ffmpeg y transmite con sonido


/usr/bin/ffmpeg \
  -i  rtsp://<     ONVIF Device Manager>  \
  -ar 44100 \
  -acodec aac -ac 1 -strict -2 -crf 18 \
  -c:v copy -preset ultrafast \
  -flags -global_header \
  -fflags flush_packets -tune zerolatency \
-hls_time 1 -hls_list_size 3 -hls_wrap 4 -hls_flags delete_segments -start_number 0 \
  /tmp/www/index1.m3u8
ffmpeg al inicio escribe 25 fps en FullHD
Guessed Channel Layout for  Input Stream #0.1 : mono
Input #0, rtsp, from 'rtsp://192.168.X.X:554/user=admin_password=tlJwpbo6_channel=1_stream=0.sdp?':
  Metadata:
    title           : RTSP Session
  Duration: N/A, start: 0.000000, bitrate: N/A
    Stream #0:0: Video: h264 (Baseline), yuv420p, 1920x1080, 25 fps, 9 tbr, 90k tbn, 50 tbc
    Stream #0:1: Audio: pcm_alaw, 8000 Hz, 1 channels, s16, 64 kb/s
Output #0, hls, to '/tmp/www/index1.m3u8':
  Metadata:
    title           : RTSP Session
    encoder         : Lavf56.25.101
    Stream #0:0: Video: h264, yuv420p, 1920x1080, q=2-31, 25 fps, 9 tbr, 90k tbn, 25 tbc
    Stream #0:1: Audio: aac, 44100 Hz, mono, fltp, 128 kb/s
    Metadata:
      encoder         : Lavc56.26.100 aac
Stream mapping:
  Stream #0:0 -> #0:0 (copy)
  Stream #0:1 -> #0:1 (pcm_alaw (native) -> aac (native))
, .
noname.

Cómo funciona


Tomamos una secuencia, sin transcodificación, creamos archivos y una lista para reproducir en la carpeta / tmp / www / .

nginx


Acortamos el archivo predeterminado para el paquete debian a, por ejemplo, esto:

/ etc / nginx / sites-enabled / default
server {
        listen 80 default_server;
        listen [::]:80 default_server;
        access_log off;
        error_log /dev/null;
        root /tmp/www;
        index index.html;
        server_name _;
        location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                try_files $uri $uri/ =404;
        }
}

Ejemplo de página con video:

/tmp/www/index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/hls.js/latest/hls.min.js"></script>
<video id="video"></video>
<script>
  if(Hls.isSupported()) {
    var video = document.getElementById('video');
    var hls = new Hls();
    hls.loadSource('/index1.m3u8');
    hls.attachMedia(video);
    hls.on(Hls.Events.MANIFEST_PARSED,function() {
      video.play();
  });
 }
</script>

El script debe colocarse localmente, no tiene dependencias externas. Obtenga más información sobre la configuración de hls .

Cómo funciona


hls está conectado en la página y reproduce archivos de la lista index1.m3u8. La lista y los archivos son actualizados por ffmpeg.

Que paso:


  • Funciona
  • La mayor carga es ffmpeg, en un procesador Atom hace tres años;
    • Resolución de la cámara Full HD sin sonido - 1%;
    • Resolución de la cámara Full HD con sonido: 5%;

  • Número de procesos nginx: ver por carga y canal disponible. No pudimos ver la carga en el procesador; no se necesita mucho para simplemente cargar archivos pequeños.
  • ffmpeg nginx , ;
  • ( ) . 10 ;
  • tmpfs, ;
  • . FROM debian:jessie;
  • ffmpeg , .

    top :
    top - 11:05:20 up 6 days, 12:15,  0 users,  load average: 1.29, 1.09, 1.03
Tasks:  17 total,   1 running,  16 sleeping,   0 stopped,   0 zombie
%Cpu(s): 38.8 us,  1.0 sy,  0.0 ni, 59.6 id,  0.0 wa,  0.0 hi,  0.5 si,  0.0 st
KiB Mem:  16359132 total, 16027988 used,   331144 free,   782968 buffers
KiB Swap:  6369276 total,     3776 used,  6365500 free. 12784916 cached Mem

  PID USER      PR  NI    VIRT    RES    SHR S  %CPU %MEM     TIME+ COMMAND
  281 root      20   0  341040  29192  19632 S   4.7  0.2  10:08.39 ffmpeg
   16 root      20   0  315888  27944  18984 S   1.0  0.2   2:50.95 ffmpeg
    9 root      20   0   46916  15128   6408 S   0.3  0.1   0:58.04 supervisord
  • ;
  • .

:


» Implementación de hls
» Demo de hls
» ffmpeg
» nginx
» El texto expandido y expandido del artículo en mi blog

Source: https://habr.com/ru/post/es401107/

More articles:


All Articles