Как я могу отобразить видеопоток RTSP на веб-странице? - PullRequest
Новая
       80

Как я могу отобразить видеопоток RTSP на веб-странице?

79 голосов
/ 11 февраля 2010

У меня есть IP-камера, которая обеспечивает потоковое видео RTSP в реальном времени. Я могу использовать медиаплеер VLC для просмотра канала, указав в нем URL-адрес: 

rtsp://cameraipaddress

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

Кто-нибудь знает какие-нибудь альтернативные видео плагины, которые я мог бы использовать, которые поддерживают RTSP?

Камера может быть настроена для потоковой передачи в формате H264 или MPEG4.

Ответы [ 15 ]

1 голос
/ 04 октября 2018

Проверка библиотеки потоков мультимедиа по Axis, которая ретранслирует расширение Media Source

Они реализуют конвейер, похожий на Gstreamer в JS, с затуханием h264 в нем. Примечание. Поток, используемый в js, не является непосредственно rtsp, но инкапсулируется в ws: // самой библиотекой на прокси-узле rtsp-websocket node.js.

1 голос
/ 04 сентября 2013

Для подобных целей я использую VLC в качестве сервера перераспределения. Вы сказали, что можете посмотреть видео с VLC? Щелкните правой кнопкой мыши на мультимедиа в VLC, выберите «поток» и выберите параметры. Вы также можете сделать это с помощью командной строки, которая дает вам потенциальные преимущества различных опций (транскодирование, масштабирование, сжатие, деинтерлейсинг). Вот пакет, который запускает распространение VLC из источника на свой собственный порт 555 (поэтому вам нужно будет ввести rstp: // myvlcserveripaddress: 555 в опции src на веб-странице, чтобы получить поток) 

cd \
cd C:\Program Files (x86)\VideoLAN\VLC\

vlc --logo-file C:\logo.png --logo-position 5 --logo-opacity 200 --logo-x 900 --logo-y -2 "mmsh://typeyoursourceIPhere:554" :sout=#transcode{vcodec=div3,vb=800,scale=0,acodec=mpga,ab=128,channels=2,samplerate=44100}:duplicate{dst=rtp{mux=ts,sdp=rtsp://:555/stream}} :sout-all :sout-keep

Здесь , у вас есть пример веб-страницы, в которую встроен проигрыватель (на основе плагина VLC).

1 голос
/ 01 июля 2012

Microsoft Mediaplayer может делать все, что вам нужно. Я использую MS Mediaservices 2003/2008 Server для доставки видео в качестве широковещательной и одноадресной передачи. Эта служба может получить поток с камеры и транслировать его. Чем у вас есть «только» проблема с «отображением» этой картинки во ВСЕХ браузерах на всех ОС-системах

Мой совет: сначала проверьте ОС, затем загрузите плагин. на винде легко - возьми WMP, на другом возьми MS Silverligt ...

0 голосов
/ 17 ноября 2018

Для того, который я использую, работает следующий URL: 

rtmp://<IP_address>/flash/11:<username>:<password>

например: 

rtmp://192.168.1.10:1935/flash/11:admin:admin

Вам необходимо найти IP вашего IP CAM, имя пользователя и пароль.

Приведенный выше URL при входе в браузер обнаружит его поток и откроет медиаплеер. Чтобы найти правильный URL-адрес для вашей марки, войдите в найденный вами IP-адрес. (Используйте сканер, такой как Nmap, IP-сканер и т. Д.)

find URL in Javascript

0 голосов
/ 13 ноября 2013

Все вышеперечисленные решения не работают больше или слишком долго, чтобы разобраться.

Это окончательный ответ. Вы можете встроить ссылку RTSP на свой сайт.

Скопируйте приведенный ниже код в ваш HTML-редактор: 

<!--- BEGIN PLAYER --->

<!-- webbot bot="HTMLMarkup" startspan ---->

<object ID="MediaPlayer" WIDTH="320" HEIGHT="270" CLASSID="CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95" STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject" CODEBASE="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112">

<param name="autoStart" value="True">

<param name="filename" value="rtsp://xxx.xxx.xxx:xxxx">

<param NAME="ShowControls" VALUE="False">

<param NAME="ShowStatusBar" VALUE="False">

<embed TYPE="application/x-mplayer2" SRC="rtsp://xxx.xxx.xxx:xxxx" NAME="MediaPlayer" WIDTH="320" HEIGHT="270" autostart="1" showcontrols="0"></embed></object>

<!-- webbot bot="HTMLMarkup" endspan ---->

<!--- end PLAYER --->

Если все это слишком сложно и все еще не решает, позвольте мне помочь вам.

Я сделал это для своих клиентов.

Нажмите здесь http://www.mhcreative.com.my/ipcameratowebsite/

Страница:
...