Experiment

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

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

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

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

Камеру можно настроить для потока в H264 или MPEG4.

ОТВЕТЫ

Ответ 1

VLC также поставляется с плагином ActiveX, который может отображать фид на веб-странице:

Ответ 2

Примерно вы можете выбрать 3 варианта отображения видеопотока RTSP на веб-странице:

Вы можете найти код для вставки ActiveX через поиск Google.

Насколько я знаю, для каждого игрока есть некоторые ограничения.

• Realplayer не поддерживает видео H.264 изначально, вы должны установить плагин quicktime для Realplayer для достижения декодирования H.264.
• Quicktime Player не поддерживает транспорт RTP/AVP/TCP, а его транспорт RTP/AVP (UDP) не включает перфорирование отверстий в NAT. Таким образом, единственным возможным транспортом является HTTP-туннелирование в развертывании WAN.
• VLC не поддерживает перфорирование отверстий в NAT для транспорта RTP/AVP, но доступен транспорт RTP/AVP/TCP.

Ответ 3

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

Но, к счастью, есть некоторые облачные сервисы, которые могут выполнять эту работу для нас. Один из лучших — IPCamLive. Эта услуга может получать видеопоток RTSP/H264 с IP-камеры и транслировать его зрителям. IPCamLive имеет компонент видеопроигрывателя Flash/HTML5, который отображает видео на ПК, MAC, планшет или мобильный телефон. Самое главное, что этот сайт генерирует необходимый фрагмент HTML для встраивания видео в реальном времени следующим образом:

Поэтому нам просто нужно скопировать его в наш HTML файл без каких-либо изменений.

Ответ 4

Если вы хотите передать RTSP прямо на веб-страницу, я боюсь, что ваш единственный вариант — использовать средство просмотра ActiveX, которое поставляется вместе с камерой. Это прямое подключение IP Cam → Viewer, и должно быть действительно самым быстрым. Не знаете, почему у вас проблемы; Axis ActiveX работает очень хорошо для меня.

Однако этот параметр неэффективен по пропускной способности, и вы не можете обслуживать несколько одновременных зрителей (большинство IP-камер имеют 10 ограниченных зрителей). Лучшим вариантом является загрузка одного потока RTSP на сервер централизованного размещения потоковой передачи, который преобразует ваш поток в RTMP/MPEG-TS и опубликует его в Flash-плеерах/в установках.

Wowza, Erlyvideo, Unreal Media Server, Red5 — ваши варианты.

Ответ 5

Нашел простое и рабочее решение из официальной документации VLC для веб-плагина

Немного изменил код и заставил его работать. Вот мой code-

Примечание. В приведенном выше фрагменте используется rtsp URL- rtsp , поддерживаемый моей IP-камерой. Так что вам нужно получить то же самое для вашей камеры. Вы можете получить эту информацию, обратившись в службу поддержки вашего поставщика. Также имейте в виду, что я тестировал его на Chrome (используя плагин activeX для Chrome), и другие браузеры (включая браузеры мобильных телефонов) могут не поддерживаться.

Ответ 6

Также вы можете попробовать с открытым исходным кодом WebRTC Media Server Kurento

Который может воспроизводить видеопоток RTSP и отправлять его в WebRTC или транскодировать в RTMP или сохранять на сервере.

Мы используем его на производстве для следующих случаев:

- WebRTC to Webrtc (many to many) - WebRTC to RTMP - RTSP to WebRTC

Ответ 7

1. Повторная передача RTSP в RTMP (Flash Player) не будет работать с Android Chrome или FF (Flash не поддерживается)
2. Повторная передача RTSP в HLS

1. Повторная передача RTSP в WebRTC (встроенная функция браузера для Chrome и FF на Android или на рабочем столе)
2. Повторная передача RTSP на веб-сокеты (iOS Safari и Chrome/FF Desktop)

Ответ 8

Попробуйте QuickTime Player! Heres my JavaScript, который генерирует внедренный объект на веб-странице и воспроизводит поток:

//SET THE RTSP STREAM ADDRESS HERE var address = "rtsp://192.168.0.101/mpeg4/1/media.3gp"; var output = ''; //SET THE DIV ID HERE document.getElementById("the_div_that_will_hold_the_player_object").innerHTML = output; 

Ответ 9

Я знаю, что этот пост старый, но я искал что-то очень похожее на днях (посмотрите мою RTSP-видеопоток с IP-камеры на простой html-странице без каких-либо модных плагинов ActiveX). К счастью, я нашел решение! Он основан на ffmpeg, NodeJS, NGINX (не обязательно, но полезно) и Node Media Server.

Описание в ссылке является подробным и легким для понимания, но у меня все еще были некоторые хитрости, с которыми нужно было разобраться, прежде чем я начал работать (в отношении конечных точек на сервере NodeJS). Я сделал для него собственный вопрос и получил хороший и рабочий ответ.

Ответ 10

