В разных ветках повстречал похожие коменты с проблемой показа RTSP потоков с IP камер. И да, браузеры не поддерживают показ стрима в rtsp формате. то есть мы должны сначала такой поток перекодировать в какой-нибудь удобоваримый для браузеров стримовый формат и дальше запереть в какой-нибудь player, куда и выведем поток видео с камеры или нескольких камер
Возможно кому-то пригодится.
1. Самой популярной библиотекой на сегодня для того, чтобы издеваться над медиа ) имеем ffmpeg разберемся с ним.
Хочется сразу отметить что если ffmpeg по умолчанию не был включен в официальную сборку ос установленной на вашей машине, как например в моем случае rasbian (raspberry Pi4), то простая установка с автоматической сборкой как под это бывает под другие архитектуры - вероятно, и даже скорее всего у вас не будет работать.
То есть как бы это ни было печально, но для нас не прокатит просто выполнить вот эту заветную команду
Нам нужно собрать все это хозяйство вручную, что мы и сделаем.
Процедуру сборки FFMPEG опускаем в конец поста
2. Будем считать, что наш FFmpeg жив здоров и готов к работе .
Переходим к нашему стриму. Цель - вывести в браузер в обычном проигрывателе потоки с наших камер.
Если бы я был не новым юзером MD, то логично бы было набросать модуль который бы все сам сделал, а может и не логично.
Поэтому соорудим простую страничку HTML5 и включим ее в ваш md проект или просто вставим готовый код уже куда угодно инструментами md
а) Нам нужно забрать поток с IP камеры и передать его уже в другом формате в браузер.
Если бы мы решили RTSP поток перекодировать на лету - мы бы забрали на это действо все или почти все ресурсы нашей машины. Поэтому мы этого делать не будем, а будем на лету его копировать , делить его на сегменты плейлиста и отдавать плееру уже готовый playlist в формате m3u8, который прекрасно будет проигрываться в браузере
Для этого нам подойдет такая команда )
Код: Выделить всё
ffmpeg -use_wallclock_as_timestamps 1 -v info -i rtsp://admin:*****@192.168.1.123:554/live/ch00_1 -c:v copy -c:a copy -strftime 1 -bufsize 1835k -pix_fmt yuv420p -flags -global_header -reset_timestamps 1 -start_number 1 /var/www/html/cms/html/streamplayer/camera1.m3u8
возможно вам нужно запускать это все от пользователя root, тогда добавим перед ffmpeg sudo. Будет
Код: Выделить всё
sudo ffmpeg -use_wallclock_as_timestamps ....
# Вам надо заменить в этом моем запросе на соответствующие своей камере следующие части
rtsp://admin:*****@192.168.1.123:554/live/ch00_1
Здесь укажите адрес RTSP потока вашей камеры с юзером и паролем. Для моей он такой - у вас другой. Адреса и порты для разных камер можно поискать например здесь :
https://demr.ru/url-adresa-rtsp-i-porty ... telej.html
# замените
/var/www/html/cms/html/streamplayer/camera1.m3u8
укажите путь к папке( создайте папку где вам удобно (она у меня называется streamplayer - в нее же мы позже положим свой html файл с плеером). В эту же папку FFmpeg автоматически создаст и положит файл плейлиста для вашей камеры "camera1.m3u8" (можете назвать по-своему). Туда же будут лететь сегменты, на которые он будет делить поток во время копирования
Команду можно обернуть в php и поместить в сценарии,( если не хотите, чтобы процесс копирования потока работал 24/7 , а запускать и останавливать его кнопкой под плеером, когда вы пришли на него полюбоваться ( про нагрузку от работы FFmpeg чуть ниже - она реально незаметна ) . Можно использовать его при перезапуске, чтобы не умирал после перезагрузки машины ваш стрим и тп
создадим сценарий например: streamConverter
Код: Выделить всё
$CommandCamera1 = 'ffmpeg -use_wallclock_as_timestamps 1 -v info -i rtsp://admin:password@192.168.1.123:554/live/ch00_1 -c:v copy -c:a copy -strftime 1 -bufsize 1835k -pix_fmt yuv420p -flags -global_header -reset_timestamps 1 -start_number 1 /var/www/html/cms/html/streamplayer/camera1.m3u8';
shell_exec($CommandCamera1);
и навесим его на какие-нибудь кнопки или используем куда-нибудь еще.
возможно вам нужно запускать это все от пользователя root, тогда добавим перед ffmpeg sudo. Будет
Код: Выделить всё
$CommandCamera1 = 'sudo ffmpeg -use_wallclock_as_timestamps 1 ....
С запуском нашего стрима разобрались, теперь нам нужен плеер ( возможно он есть в готовых модулях MD) - пусть будет альтернатива еще одна :
Мне нравится Video.js - его и используем.
Есть два варианта - ничего не ставим на сервере , а берем и встраиваем нужные нам файлы с удалённых серверов, либо для гурманов можем поставить необходимое самостоятельно к себе .
Вариант с чужими серверами :
Создадим в папке, в которую попадает наш готовый файл плейлиста camera1.m3u8 новый файл index.html и скопируем в него следующий код
Код: Выделить всё
<!DOCTYPE html>
<html>
<head>
<link href="https://vjs.zencdn.net/7.20.1/video-js.css" rel="stylesheet" />
</head>
<body>
<video
id="my-video"
class="video-js"
controls
preload="auto"
height = "270"
width = "480"
poster="tv.jpg"
data-setup="{}"
>
<source src="http://192.168.1.188/cms/html/streamplayer/camera1.m3u8" type="application/x-mpegURL">
<p class="vjs-no-js">
Обновите браузер до версии
<a href="https://videojs.com/html5-video-support/" target="_blank">которая поддержвает HTML5 video</a>
</p>
</video>
<script src="https://vjs.zencdn.net/7.20.1/video.min.js"></script>
</body>
Нужно в коде заменить на свой адрес, где лежит ваш плейлист . Тот , что мы указали в коде командной строки
у меня он такой
Код: Выделить всё
http://192.168.1.188/cms/html/streamplayer/camera1.m3u8"
Дальше можно изменить настройки размеров окна проигрывателя
и нужно забросить картинку в ту же папку. Эта картинка будет заглушкой перед тем как вы нажмете в плеере кнопку play.Укажите название файла вот здесь :
Плеер имеет множество настроек и скинов - можете экспериментировать - читайте здесь :
https://videojs.com/guides
Для тех, кто хочет вместо этого поставить Video.js себе . Действуем через npm
С плеером завершаем.
Сохраним файл index.html в папку , которую вы выбрали для него
Теперь запустим поток конвертации из командной строки либо из сценария , который вы создали :
идем в терминал и запускаем
либо под рутом
Код: Выделить всё
sudo ffmpeg -use_wallclock_as_timestamps 1 -v info -i rtsp://admin:*****@192.168.1.123:554/live/ch00_1 -c:v copy -c:a copy -strftime 1 -bufsize 1835k -pix_fmt yuv420p -flags -global_header -reset_timestamps 1 -start_number 1 /var/www/html/cms/html/streamplayer/camera1.m3u8
либо под собой
Код: Выделить всё
ffmpeg -use_wallclock_as_timestamps 1 -v info -i rtsp://admin:*****@192.168.1.123:554/live/ch00_1 -c:v copy -c:a copy -strftime 1 -bufsize 1835k -pix_fmt yuv420p -flags -global_header -reset_timestamps 1 -start_number 1 /var/www/html/cms/html/streamplayer/camera1.m3u8
После запуска в нашей папке с плеером начинают накапливаться сегменты, из которых собирается плейлист стрима. Это файлы по 200-500Кб
- Screenshot 07-23-2022 16.42.56.png (97.85 КБ) 1225 просмотров
Чтобы их не накопилось слишком много, сделаем какой-нибудь сценарий, который по крону запускаем например раз день ну или как часто надо.
назовем его cleanStreamFiles
Пишем что-то типа такого в сценарии
Код: Выделить всё
$dir = ROOT."cms/html/streamplayer/";
foreach (glob($dir."*.ts") as $file) {
if (filemtime($file) < time() - 1*1*60*60) {
@unlink($file);
}
}
заменим
cms/html/streamplayer/
на путь к своей папке
И переходим на страничку с плеером, либо туда, куда вы встроили плеер. Любуемся красотами )
у меня дачная камера показывает вот так
- Screenshot 07-23-2022 16.13.07.png (401.16 КБ) 1225 просмотров
О нагрузках. Все это вертится у меня на Raspberry Pi4 8Gb
Специально запустил два потока . Как видно сервер не замечает их присутствия
- Screenshot 07-23-2022 16.32.13.png (108.71 КБ) 1225 просмотров
--------------------
ДЛЯ ТЕХ КОМУ НУЖНО. Возвращаясь к самому первому пункту
---- собираем FFMPEG
Итак нам понадобятся для сборки как минимум библиотеки кодеков AAC, MP3 и H264.
Обычно для установки чего либо, требуются права root. Для того, чтобы не вводить каждый раз sudo – сделаем это один раз
Для работы со звуком ставим ALSA headers и соответствующие библиотеки
Код: Выделить всё
apt-get update
apt-get install libasound2-dev
после установки ALSA headers расположатся в /usr/include/alsa, а библиотеки в /usr/lib/arm-linux-gnueabihf
На всякий случай собираем YASM - assembler для H264 и ffmpeg
# скачиваем yasm
Код: Выделить всё
wget http://www.tortall.net/projects/yasm/releases/yasm-1.3.0.tar.gz
# распаковываем
# заходим в папку с yasm
# запускаем конфигуратор
# компилируем с использованием всех 4-х ядер процессора - параметр -j4 (только в том случае если у вас 4-х ядерный процессор, иначе работать не будет)
# устанавливаем
Соберем кодек H264. !важно указать параметр –disable-asm в конфигураторе.
Если еще не установили то сначала установим git
и продолжаем
Код: Выделить всё
cd /usr/src
git clone git://git.videolan.org/x264
cd x264
./configure --disable-asm --enable-shared
компилируем с параметром -j4 (использовать все 4 ядра процессора, намного ускоряет весь процесс)
make -j4
make install
Следующим собираем MP3 кодек. Библиотеки будут установлены в /usr/local/lib/libmp3lame
Код: Выделить всё
cd /usr/src
wget http://downloads.sourceforge.net/project/lame/lame/3.99/lame-3.99.5.tar.gz
tar xzvf lame-3.99.tar.gz
cd lame-3.99
./configure
make -j4
make install
Собираем AAC encoder
Код: Выделить всё
cd /usr/src
curl -#LO https://jztkft.dl.sourceforge.net/project/faac/faac-src/faac-1.29/faac-1.29.9.2.tar.gz
tar xzvf faac-1.29.tar.gz
cd faac-1.29
./configure
make -j4
make install
И теперь мы готовы собрать FFMPEG. В итоге библиотеки ffmpeg будут установлены в /usr/bin/ffmpg.
Компиляция ffmpeg может занять минут 5-10-15 в зависимости от железа
Код: Выделить всё
cd /usr/src/
git clone git://source.ffmpeg.org/ffmpeg.git
cd ffmpeg
./configure --enable-shared --enable-gpl --prefix=/usr --enable-nonfree --enable-libmp3lame --enable-libfaac --enable-libx264 --enable-version3 --disable-mmx
make -j4
make install
Все кодеки мы установили в папку /usr/local/lib, соответственно нам надо рассказать об этом ffmpeg
Код: Выделить всё
echo "/usr/local/lib" > /etc/ld.so.conf.d/libx264.conf
ldconfig