Найти тему
Никита Буйда

Как сделать аудио и видео чаты в вашем приложении. Flutter-WebRTC

Оглавление

Всем привет!

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

Одним из наиболее эффективных способов решения этой задачи является использование WebRTC.

WebRTC - это спецификация HTML, которая обеспечивает аудио-видео связь в реальном времени между веб-сайтами и устройствами. Она включает в себя сетевые, аудио- и видеокомпоненты, стандартизированные Internet Engineering Task Force и World Wide Web Consortium.

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

Как работает WebRTC

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

Чтобы установить соединение, WebRTC требует от клиентов обмена метаданными для координации взаимодействия с ними, что осуществляется в процессе, называемом сигнализацией. Сигнализация также необходима для обхода брандмауэров и работы с трансляторами сетевых адресов (NAT).

Давайте немного углубимся в этот процесс.

NAT (транслятор сетевых адресов)

Все устройства имеют уникальный IP-адрес. WebRTC использует этот уникальный адрес для соединения двух пиров.

Из-за большого количества подключенных устройств в современном мире нераспределенные адреса IPv4 истощаются. Это привело к развертыванию протокола-преемника, IPv6. Но благодаря классовой сетевой адресации Classless Inter-Domain Routing исчерпание этих адресов IPv4 было существенно отсрочено.

Кроме того, в этом помогает NAT или трансляция сетевых адресов. Вместо того чтобы выделять публичные адреса каждому сетевому устройству, он позволяет интернет-провайдерам и предприятиям маскироваться под частное сетевое адресное пространство. Таким образом, у них есть только один публично маршрутизируемый IPv4-адрес на интернет-интерфейсе главного интернет-маршрутизатора.

Из-за NAT у нас есть два IP-адреса. Один - публичный, связанный с маршрутизатором и видимый только снаружи. Другой - частный адрес, видимый только тем, кто подключен к тому же маршрутизатору.

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

Интерактивное установление соединения (ICE)

Теперь невозможно соединить два пира, используя только их IP-адреса. Чтобы установить соединение, мы должны сначала передать уникальный адрес, чтобы найти одноранговый компьютер в Интернете. Нам также понадобится ретрансляционный сервер для обмена мультимедиа (если P2P-соединение не разрешено маршрутизатором), и, наконец, нам нужно будет пройти через брандмауэр.

Для решения этой проблемы используется механизм под названием Interactive Connectivity Establishment (ICE).

ICE используется для поиска оптимального пути для соединения пиров. Он рассматривает различные пути и выбирает лучший из них.

О сервере Flutter WebRTC

Протокол ICE пытается установить соединение, используя адрес хоста, полученный от ОС и сетевой карты устройства. Если это не удается (что и происходит с устройствами за NAT), ICE пытается получить внешний адрес с помощью сервера STUN. Если это не удается, он использует сервер ретрансляции TURN для маршрутизации трафика. По сути, сервер TURN - это сервер STUN с дополнительными встроенными функциями ретрансляции.

Но давайте рассмотрим их немного подробнее.

STUN (Session Traversal Utilities for NAT)

Конечная точка под NAT с локальным адресом недоступна для других конечных точек за пределами локальной сети. Следовательно, соединение не может быть установлено. Когда это происходит, конечная точка может запросить публичный IP-адрес у сервера STUN. Другие конечные точки могут использовать этот общедоступный IP-адрес для установления соединения.

TURN (Traversal Using Relays around NAT)

Как следует из названия, сервер TURN используется в качестве ретранслятора или промежуточного сервера для обмена данными. Если любая конечная точка под симметричным NAT может связаться с сервером в публичном Интернете, чтобы установить соединение с другой конечной точкой, она называется клиентом TURN.

Однако недостатком использования сервера TURN является то, что он необходим на протяжении всего сеанса, в отличие от сервера STUN, который не нужен после установления соединения. Поэтому в технике ICE по умолчанию используется STUN.

Другими словами, сервер STUN используется для получения внешнего сетевого адреса. Серверы TURN используются для ретрансляции трафика, если прямое (одноранговое) соединение не работает.

Как подключиться к удаленному пользователю

Чтобы подключиться к удаленному пользователю, мы должны сделать предложение от локального пользователя удаленному пользователю и получить ответ для установления соединения.

Сначала мы выясняем условия мультимедиа, такие как разрешение и возможности кодека, локально. Полученные метаданные будут использованы для механизма предложения и ответа. Мы также получим потенциальные сетевые адреса, известные как кандидаты, для хоста приложения.

Затем эти локальные данные необходимо передать удаленному пользователю. После этого выполняются следующие шаги для установления соединения:

  • Локальный пользователь создает предложение, которое по сути является описанием сессии SDP.
  • Это предложение строится и отправляется удаленному пользователю.
  • Удаленный пользователь устанавливает свое удаленное описание в полученное предложение и отправляет ответ.
  • Ответ используется для установки удаленного описания локального пользователя.
  • Между локальным и удаленным пользователем устанавливается соединение.

Между двумя сторонами также должен происходить обмен сетевой информацией. Фреймворк ICE используется для поиска сетевых интерфейсов и портов.

Заключение

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

Для использования технологии в вашем Flutter-приложении следует использовать компонент https://pub.dev/packages/flutter_webrtc

В нашем приложении datebox механизм аудио и видео чатов пока отсутствует, но благодаря WebRTC он там скоро появится.