Потоковая передача через RTSP или RTP в HTML5

Я создаю веб-приложение, которое должно воспроизводить поток RTSP/RTP с сервера http://lscube.org/projects/feng.

Поддерживает ли тег HTML5 видео / аудио поддержку rtsp или rtp? Если нет, то каким было бы самое простое решение? Возможно, перейдите на плагин VLC или что-то в этом роде.

10 ответов

Решение

Технически "Да"

(но не совсем...)

HTML 5 <video> тег не зависит от протокола - его это не волнует. Вы помещаете протокол в src атрибут как часть URL. Например:

<video src="rtp://myserver.com/path/to/stream">
    Your browser does not support the VIDEO tag and/or RTP streams.
</video>

или, может быть

<video src="http://myserver.com:1935/path/to/stream/myPlaylist.m3u8">
    Your browser does not support the VIDEO tag and/or RTP streams.
</video>

Тем не менее, реализация <video> тег зависит от браузера. Поскольку для HTML 5 это первые дни, я ожидаю частой смены поддержки (или отсутствия поддержки).

Из спецификации HTML5 W3C ( элемент видео):

Пользовательские агенты могут поддерживать любые видео и аудио кодеки и форматы контейнеров

Я думаю, что на этот вопрос ответа не было. Нет, вы не можете использовать видео тег для воспроизведения потоков RTSP на данный момент. Другой ответ, касающийся ссылки на "никогда" Chromium, немного вводит в заблуждение, поскольку связанная ветка / ответ не имеет прямого отношения к Chrome, воспроизводящему rtsp через тег видео. Прочитайте всю связанную ветку, особенно комментарии в самом низу и ссылки на другие темы.

Реальный ответ таков: нет, вы не можете просто поместить видео тег на html 5 страницу и играть в rtsp. Вам нужно использовать какую-то библиотеку Javascript (если только вы не хотите играть в флеш- и Silverlight-плееры) для воспроизведения потокового видео. {IMHO} При скорости обсуждения и реализации html 5-видео различные поставщики проприетарных стандартов видео не заинтересованы в том, чтобы помочь этому продвинуться вперед, так что не рассчитывайте на обещанную простоту использования тега видео, если только браузеры не сделают возьмите это на себя, чтобы как-то решить проблему... опять же вряд ли.{/IMHO}

Это старая проблема, но недавно мне пришлось сделать это самому, и я добился чего-то работающего, поэтому (кроме того, что мой ответ сэкономил бы мне немного времени): в основном используйте ffmpeg, чтобы изменить контейнер на HLS, большую часть потока IPCams h264 и некоторые основной тип PCM, поэтому используйте что-то вроде этого:

ffmpeg -v info -i rtsp://ip:port/h264.sdp -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/test.m3u8

Затем используйте video.js с плагином HLS. Это будет хорошо воспроизводить живой поток. Есть также пример jsfiddle под второй ссылкой).

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

В HTML5 есть три потоковых протокола / технологии:

Прямая трансляция, низкая задержка - WebRTC - Websocket

VOD и прямая трансляция, высокая задержка - HLS

1. WebRTC

На самом деле WebRTC - это SRTP(безопасный протокол RTP). Таким образом, можно сказать, что тег видео поддерживает RTP(SRTP) косвенно через WebRTC.

Поэтому, чтобы получить поток RTP на вашем Chrome, Firefox или другом браузере HTML5, вам нужен сервер WebRTC, который доставит поток SRTP в браузер.

2. Вебсокет

Он основан на TCP, но с меньшей задержкой, чем HLS. Опять же вам нужен сервер Websocket.

3. ЗОЖ

Самый популярный протокол потоковой передачи с высокой задержкой для VOD(предварительно записанное видео).

Chrome никогда не будет реализовывать поддержку потоковой передачи RTSP.

По крайней мере, по словам разработчика Chromium здесь:

мы никогда не собираемся добавлять поддержку для этого

С помощью VLC я могу транскодировать живой поток RTSP (mpeg4) в поток HTTP в формате OGG (Vorbis/Theora). Качество плохое, но видео работает в Chrome 9. Я также тестировал транскодирование в WEBM (VP8), но, похоже, оно не работает (у VLC есть опция, но я не знаю, действительно ли она реализована на данный момент..)

Первый, у кого есть документ об этом, должен уведомить нас;)

В прошлые годы появилось несколько обновлений о RTSP в H5 :

  • RTSP не поддерживается в H5 ни на ПК, ни на мобильных устройствах.
  • Flash отключен в Chrome, см. Adobe
  • MSE работает хорошо, за исключением сафари iOS, для для воспроизведения HTTP-FLV на H5 или для воспроизведения HLS на H5.
  • WebRTC также является возможным способом воспроизведения потоковой передачи в H5, особенно в сценариях с задержкой 0,2–1 с.

Примечание. Я думаю, это потому, что RTSP использует протокол сигнализации TCP для обмена SDP, который не является HTTP в H5, поэтому его очень сложно поддерживать, особенно сейчас есть WebRTC.

Итак, если бы вы могли перекодировать RTSP в другие протоколы, такие как HTTP-FLV/HLS/WebRTC, вы могли бы использовать H5 для воспроизведения потока. Рекомендую использовать FFmpeg для транскодирования:

      ffmpeg -i "rtsp://user:password@ip" -c:v libx264 -f flv rtmp://server/live/stream

Запустите RTMP-сервер, например SRS , чтобы принять RTMP и преобразовать его в HTTP-FLV, HLS и WebRTC:

      ./objs/srs -c conf/rtmp2rtc.conf

Тогда можно воспроизвести поток:

  • HLS по видео или hls.jshls.js : http://server:8080/live/stream.m3u8
  • HTTP-FLV от flv.jsflv.js : http://server:8080/live/stream.flv
  • WebRTC от H5 или собственного SDK: webrtc://server:1985/live/stream

Обратите внимание, что задержка HLS составляет около 5–10 с, LLHLS лучше, но не слишком. HTTP-FLV занимает от 1 до 3 секунд, что очень похоже на RTMP. И задержка WebRTC составляет около 0,2 с, в то время как при скрытом RTSP в RTMP в WebRTC задержка составляет около 0,8 с.

В Chrome не реализована поддержка потоковой передачи RTSP. Важный проект, чтобы проверить это WebRTC.

"WebRTC - это бесплатный открытый проект, который предоставляет браузерам и мобильным приложениям возможности связи в реальном времени (RTC) через простые API"

Поддерживаемые браузеры:

Chrome, Firefox и Opera.

Поддерживаемые мобильные платформы:

Android и IOS

http://www.webrtc.org/

Мои наблюдения относительно потоков видео-тегов HTML 5 и потоков rtsp(rtp) заключаются в том, что он работает только с konqueror(KDE 4.4.1, для фононного бэкенда установлено значение GStreamer). Я получил только видео (без звука) с потоком H.264/AAC RTSP(RTP).

Потоки с http://media.esof2010.org/ не работали с konqueror(KDE 4.4.1, для фононного бэкенда установлено значение GStreamer).

Делаем вывод на данный момент.

Я бессмысленно пытаюсь обойти это, поскольку rtsp не работает OOB. Без «менеджера», управляющего потоковой передачей, чтобы довести его до работы с тегом видео, сейчас это невозможно.

В настоящее время я работаю над решением android+html (гибридным), чтобы управлять этим очень злым способом. Поскольку предполагается, что он будет воспроизводиться напрямую с камеры на Android без промежуточных серверов, мы придумали решение, включающее тег холста, чтобы связать не веб-просмотр с веб-просмотром.

Другие вопросы по тегам