- PVSM.RU - https://www.pvsm.ru -
Однажды к нам постучись за помощью – сделать сервис-рацию. После продолжительных поисков клиенту не удалось найти подходящее решение, поэтому он обратился в VoxImplant [1]. Нам стало интересно, что же он там такое задумал и сможем ли мы реализовать его задумку на своей платформе. Нам редко удавалось найти сценарий, который на ней сделать невозможно. В общем, пообщались мы, все внимательно выслушали и пошли писать код. Рация должна была уметь подключаться к нескольким каналам одновременно (аналогично частотам в аналоговых рациях), а также давать возможность говорить в один из подключенных каналов + было желательно отображать активность в канале. Под катом рассказ о том, как мы сделали этот сервис за несколько часов.
Всегда полезно нарисовать схему, прежде чем приступать к работе. В результате этой операции у нас получилось что-то такое:

Логика следующая:
1. Пользователь SDK делает звонок, сценарий (WTGatekeeper [2]) пробрасывает звонок в конференцию
2. Такая конференция создается на каждого юзера и требуется для того, чтобы подключать входящий звук от всех каналов, на которые подписывается юзер и пробрасывать исходящий звук в выбранный канал
3. Локальная конференция обрабатывает сигнальные события join_channel, leave_channel, choose_channel, а также отправляет события channel_activity, channel_connected, channel_disconnected (см. сценарий WTUserConf [3]) в сторону юзера
4. Каналы-конференции (см. сценарий WTChannelConf [4]) просто подключают все входящие звонки из локальных конференций
Итого получается, что по одной конференции создается на каждого пользователя и на каждый канал.
Функционал клиента включает:
Для ускорения процесса мы создали демо приложение с помощью Web SDK [5] и ReactJS. Получился такой интерфейс:

Для реализации визуализации голосовой активности в подключенном канале мы воспользовались встроенным в платформу VAD. На каждый звонок можно повесить обработчик данного события и транслировать на клиент информацию про активность:
call.addEventListener(CallEvents.MicStatusChange, handleChannelAudio);
call.handleMicStatus(true);
function handleChannelAudio(e) {
// Send info about channel audio
user_call.sendMessage(JSON.stringify({
event: "channel_activity",
name: e.call.number().replace("channel_", ""),
active: e.active
}));
}
Визуализацию активности в канале сделали следующим образом:

Несмотря на то что все выглядит просто, бэкенд VoxImplant выполняет множество задач для обеспечения работы сервиса. Было приятно, что удалось все это настроить достаточно быстро без танцев с бубном.
Вы можете самостоятельно протестировать получившийся сервис и пообщаться в одном из нескольких доступных каналов по этой ссылке [6]. Используйте Chrome/Firefox/другой браузер с поддержкой WebRTC.
Автор: Voximplant
Источник [7]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/javascript/161913
Ссылки в тексте:
[1] VoxImplant: https://voximplant.ru/
[2] WTGatekeeper: https://gist.github.com/aylarov/103a1f29b4e9a3eba7da1f7ad2a2d32a
[3] WTUserConf: https://gist.github.com/aylarov/c4ed0fcfb4c32904cf3b25d6bcca45a3
[4] WTChannelConf: https://gist.github.com/aylarov/394329194339aca2e942474ecb14bf9d
[5] Web SDK: http://voximplant.com/docs/references/websdk/
[6] по этой ссылке: https://demos.voximplant.com/walkietalkie/
[7] Источник: https://habrahabr.ru/post/305306/?utm_source=habrahabr&utm_medium=rss&utm_campaign=best
Нажмите здесь для печати.