Skip to content

Публикация по WebRTC

Содержание:

О WebRTC

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

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

  • текстовыми описаниями медиапотоков в формате SDP
  • ICE Candidates как часть SDP

Сигнальный сервер — посредник, позволяет передать данные о соединении от одного клиента к другому.

WebRTC идеально подходит для вбинаров, онлайн-коммуникации и видеочатов.

Подробнее читайте в главе Использование протокола WebRTC.

Как организовать публикацию по WebRTC

Warning

В некоторых браузерах публикация по WebRTC видео и аудио потоков возможна только по защищенному соединению. То есть браузер может запретить доступ к камере и микрофону со страницы, которая располагается не по HTTPS, а по HTTP адресу. Но на локальных адресах (localhost, 127.0.0.1) это допускается.

На сервере Flussonic добавьте в конфигурацию публикуемый поток, т.е. поток с источником publish://.

stream published {
  input publish://;
}

Можно также добавить поток через Flussonic UI:

  1. Перейдите на вкладку Media и создайте поток, нажав кнопку Add рядом с названием раздела Streams.
  2. Затем в настройках потока во вкладке Input укажите publish:// в поле URL. Убедитесь что для Published input выбрано значение accept.

Flussonic stream mixing

Published input accept

Чтобы настроить публикацию по WebRTC:

  • Зайдите в options на той же вкладке Input:

Options

  • Укажите необходимые настройки:

Настройки WebRTC

Теперь на клиенте нужно выполнить код для публикации видео в созданный поток. Для написания кода используйте библиотеку Flussonic WebRTC player.

Установка библиотеки с помощью NPM и webpack

Для варианта с импортом библиотеки в ваш проект через Webpack необходимо загрузить пакет:

npm install --save @flussonic/flussonic-webrtc-player

и импортировать его в ваше приложение:

import {
  PUBLISHER_EVENTS,
  PLAYER_EVENTS,
  Player,
  Publisher,
} from "@flussonic/flussonic-webrtc-player";

Описание классов библиотеки доступно на npm.

См. также демо-приложение по ссылке либо ниже на этой странице.

Установка без NPM и webpack

В секцию скриптов вашего HTML-файла добавьте:

<script src="https://cdn.jsdelivr.net/npm/@flussonic/flussonic-webrtc-player/dist/index.min.js"></script>

Полный пример кода страницы с плеером приведен ниже на этой странице.

Опции публикации по WebRTC

Организация аудио-подкастов по WebRTC

Чтобы публиковать только звуковую дорожку, необходимо в опциях экземпляра publisher указать следующую конфигурацию в constraints:

import Publisher from '../publisher';
//...
publisher = new Publisher(
//...

    constraints: {
      video: false,
      audio: true,
    },
//...
);

Опцию video можно совсем не указывать, результат будет такой же — публикация на Flussonic только аудиодорожки.

Чтобы проиграть такой поток, не нужно дополнительных настроек.

Отключение звука в публикации

Для отключения звука в публикации используется метод mute:

import Publisher from '../publisher';
//...
publisher = new Publisher(*your options*);
//...
publisher.mute();
//...

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

Публикация потоков с помощью WHIP

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

WHIP (WebRTC-HTTP ingest protocol) предоставляет простой и независимый от медиа-сервера способ проигрывания потоков по WebRTC, который легко интегрировать в существующие инструменты вещания. Процесс согласования WebRTC в WHIP сводится к отправке запроса HTTP POST с сообщением SDP и получению от медиа-сервера ответа 200/202 для получения ответного сообщения SDP. При этом WHIP сохраняет все преимущества протокола WebRTC: низкую задержку, отказоустойчивость, адаптацию загрузки канала, шифрование, использование популярных кодеков, адаптивный битрейт и т.д.

Note

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

Flussonic Media Server позволяет публиковать потоки по WHIP. Для этого не требуется никакой специальной конфгурации. Просто следуйте вышеописанным шагам для публикации с помощью WebRTC, но в настройках объекта Publisher в WebRTC плеере добавьте опцию whipwhap: true.


import Publisher from '../publisher';
//...
publisher = new Publisher(
//...
  whipwhap: true,
//...
);

Описание класса Publisher и всех его параметров можно найти в npm.

Теперь для публикации потока в вашем приложении можно использовать следующий URL:

http://FLUSSONIC-IP:PORT/STREAM_NAME/whip

См. справочник Streaming API.