Технология WebRTC для разработки VoIP Web приложений

WebRTC является технологией, которая позволяет разработчикам создавать приложения для осуществления аудио- и видео- звонков, непосредственно из браузера, без использования каких-либо дополнительных средств.

Краткий обзор технологии WebRTC

Аббревиатура WebRTC расшифровывается как Web Real Time Communication — веб коммуникации в режиме реального времени. WebRTC является стандартом передачи голоса, видео, а также данных в браузерах, использую peer2peer-соединение между клиентами. Такой высокоуровневый подход позволяет обеспечить абсолютную кроссплатформенность для приложений, полную независимость, как от аппаратных, так и средств операционной системы, что открывает большие границы в разработке VoIP-приложений. Для разработчиков данная технология доступна в виде библиотек JavaScript API. Проект WebRTC имеет открытый исходный код и поддерживается Google, Firefox, Apple и многими другими вендорами.

Стандарт WebRTC является продуктом совмещения двух различных технологий: обеспечения взаимодействия web-браузера с аппаратными мультимедийными средствами компьютера (камера, микрофон, средства захвата экрана) и создания пиринговой одноранговой сети (peer-to-peer), т.е. использование прямого обмена данными между браузерами, без использования сторонних серверов.

WebRTC основан на трех программных интерфейсах, реализующих его функциональность: для использования камер и микрофонов используется интерфейс navigator.mediaDevices.getUserMedia(). Для трансляции экрана используется navigator.mediaDevices.getDisplayMedia(). Создание peer-to-peer соединения управляется интерфейсом RTCPeerConnection.

WebRTC поддерживает аудио кодеки G.711 и Opus, а также видеокодеки H.264 и VP8, что позволяет обеспечить высокое качество связи между абонентами.

О безопасности WebRTC

Так как WebRTC является открытой технологией и доступна в любом современном браузере, просто по клику на расширение, у пользователей возникает вполне закономерный вопрос, насколько эта технология безопасна?

Передача данных в WebRTC основана на протоколе DTLS, который использует шифрование пользовательских дейтаграмм и исключает возможность их перехвата, прослушивания, либо какого-то другого вмешательства со стороны злоумышленников. Сам DTLS построен на протоколе TLS, который обеспечивает гарантии безопасной передачи данных между абонентами. DTLS по умолчанию встроен во все браузеры, поддерживающие WebRTC.

Помимо DTLS, WebRTC может использовать SRTP, который также обеспечивает безопасную передачу данных по шифрованным каналам связи.

Для использования камеры и микрофона приложения, основанные на WebRTC в явном виде запрашивают разрешение у пользователя и при непосредственном использовании аудиоустройств уведомляют пользователя с помощью мигающей красной точки на вкладке браузера.

Поддержка WebRTC

Для функционирования WebRTC в браузере необходима поддержка таких технологий, как JavaScript и HTML5. Эти инструменты позволяют создавать интерфейс для VoIP-приложений и использовать библиотеки интерфейсов (API) WebRTC. Непосредственная поддержка самого механизма WebRTC заявлена в браузерах Google Chrome начиная с версии 23, Firefox с версии 38, Opera с версии 12 и в Safari с версии 11. Браузеры компании Microsoft открытую реализацию WebRTC не поддерживают, Edge использует собственную реализацию под названием Object Real Time Communications (ORTC), а для IE с версии 9+ существует плагин webrtc4all, обеспечивающий поддержку необходимых кодеков и библиотек.

 Компанией Google разработана программная библиотека Adapter.js, которую рекомендуется использовать для обеспечения поддержки всех функций WebRTC в различных версиях браузеров, а также в ней содержатся реализации аудио- и видео-кодеков.

Взаимодействие WebRTC и Asterisk

Asterisk поддерживает WebRTC начиная с версии 11. Был создан модуль res_http_websocket, который позволяет разработчикам JavaScript-приложений взаимодействовать с Asterisk. В модуль chan_sip была добавлена ​​поддержка WebSocket как транспорта, чтобы SIP можно было использовать в качестве протокола сигнализации. В модуль res_rtp_asterisk была добавлена ​​поддержка ICE, STUN и TURN, чтобы позволить клиентам, использующим сетевую инфраструктуру с NAT избежать проблем с трансляцией адресов.

