Оглавление

Видеотрансляция с камер на сайт: высокотехнологичное решение

Задача

Необходимо было организовать трансляцию видео с камер наблюдения на сайт. Камеры передают видеопоток в формате RTSP, и требовалось вывести этот поток на веб-страницу в формате HLS для удобства пользователей. Основные требования — стабильное воспроизведение и масштабируемость системы для большого количества пользователей.

Подход к решению

Для решения этой задачи была выбрана архитектура с использованием контейнеров и современных средств обработки видеопотоков.

Создание Docker контейнера с FFmpeg

Первым этапом стало создание Docker-контейнера для обработки видеопотоков. Внутри контейнера использовался FFmpeg для преобразования видеопотока с камер в формате RTSP в RTMP. Это решение позволило централизовать обработку видеопотоков и избежать необходимости установки сложного ПО на сервер. Контейнеризация сделала систему легкой в управлении и масштабируемой.

Настройка MediaMTX

MediaMTX (Media Transfer eXchange) — это мощный инструмент для обработки видеопотоков. Он был настроен для приёма RTMP-потока от FFmpeg и конвертации его в HLS формат, который является стандартом для стриминга в веб-браузерах. Этот подход обеспечил простую интеграцию с браузерами и различными устройствами, поскольку HLS поддерживается большинством современных плееров.

Вывод видеопотока на веб-страницу

Для того чтобы пользователи могли просматривать видеопотоки на сайте, был использован видеоплеер Bradmax Player. Этот плеер поддерживает HLS и легко интегрируется с веб-страницами через M3U8 плейлисты, что сделало его идеальным выбором для воспроизведения видеопотоков на различных устройствах, включая десктопы и мобильные устройства.

Пошаговая реализация

Запуск Docker контейнера

Первым шагом была настройка и запуск Docker-контейнера для обработки видеопотоков. Использовался готовый образ alekseykrivoshein/mediamtx-rtsp с Docker Hub, который включал все необходимые инструменты для конвертации RTSP в RTMP.

Команды для запуска контейнера:

docker pull alekseykrivoshein/mediamtx-rtsp
docker run -d --name=ffmpeg-rtsp-to-rtmp alekseykrivoshein/mediamtx-rtsp

Эти команды загружают и запускают контейнер, который конвертирует RTSP потоки с камер в RTMP поток для дальнейшей обработки.

Настройка MediaMTX

Следующим шагом стала настройка MediaMTX для приёма и обработки RTMP потока. MediaMTX был настроен таким образом, чтобы принимать поток из Docker-контейнера, конвертировать его в HLS, и затем предоставить готовый HLS поток через M3U8 плейлист.

Конфигурация MediaMTX включала следующие ключевые параметры:

  • Настройка RTMP входа для получения видеопотоков.
  • Настройка HLS выхода для преобразования видеопотока в формат, поддерживаемый браузерами.

Интеграция HLS на веб-страницу

После того как видеопоток был преобразован в HLS, необходимо было вывести его на веб-страницу. Для этого использовался Bradmax Player, который был интегрирован через стандартный HTML-код. Пример кода для интеграции видеопотока:

<video id="videoPlayer" controls>
   <source src="https://yourserver.com/path/to/playlist.m3u8" type="application/x-mpegURL">
</video>

Этот код обеспечивает воспроизведение видеопотока на странице с использованием HLS, что позволяет пользователям просматривать видео в режиме реального времени.

Результаты

В результате была создана система, которая позволяет транслировать видеопотоки с камер наблюдения на веб-страницу в формате HLS. Это решение обеспечило:

  • Стабильное и качественное воспроизведение видеопотоков.
  • Лёгкость управления видеопотоками благодаря использованию контейнеров.
  • Масштабируемость и возможность дальнейшего расширения системы.

Использование Docker-контейнера с FFmpeg и MediaMTX позволило упростить процесс обработки и трансляции видеопотоков, сделав систему гибкой и готовой к дальнейшему развитию.

Демо