Видео с камеры наблюдения на сайте бесплатно и без смс

в 9:18, , рубрики: ffmpeg, HLS, html5, nginx, RSTP, браузеры, видеонаблюдение, видеонаблюдение через интернет, потоковое видео

Появилась необходимость показывать видео с камеры на сайте в режиме онлайн. Виделось несколько вариантов (дополню вариантами из комментов, если будут):

  • Дать доступ к камере. Просто доступ к камере давать не стоит по соображениям безопасности. Камера ляжет уже при очень небольшой нагрузке.
  • Коммерческая услуга. Мы им доступ к камере и деньги, они нам ссылку для размещения на сайте. Они же решают проблему совместимости камеры и браузеров пользователей, производительности канала и доступности
  • На своих мощностях. Между пользователем и камерой ставится нечто, что отвечает за совместимость с браузерами, производительность и доступность. Проблемы решаем сами.

Этот вариант рассмотрим ниже. Т.к. "flash умер" или "flash вот-вот умрет", вариант с размещением flash плейера на сайте не рассматривался. Тернистый путь поисков решений в интернетах не привел к готовому решению. Пришлось изобрести велосипед.

Подробнее изобретения под катом.

Описание полученного велосипеда подробнее:

  • камера видеонаблюдения отдает поток по протоколу rtsp.
  • ffmpeg берет видео поток с камеры и создает видео для показа через тег video стандарта html5.
  • nginx отдает созданные файлы пользователям
  • видео на странице показываем с помощью hls, точнее вот эта реализация

Подробнее о настройках

На каждый поток с камеры надо запустить ffmpeg для преобразования rtsp в файлы который поймет hls.

ffmpeg и поток со звуком

/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

Как работает:

Берем поток, без перекодирования создаем файлы и список для воспроизведения в папке /tmp/www/.

nginx

Сокращаем стандартный для пакета debian файл default до, например, такого:

/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;
        }
}

Пример страницы с видео:

/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>

Скрипт стоит разместить локально, он не имеет внешних зависимостей. Подробнее о настройках hls.

Как работает:

на странице подключается hls и воспроизводит файлы из списка index1.m3u8. Список и файлы обновляются ffmpeg.

Что получилось:

  • Работает;
  • Самую большую нагрузку создает ffmpeg, на процессоре Atom трехлетней давности;
    • Разрешение камеры HD без звука — 1%;
    • Разрешение камеры HD со звуком — 5%;

  • Количество процессов nginx — смотреть по нагрузке и доступному каналу. Нагрузку на процессор увидеть не удалось — не очень много надо на просто отдачу небольших файлов.;
  • Сервер с 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
  • Смотреть можно на десктопах и мобильных устройствах с современными браузерами;
  • В обозримом будущем не потребует вмешательства.

Ссылки:

» Реализация hls
» Демо работы hls
» ffmpeg
» nginx
» Дополненный и расширенный текст статьи на моём блоге

Автор: ErshoFF

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js