Я опубликовал проект на Github, который поможет вам транслировать ip/сетевую камеру в веб-браузер в режиме реального времени без необходимости в плагине, который я внес в проект с открытым исходным кодом в рамках лицензии MIT, который может соответствовать вашим потребностям, вот и вы:

Пока нет полного пакета фреймворка, но это кикстарт, который может дать вам возможность продолжить.
Будучи студентом, я надеюсь, что это поможет, и, пожалуйста, внесите свой вклад в этот проект.

Ответ 11

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

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

Ответ 12

Для таких целей, как этот, я использую 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:duplicate> :sout-all :sout-keep 

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

Ответ 13

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

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

Ответ 14

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

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

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

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

Ответ 15

Наиболее популярным и надежным способом обмена живым видео на веб-сайте является RTMP (с использованием Flash-плеера) или HLS (потоковая передача HTTP-потоком), которая также работает на мобильных телефонах по HTML5, но связана с большой задержкой.

Чтобы преобразовать поток RTSP в RTMP/HLS, необходим сервер ретрансляции (для подключения к потоку RTSP, а затем для RTMP/HLS для веб-клиентов). Wowza Streaming Engine 4.2+ обеспечивает такую ​​функциональность и доступен бесплатно с лицензией разработчика с ограниченным использованием. http://www.wowza.com/streaming/ip-camera-streaming

A script, чтобы управлять этим и публиковать через Интернет, можно найти в http://www.videowhisper.com/?p=PHP-IP-Camera-Stream, а также с бесплатной ограниченной лицензией. Кроме того, онлайн-демонстрация для этого script позволяет публиковать собственные потоки RTSP в Интернете в течение некоторого времени (24 часа).

Ответ 16

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

Это окончательный ответ. Вы можете вставлять ссылку rtsp на свой сайт.

Скопируйте приведенный ниже код в свой редактор html:

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

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

Источник

Просмотр ‘псевдо-видео’ с IP камеры в любом браузере

Довольно часто меня просят друзья и знакомые заказчики сделать какой-нибудь ‘костыль’ для тех или иных железок. Сегодня речь пойдёт о IP видеокамерах, которые отдают как RTSP поток, так и умеют отдавать простую .jpg картинку (скриншот).

Дешевые камеры очень часто не умеют показывать видео прямо в браузере. Для нормального видео, понимаемого любым браузером, нужно вещать или flash или html5, но китайцы экономят на всём и по-этому не хотят интегрировать в прошивку соответствующий модуль. А иногда есть необходимость просто краем глаза просмотреть ‘динамику’ движения того или иного объекта, пусть и с небольшим временным лагом и малым FPS . Кнопку F5 в браузере можно просто устать постоянно жать для обновления страницы с картинкой.

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

В результат работы, в браузере несколько раз в секунду будет обновляться картинка и будет возможным сложить некоторое мнение о происходящем в зоне наблюдения видеокамеры. Данная фича, возможно, будет востребована у монтажников видеокамер, а так-же у ленивых сисадминов. При желании, этот скрипт можно вставить прямо в прошивку камеры, но это уже другая история…

Код HTML страницы

       
-= Experiment =-
 
   

Внутренние ссылки

• 2019-01-04 Детали для ремонта IPC и NVR
• 2018-05-01 Самодельные корпуса для видеокамер из фитингов ITAL 40’
• 2018-04-05 HW/SW инструментарий для изучения и ремонта устройств
• 2018-03-25 Модифицируем прошивки IP видеорегистраторов от Xiong Mai
• 2018-03-12 Сбор информации по IP-камерам JVT на базе SoC Hisilicon
• 2018-03-11 Сбор информации по IP-камерам Topsee на базе SoC Hisilicon
• 2018-03-10 Сбор информации по IP-камерам на базе SoC GM8180
• 2018-02-27 Датчики и телеметрия – Digispark, Micronucleus, OpenWrt
• 2018-02-21 Съём показаний по RS485 порту с электросчётчиков Меркурий
• 2018-02-09 Запуск Buildroot и OpenWrt на устройствах с SoC Hisilicon
• 2018-02-01 Трюки и хаки при экспериментах с IPCam от Xiong Mai
• 2018-01-07 Telegram, MQTT , Яндекс.Диск, WiFi и т.д. в IP камерах от Xiong Mai
• 2018-01-05 IPCam SP009 и SP012 от компании Sricam – SoC GM8135S
• Просмотр ‘псевдо-видео’ с IP камеры в любом браузере
• 2017-08-21 Управление домашней автоматизацией через Telegram
• 2016-11-03 Обновление заводских WEB -интерфейсов у IPC и NVR
• 2016-09-20 Использование mjpg-streamer и различные USB UVC видеокамеры
• 2015-09-03 Хакинг IP-камер на базе SoC HI3518
• 2015-08-26 Модернизация IP Web-камеры – passive PoE
• 2014-04-11 Подбор оборудования для видеонаблюдения

Внешние ссылки

Источник