Как осуществить простейшую веб-трансляцию (видеорегистратор + VLC media player + WordPress + VideoEmbed)

Задача такова: с минимальными усилиями вставить живое видео с домашнего компа(видеорегистратора) или IP камеры  из внутренней(OpenVPN) сети на сайт под управлением WordPress. Пример моей трансляции тут.

Будем считать, что web или IP камера уже подключена, и ссылка(или приложение) на трансляцию известна нормально работает и выводит изображение на экран.

Настройка VLC:

  • Скачать и установить VLC media player
  • Убедившись, что камера работает переходим к настройке потокового вещания. Открываем Медиа -> Потоковое вещание -> закладка Устройство захвата. Выбираем устройство захвата видео и аудио. Нажимаем на кнопку Поток.
  • В открывшемся окне находим кнопку Следующий, нажимаем ее и затем еще раз. В итоге вы должны увидеть вот такое окно:VLC — потоковое вещаниеВ поле «Строка ввода для генерируемого потока» вставляем:1:sout=#transcode{vcodec=h264,vb=300,ab=64,fps=25,width=256,height=192,acodec=mp3,samplerate=44100}:duplicate{dst=std{access=http{mime=video/x-flv},mux=ffmpeg{mux=flv},dst=:7777}}Рассмотрим параметры подробнее:
    vcodec=h264 — видео кодек H264;
    acodec=mp3 — аудио кодек;
    vb=300 — видео битрейт (чем выше, тем выше качество и требования к полосе пропускания);
    ab=64 — аудио битрейт (чем выше, тем выше качество и требования к полосе пропускания);
    fps=25 — кол-во кадров в секунду;
    width=256, height=192 — соответственно ширина и высота изображения;
    samplerate=44100 — частота дискретизации звука.Эти параметры можно варьировать и тем самым улучшать/снижать качество изображения ну и как следствие требования к полосе пропускания. Что касается конкретных цифр, то они взяты мной с videolan.org из примера для простых веб-трансляций. Для просмотра в небольшом окне плеера (до 640х480) качество вполне нормальное )dst=:7777 — важнейший параметр, определяющий сетевой порт (TCP) по которому будет осуществляться вещание. В моем случае: 7777 (вы можете выбрать любой другой не занятый порт). Порт должен быть открыт в брандмауэре. Если подключение к Интернет осуществляется через роутер, то на роутере необходимо дополнительно настроить форвардинг этого порта.После настройки параметров, нажимаем на кнопку Поток.
  • абочий пример задачи(стартует трансляция части экрана монитора при помощи VLC при включении компа) в nncron.tab:
    StartIn: "D:\Program Files\VideoLAN\VLC" 
    ShowMinimized NormalPriority
    START-APP: D:\Program Files\VideoLAN\VLC\vlc.exe screen:// :screen-left=78 :screen-top=20 :screen-height=515 :screen-width=420 :screen-fps=1.000000 :live-caching=300 :sout=#transcode{vcodec=FLV1,vb=300}:std{access=http{mime=video/x-flv},dst=:8081/stream.flv,mux=ffmpeg{mux=flv}}
    )#
Вставляем трансляцию на сайт WordPress:
  • Устанавливаем и активируем плагин Video Embed & Thumbnail Generator (из множества других на 19 декабря 2019 методом проб остановился на этом рабочем, остальные отказались работать). После установки достаточно вставить на страницу следующий шорттег:[

KGVID width="640" height="360"]http://cam2.elektronik.spb.ru/stream.flv[/KGVID]'

 

  • если берете трансляцию с другого компа(как в моем примере), то в конфигурации своего хостинга прописываем путь до нее в файле httpd-vhosts.conf для apache24 у меня так:
    * дополнительно нужно будет добавить в апач модуль проксирования, чтобы он смог «обработать» данную ссылку из другой сетки и выдать на ваш сайт:


  • имейте ввиду для работы плеера в браузере нужен будет флеш-плеер, поэтому на мобильниках данная трансляция не будет работать. Во-всяком случае, мне пока не удалось запусить флеш-плеер в браузерах на андроиде. А кроме flv формата, другой у меня не «завелся». Возможно, вы найдете выход.

Использованная литература: http://www.q2w3.ru/2010/08/18/2015/

Автор: Электроник

Системный администратор широкого профиля. От ИТ до Маркетинга. Мастер на все руки.

Добавить комментарий

Ваш адрес email не будет опубликован.