DIY Главная Медиа Logo

Конечная сайт для проектирования и создания вашей установке домашнего кинотеатра и Привет-Fi.

1Вставить живой RTSP-поток в веб-страницу

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

Проблема

Моя камера видеонаблюдения, как и многие, только обеспечивает поток RTSP. Ни один современный веб-браузер не поддерживает RTSP.

Поиск и требования

Google просто не тот, что был раньше, и потребовалось несколько дней, чтобы найти приемлемое решение, отвечающее всем моим требованиям…

  • Я хотел что-то, что будет работать полностью в автономном режиме без участия сторонних серверов.
  • Я хотел что-то абсолютно бесплатное, идеально открытый исходный код
  • Я хотел что-то, что не перекодировало бы видео или аудио, поскольку это потратило бы впустую ресурсы обработки

Решение

Я обнаружил, действительно полезное руководство который объяснил способ сделать это с небольшим количеством JavaScript и ffmpeg, оба из которых были легко доступны бесплатно.

Для запуска ffmpeg я использовал следующую команду, который я запустил на windows в качестве службы, создано с помощью nssm…
ffmpeg -i rtsp://your_rtsp_ip:port/path/to/file.stream -c:v copy -c:a copy -bufsize 1835k -pix_fmt yuv420p -flags -global_header -hls_time 10 -hls_list_size 6 -hls_wrap 10 -start_number 1 /var/www/html/video.m3u8

Чтобы встроить видео, я скачал следующий файл CSS и 2 JS файлы

  • Вордпресс://vjs.zencdn.net/7.2.3/video-js.css
  • Вордпресс://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.14.1/videojs-contrib-hls.js
  • Вордпресс://vjs.zencdn.net/7.2.3/video.js

Затем я использовал код из руководства (с измененными путями к локальным файлам) вставлять видео, которое работало сразу. ffmpeg использует вокруг 0.2% использование процессора и несколько мегабайт памяти на сервере, на котором размещен сайт.

Последнее замечание, если это имеет значение – Я использовал win64 статическая сборка ffmpeg 4.2.2

Нашел это полезным? Пожалуйста, дайте нам знать, оставив комментарий ниже. Дайте нам знать, комментируя ниже. Дайте нам знать, комментируя ниже. Дайте нам знать, комментируя ниже.

оставьте ответ

Один Комментарий

GravatarТомас

Привет там,
я пытаюсь сделать то же самое, но я не могу заставить его работать должным образом
Я следовал твоим инструкциям, и связанный, но я все еще, кажется, получаю 20-30 секунды задержки между прямой трансляцией и опубликованной лентой
любые идеи, что может быть причиной этого?

Ответить