Pull to refresh

RTCKit: API голосового и видео общения в браузере

Reading time5 min
Views7.3K
image

Наиболее популярным протоколом IP-телефонии в настоящий момент является протокол SIP. Он позволяет взаимодействовать с большинством софтверных и железных телефонных компонентов, а также поддерживается многими сервисами. Существует несколько приличных реализаций стека данного протокола на языках C (PJSIP, Linphone) или Python (B2BUA, p2p-sip), с помощью которых легко встроить голосовые и видео коммуникации в настольное или серверное приложение.

Проблема


Совсем иначе обстоит дело с веб-приложениями: сегодняшние браузеры пока не поддерживают возможность использования телефонии без дополнительных плагинов. Работы в этом направлении, несомненно, ведутся. Есть некоторая надежда на проект WebRTC, поддерживаемый Google и W3C, но, к сожалению, даже он не является панацеей. Во-первых, перспектива его поддержки в Internet Explorer весьма туманна, а во-вторых, протокол SIP он все равно не поддерживает. И к тому же, эта технология — некоторое будущее. А что же делать, если есть желание встроить SIP-телефонию в веб-приложение уже сейчас?

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

  • хорошее качество связи, эхоподавление
  • минимальная нагрузка на интернет-канал пользователя
  • поддержка браузерами минимум у 95% пользователей без инсталляции чего-либо

Текущее состояние дел


После внимательного изучения текущего состояния веб-браузеров становится ясно, что на текущий момент этим требованиям удовлетворяет только одна технология, а именно Adobe Flash. Технология закрытая и не без странностей, но за годы работы Adobe довела ее до более-менее достойного состояния. Огромное количество контента в сети требует наличия Flash Player, и поэтому он установлен у большинства пользователей.

Flash представляет собой браузерный плагин, сделанный на технологии ActiveX для Internet Explorer и с помощью NPAPI для всех остальных браузеров. Плагин умеет загружать swf-файлы и исполнять содержащийся в них байткод. Но самое главное: Flash Player умеет взаимодействовать со звуковой картой и веб-камерой пользователя, снимать с них звук и изображение и кодировать их, используя современные аудио и видео кодеки. Так, например, кодек Speex/16000 идеально подходит нам по соотношению качество звука/степень сжатия.

К сожалению, Flash не позволяет напрямую использовать стандартные протоколы TCP и UDP, на которых можно было бы построить SIP-клиент. Вместо этого для передачи голосовых и видео данных предлагается использовать их собственные протоколы RTMP и RTMFP. Первый сразу отпадает, так как построен на TCP, а вот RTMFP — это как раз то, что нам нужно. Он работает поверх UDP, а значит, позволяет добиться минимальных задержек и устойчив к помехам в сети.

После того как мы определились с технологией, возникают вопросы связанные с реализацией. На клиентской стороне вроде нет ничего сложного. Необходимо написать Flash приложение, которое встраивается в веб-страницу и осуществляет двусторонние коммуникации по протоколу RTMFP. Это потребует некоторой разработки на языке ActionScript (по сути JavaScript с поддержкой классов и модулей).

А вот на серверной стороне нужно сделать конвертацию RTMFP в SIP. На момент написания статьи ни один из open-source проектов (red5, rtmplite и другие) не поддерживал данную возможность. Даже коммерческий Adobe Flash Media Server в связке с Flash Media Gateway, поддерживает только конвертацию RTMP <-> SIP, не говоря уже о том, цена у серверных продуктов от Adobe не слишком демократичная.

Решение


Эти действия требуют немало усилий, и все ради одной, казалось бы, простой возможности: голосового и видео общения у вас в приложении. В связи с этим у нас родилась идея сделать облачный сервис, которые берет все эти сложности на себя. Используя наш многолетний опыт работы над talkpad.ru, мы создали API для общения внутри веб-приложений — RTCKit.com

image

Сервис позволяет встроить в ваше приложение невидимый Flash-компонент WebPhone и управлять им с помощью интуитивно понятного JavaScript API. WebPhone направляет голосовые и видео данные в наше облако, мы занимаемся их конвертацией в SIP и обратно, и, как следствие, вам становится доступен весь спектр услуг современной IP телефонии.

Как это можно использовать? Например, если вы являетесь провайдером услуг телефонии через SIP, то можете предложить вашим абонентам звонить прямо с вашего сайта, без установки чего-либо. Или, например, через RTCKit можете взаимодействовать с вашей офисной АТС и организовать корпоративную конференц-связь прямо в браузере.

Пример использования


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

1. Для заземления голоса на городские и сотовые телефоны регистрируем аккаунт на talkpad.ru, sipnet.ru или любом другом SIP-провайдере.

2. Размещаем на веб-сервере страницу, в которую подгружаем JavaScript-библиотеки RTCKit и пишем следующий код. Вместо <username> и <password> подставляем данные аккаунта из предыдущего пункта.

<head>
	<script src="http://rtckit.com/api/swfobject.js"></script>
	<script src="http://rtckit.com/api/rtckit.js"></script>
	<script>
		window.addEventListener('load', function() {
			RTCKit.webPhone.onConnectStateChanged = function(connectInfo) {
				if (connectInfo.connected) {
					RTCKit.webPhone.register({
						registrar: 'talkpad.ru',
						username: '<username>',
						password: '<password>'
					});
				}
			}

			RTCKit.webPhone.onRegStateChanged = function(regInfo) {
				if (regInfo.registered)
					RTCKit.webPhone.call({'uri': 'sip:<number>@talkpad.ru'});
			}

			RTCKit.webPhone.embed({container: 'container'});
			RTCKit.webPhone.connect()
		}, false);
	</script>
</head>
<body>
	<div id='container' style='width: 217px; height: 140px'></div>
</body>


3. Делаем так, чтобы страница отрывалась во всплывающем окне по нажатию на кнопку “звонить” на странице интернет-магазина, и вместо <number> подставляем телефонный номер отдела продаж в международном формате (например, 74951234567). Click2call сервис готов!

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

В заключение хотелось бы сказать, что WebPhone — это только первый шаг в создании современного облачного API, покрывающие различные нужды телефонии. У нас в разработке находятся несколько новых интересных возможностей для RTCKit, и мы будем писать о них по мере готовности.

UPDATE: проблему, из-за которой на Linux не работал микрофон, нашли и исправили. Теперь должно работать везде.

UPDATE: теперь мы также поддерживаем видео-звонки в браузере. Почитать можно тут.
Tags:
Hubs:
Total votes 30: ↑29 and ↓1+28
Comments47

Articles