Поддержка SRTP так же обеспечена в Asterisk, так как это является необходимым элементом для функционирования WebRTC, но для его успешной работы в вашей операционной системе должна быть установлена библиотека libsrtp. Это важный момент, на который стоит обратить внимание, во избежание возможных проблем, когда вы настраиваете свой сервер Asterisk для работы с WebRTC. Очевидно, что для функционирования SRTP необходимо добавить сертификаты безопасности для сервера Asterisk и его абонентов. Наличие сертификатов является необходимостью для того, чтобы голосовой SRTP-трафик мог проходить между абонентами.

Еще одним необходимым условием для взаимодействия Asterisk с WebRTC-абонентами является наличие STUN-сервера, независимо от того, используют ваши абоненты NAT или нет. STUN необходим для корректной обработки заголовков SDP-пакетов, которые устанавливают сессии между абонентами и содержат в себя их ip-адреса.

Также необходимо обеспечить прием websocket-соединений от абонентов, использующих WebRTC. Сделать это можно, используя встроенный веб-сервер Asterisk.

Здесь описаны лишь теоретические аспекты взаимодействия Asterisk с WebRTC. Подробную инструкцию по конфигурированию Asterisk для работы с абонентами WebRTC Вы можете найти на нашем сайте ознакомившись с постом «Настройка WebRTC в Asterisk 13».

Существуют альтернативные методы поддержки абонентов WebRTC в Asterisk, такие как WebRTC-шлюзы. Примером может служить проект webrtc2sip. Это может понадобиться, если по каким-то причинам вы используете версии Asterisk ниже 11. Каких-либо специальных настроек Asterisk для использования webrtc2sip не требуется.

Особенности реализации технологии WebRTC

Для создания подключения peer-2-peer между двумя браузерами используется класс RTCPeerConnection:

initConnection = (id:string):RTCPeerConnection => {
	const peerConnection = new RTCPeerConnection({
iceServers: [
	{urls: ‘stun:4.l.google.com:19302’},
	{
		urls: ’turn:turn.interpals.net:3478’,
		credential: ‘pass’,
		username: ‘username’
	 },
		]
});
}

В данном контейнере используются механизмы STUN и TURN для определения реальных ip-адресов абонентов и преодоления инфраструктуры NAT

После создания подключения в него добавляются медиа-потоки, например, видео с веб-камеры:

	RTCPeerConnection.prototype.addStream=function(stream){
stream.GetTracks().ForEach(Track=>This.addTrack(track,stream));
};

Интерфейс GetUserMedia позволяет задавать различные параметры для передаваемого медиа-потока:

window.navigator.getUserMedia(
{
	audio:true;
	video:{
		width:1024,
		height: 720}
},
this.getUSerMediaSucces;
this.getUSerMediaFail;
);

Для общения двух абонентов необходимо создать ICE-сервер, который будет обрабатывать события создания, установления и разрыва связи между пирами:

	peer.Connection.onicecandidat=(event)=>{
if (event.candidate) {
this.props.wsRTCSignal(
‘RTC_ICE_CANDIDATE’,
this.props.call.room,
this.clientID,
id,
event.candidate
);
}
};

Соответственно, для сервера включаем обработку указанных событий (OFFER,ANSWER,CANDIDATE):

Event.Emmiter.WS.on(
‘RTC_OFFER’,
this.filterMessage(This.onRTCOffer)
);
Event.Emmiter.WS.on(
‘RTC_ANSWER’,
this.filterMessage(This.onRTCAnswer)
);
Event.Emmiter.WS.on(
‘RTC_ICE_CANDIDATE’,
this.filterMessage(This.onRTCIceCandidate)
);

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

1. createOffer(offer) создание события звонка
2. setLocalDescropton(offer) установка локального события
3. SIGNALING RTC_OFFER передача события звонка серверу

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

1. setRemoteDescription(offer) принятие события от вызывающего
2. createAnswer(answer) создание события ответа
3. setLocalAnswer(answer) установка локального события
4. SIGNALING RTC_ANSWER передача события серверу