Как организовать WebRTC онлайн трансляцию с помощью веб камеры и VPS сервера
На сегодняшний день WebRTC является «горячей» технологией для потокового аудио и видео в браузерах. Консервативные технологии, такие как HTTP Streaming и Flash, больше подходят для раздачи записанного контента (video on demand) и существенно уступают WebRTC в плане реалтайма и онлайн трансляций, т.е. там, где требуется минимальная задержка видео, позволяющая зрителям видеть то, что происходит «в прямом эфире».
Возможность качественной коммуникации в реальном времени происходит от самой архитектуры WebRTC, где для транспорта видеопотоков используется UDP протокол, являющийся стандартной основой для передачи видео с минимальными задержками и широко использующийся в коммуникационных системах реального времени.
Коммуникационная задержка важна в системах онлайн трансляций, вебинарах и других приложениях, где требуется интерактивная связь с источником видео, конечных пользователей и требует решения.
Другая весомая причина попробовать WebRTC — это, безусловно, тренд. Сегодня каждый Android Chrome браузер поддерживает эту технологию, что гарантирует миллионы устройств, готовых к просмотру трансляции без установки какого-либо дополнительного ПО и конфигураций.
Для того, чтобы проверить технологию WebRTC в деле и запустить на ней простую онлайн трансляцию, мы использовали серверное ПО Flashphoner WebRTC Media & Broadcasting Server. В фичах заявлена возможность транслировать WebRTC потоки в режиме «один ко многим» (one-to-many), а так же поддержка IP камер и систем видеонаблюдения через RTSP протокол; в настоящем обзоре мы сосредоточимся на web-web трансляциях и их особенностях.
Установка WebRTC Media & Broadcasting Server
Поскольку для Windows системы версии сервера не оказалось, а устанавливать виртуалку типа VMWare+Linux не хотелось, протестировать онлайн трансляции на домашнем Windows компьютере не получилось. Чтобы сэкономить время решили взять инстанс на облачном хостинге вроде такого:
Это был Centos x86_64 версии 6.5 без какого- либо предустановленного ПО в датацентре Амстердама. Таким образом, все, что мы получили в распоряжение, — это сервер и ssh доступ к нему. Для тех, кто знаком с консольными командами Linux, установка WebRTC сервера обещает пройти просто и безболезненно. Итак, что мы сделали:
1. Скачать архив:
$wget https://flashphoner.com/download-wcs5-server.tar.gz
2. Распаковать:
$tar -xzf download-wcs5-server.tar.gz
3. Установить:
$cd FlashphonerWebCallServer
$./install.sh
Во время инсталляции ввевсти IP адрес сервера: XXX.XXX.XXX.XXX
4. Активировать лицензию:
$cd /usr/local/FlashphonerWebCallServer/bin
$./activation.sh
5. Запустить WCS сервер:
$service webcallserver start
6. Проверить лог:
$tail - f /usr/local/FlashphonerWebCallServer/logs/flashphoner_manager.log
7. Проверить, что два процесса на месте:
$ps aux | grep Flashphoner
Процесс установки закончен.
Тестирование WebRTC онлайн-трансляций
Тестирование трансляций оказалось делом нехитрым. В дополнение к серверу есть web-клиент, который состоит из десятка Javascript, HTML и CSS файлов и был развернут нами в папку /var/www/html на этапе установки. Единственное, что пришлось сделать, это вписать IP адрес сервера в конфиг flashphoner.xml, чтобы web-клиент мог установить соединение с сервером по HTML5 Websockets. Опишем процесс тестирования.
1. Открываем страницу тестового клиента index.html в Chrome браузере:
2. Для того чтобы начать трансляцию, нужно нажать кнопку «Start» посередине экрана.
Перед тем как это сделать, необходимо убедиться что веб-камера подключена и готова к работе. Особых требований к вебкамере нет, мы, например, использовали стандартную встроенную в ноутбук камеру с разрешением 1280×800.
Chrome браузер обязательно попросит доступ к камере и микрофону для того чтобы пользователь понимал, что его видео будет отправлено на Интернет-сервер и разрешил это сделать.
3. Интерфейс представляет собой успешную трансляцию видеопотока с камеры на WebRTC сервер. В правом верхнем углу индикатор указывает, что поток уходит на сервер, в нижнем углу кнопка «Стоп» для остановки отправки видео.
Обратите внимание на ссылку в поле снизу. Она содержит уникальный идентификатор этого потока, так любой желающий может присоединиться к просмотру. Достаточно открыть эту ссылку в браузере. Чтобы ее скопировать в буфер обмена нужно кликнуть по кнопке «Copy».
В реальных приложениях вроде вебинаров, лекций, онлайн видео трансляций или интерактивного TV разработчикам придется реализовывать раздачу этого идентификатора определенным группам зрителей для того, чтобы они смогли подключиться к нужным потокам, но это уже логика работы приложения. WebRTC Media & Broadcasting Server ее не затрагивает, а занимается только раздачей видео.
4. После открытия ссылки в браузере нужно немного подождать. Несколько секунд требуется для того, чтобы установить соединение с сервером по Websockets, создать WebRTC сессию и забрать поток.
5. Соединение установлено и зритель видит поток на экране. Теперь он может отправить ссылку кому-то другому, остановить воспроизведение потока либо включить полноэкранный режим, пользуясь контролами в правом нижем углу.
Результаты тестирования WebRTC сервера онлайн трансляций
Во время тестов задержка выглядела идеальной. Пинг до датацентра составил около 100 миллисекунд и задержка была не различима глазом. Отсюда, можно предположить, что реальная задержка составляет те же 100 плюс минус несколько десятков миллисекунд на время буферизации. Если сравнивать с Flash видео: в подобных тестах Flash ведет себя не так хорошо, как WebRTC. Так, если на схожей сети шевельнуть рукой, то движение на экране можно увидеть только через одну/две секунды.
Относительно качества отметим, что на движениях иногда можно различить кубики. Это соответствует природе кодека VP8 и его основной задаче — обеспечить видео связь в реальном времени с приемлемым качеством и без задержек в коммуникации.
Сервер достаточно прост в установке и настройке, для его запуска не требуется каких-либо серьезных навыков кроме знания Linux на уровне продвинутого пользователя, умеющего выполнять команды из консоли через ssh и пользоваться текстовым редактором. В итоге нам удалось наладить онлайн трансляцию one-to-many между браузерами. Подключение дополнительных зрителей к потоку также не вызвало проблем.
Качество трансляции оказалось вполне приемлемым для вебинаров и онлайн вещаний. Единственное, что вызвало некоторые вопросы, — это разрешение видео. Камера поддерживает 1280×800, но разрешение на тестовой картинке очень похоже на 640×480. Видимо, этот вопрос нужно уточнять у разработчиков.
Рекомендуем также к прочтению обзор о настройках и и тестировании WebRTC & Broadcasting Server c IP камерами и системами видеонаблюдения через протокол RTSP.
Видео по тестированию трансляции с веб-камеры
через WebRTC-сервер
Дополнительно о WebRTC сервере
Узнать больше о WebRTC сервере для трансляций видео
из браузера
Узнать больше о WebRTC
сервере для трансляций видео с IP камер
Читать
обзор - Как организовать браузерную WebRTC трансляцию
Читать обзор - Как
организовать WebRTC видео наблюдение с помощью IP камеры и VPS сервера
Узнать больше о платформе Web Call Server
Ознакомиться с документацией
Посетить
форумы техподдержки
Скачать WebRTC
Media Server
Загрузить Web Call Server 5
Системные требования: Linux x86_64, 1 core CPU, 2 Gb RAM, Java
Установка:
- wget https://flashphoner.com/download-wcs5.2-server.tar.gz
- Распаковать и установить с помощью скрипта 'install.sh'
- Запустить сервер с помощью команды 'service webcallserver start'
- Открыть веб-интерфейс https://host:8444 и активировать вашу лицензию
Если вы используете серверы Amazon EC2, то скачивать ничего не нужно.
Статьи по теме
iOS Safari 11 теперь умеет WebRTC
Задержка в онлайн-трансляциях с веб-камеры, бессердечная ты стерва
Транслируем видеопоток с веб-страницы на Facebook и YouTube одновременно
Развертывание многопользовательской WebRTC трансляции с web-камеры через сервер за 3 минуты
Возможности продукта
Трансляция WebRTC видеопотока с конвертацией в RTMP
Видеотрансляции с веб-камеры браузера или мобильного устройства