Программные решения для построения онлайн-вещания

Документация по SDK для HTML5 плеера

Плеер на JavaScript для Softvelum Low Delay Protocol

SDK для HTML5 SLDP Player

Софтвелум предоставляет JavaScript SDK, который можно использовать на своих веб-сайтах для воспроизведения потоков по SLDP с низкой задержкой. SDK представляет собой библиотеку на JavaScript, у которой есть API для управления. Получить SDK можно следующим образом:

  1. Вы подписываетесь на SDK, используя эту страницу.
  2. Вы высылаете заявку через хелпдеск, где указываете, для каких доменов будет использоваться плеер. Допускаются домены 2 уровня и ниже.
  3. В течении двух рабочих дней мы генерируем индивидуальную сборку SDK для каждого домена и отправляем вам.
  4. По мере выпуска обновлений мы будем высылать новые сборки для каждого домена, заявленного в подписке.
Подписка также покрывает нашу техподдержку, которую мы оказываем в течение всего времени, пока вы подписаны на SDK.

Подписаться

Ниже описаны интерфейсы и колбэки. которые будут доступны вам в рамках SDK.

  • SLDP.isMediaSourceSupported()
    Проверяет поддержку текущим браузером технологии Media Source Extensions API и, следовательно, возможность работы SLDP плеера.
    Возвращаемое значение: true - поддерживает, false - не поддерживает.

Интерфейсы плеера SLDP

  • destroy( callback )
    Уничтожает выбранный экземпляр плеера, включая объекты MSE (Media Source Extensions), UI плеера и соединения.
    Параметры:
    • callback - (опционально) колбэк, который будет вызван после того, как данный экземпляр плеера уничтожен
  • play()
    Начинает воспроизведение для данного экземпляра плеера.
  • pause()
    Приостанавливает воспроизведение для данного экземпляра плеера. Текущее соединение с медиа-сервером сохраняется в течение времени, заданного параметром pause_timeout, если он задан.
  • stop()
    Прекращает воспроизведения для данного экземпляра плеера. Текущее подключение к медиа-серверу немедленно закрывается.
  • getVolume()
    Возвращает громкость плеера.
    Возвращаемое значение: целое число от 0 (без звука) до 100 (полная громкость).
  • setVolume( volume )
    Устанавливает уровень громкости плеера. Элементы пользовательского интерфейса обновляются соответственно выбранному уровню.
    Параметры:
    • volume - целое число от 0 (без звука) до 100 (полная громкость)
  • startAbr()
    Запускает алгоритм адаптивного битрейта (ABR), который выполняет автоматическое переключение на лучшее возможное качество видео при данной скорости сети и производительности процессора.
  • stopAbr()
    Прекращает работу алгоритма адаптивного битрейта (ABR).
  • isAbr()
    Показывает, включен или выключен алгоритм адаптивного битрейта.
  • getRenditions()
    Возвращает список доступных вариантов качества видео.
    Возвращаемое значение: массив строк, содержащих доступные варианты, например, ['360p', '720p'].
  • getCurrentRendition()
    Возвращает выбранное в настоящий момент качество видео.
    Возвращаемое значение: строка с текущим качеством, например, '720p'.
  • changeRendition( rendition )
    Переключает воспроизведение на указанное качество.
    Возвращаемое значение: логический результат (true - переключение начато, false - в настоящее время уже выполняется другое переключение).
    Параметры:
    • rendition - строка, содержащая желаемое качество, например, '1080p'
  • getStreams()
    Возвращает список потоков, которые доступны для переключения.
    Возвращаемое значение: массив объектов со следующими полями:
    • name - полное имя потока, например, 'live/stream'
    • width - ширина разрешения видео в пикселях, если присутствует
    • height - высота разрешения видео в пикселях, если присутствует
    • bandwidth - битрейт потока в битах в секунду
  • getCurrentStream()
    Возвращает текущий выбранный поток.
    Возвращаемое значение: объект со следующими полями:
    • name - полное имя потока, например, 'live/stream'
    • width - ширина разрешения видео в пикселях, если присутствует
    • height - высота разрешения видео в пикселях, если присутствует
    • bandwidth - битрейт потока в битах в секунду
  • changeStream( name )
    Переключает воспроизведение на поток с указанным именем.
    Возвращаемое значение: логический результат (true - переключение начато, false - в настоящее время уже выполняется другое переключение).
    Параметры:
    • name - полное имя целевого потока, например, 'live/stream'
  • setStreamURL( url )
    Задает адрес (URL) нового SLDP-потока. Воспроизведение текущего потока прерывается. Если в данном экземпляре плеера параметр 'autoplay' установлен в значение true, воспроизведение нового потока начинается незамедлительно при условии, что такое возможно.
    Параметры:
    • url - строка, содержащая адрес (URL) SLDP-потока, например, 'ws://example.com/app/stream'
  • refreshVUMeterUI()
    Пересоздает интерфейс волюметра. Следует использовать в том случае, если размер контейнера волюметра был изменен, и нужно обновить содержимое.
  • unmuteVUMeter()
    Применим для волюметра входного типа. Активирует волюметр, который был автоматически приостановлен браузером в случае автостарта плеера с выключенным звуком. Должен сопровождаться действием пользователя, таким как щелчок или касание.
  • setCallbacks( callbacks )Устанавливает колбэки (функции обратного вызова) для данного экземпляра плеера.
    Параметры:
    • callbacks - объект, где ключи — это названия колбэков, а значения — ссылки на определенные разработчиком функции. Допустимыми названиями колбэков являются: onConnectionStarted, onConnectionEstablished, onPlay, onPause, onVolumeSet, onConnectionClosed, onChangeRendition, onChangeRenditionComplete, onError, onLatencyAdjustSeek, onLowBuffer, onVUMeterUpdate

Колбэки SLDP-плеера:

  • onConnectionStarted( url )
    Вызывается в начале подключения плеера к медиа-серверу.
    Параметры:
    • url - полный адрес (URL) SLDP потока, который воспроизводит плеер, например, 'ws://example.com/live/stream'
  • onConnectionEstablished( streams )
    Вызывается после подключения к медиа-серверу и получения списка доступных потоков. Список доступных для пользователя вариантов качества видео составляется на основе данных этих потоков и возможностей браузера.
    Параметры:
    • streams - массив доступных потоков.
      Каждый поток представляет собой объект со следующими полями:
      • name - полное имя потока, например, 'live/stream'
      • width - ширина разрешения потока в пикселях, если видео присутствует
      • height - высота разрешения потока в пикселях, если видео присутствует
      • vcodec - название видеокодека потока, если присутствует
      • video - либо 'supported', либо 'not supported', в зависимости от возможностей браузера
      • acodec - название аудиокодека потока, если присутствует
      • audio - либо 'supported', либо 'not supported', в зависимости от возможностей браузера
      • bandwidth - битрейт потока в битах в секунду
  • onPlay()
    Вызывается, когда пользователь нажимает кнопку воспроизведения или выполняется метод play().
  • onPause()
    Вызывается, когда пользователь нажимает кнопку паузы, или выполняется метод pause().
  • onVolumeSet( volume )
    Вызывается, когда пользователь изменяет громкость с помощью элементов управления или выполняется метод setVolume().
    Параметры:
    • volume - целое число от 0 до 100, обозначающее выбранный уровень громкости
  • onConnectionClosed()
    Вызывается, когда соединение с медиа-сервером закрыто по какой-либо причине.
  • onError( error )
    Вызывается при возникновении ошибки плеера.
    Параметры:
    • error - строка с описанием ошибки, например, 'MEDIA_SOURCE_NOT_SUPPORTED' или 'NO_PLAYABLE_SOURCE_FOUND'
  • onChangeRendition( rendition, name )
    Вызывается, когда пользователь переключает качество видео, либо выполняется метод changeRendition() или changeStream().
    Параметры:
    • rendition - строка, содержащая выбранный пользователем вариант, например, '1080p' или 'Auto'
    • name - полное имя выбранного потока, например, 'live/stream'
  • onChangeRenditionComplete( rendition, name )
    Вызывается, когда переключение качества видео завершено.
    Параметры:
    • rendition - строка с фактическим качеством, например, '1080p'
    • name - полное имя фактического потока, например, 'live/stream'
  • onError( error )
    Вызывается, если SLDP плеер не может воспроизвести данный URL.
    Параметры:
    • error - строка 'MEDIA_SOURCE_NOT_SUPPORTED', если текущий браузер не поддерживает Media source API (напр. Internet Explorer < 11), либо 'NO_PLAYABLE_SOURCE_FOUND' в остальных случаях
  • onLatencyAdjustSeek( from, to )
    Вызывается после автоматической операции поиска для восстановления задержки потока (параметр latency_tolerance должен быть установлен).
    Параметры:
    • from - позиция в секундах, с которой произведена операция поиска
    • to - позиция в секундах, на которую произведена операция поиска
  • onLowBuffer()
    Вызывается, когда у плеера не достаточно данных для того, чтобы продолжить воспроизведение потока.
  • onVUMeterUpdate( magnitudes, decibels )
    Вызывается каждый раз, когда уровень звука вычислен для очередных 2048 сэмплов. Таким образом для 48KHz аудио данный колбэк будет вызываться примерно 24 раза в секунду. Частота вызовов может быть ограничена параметром rate. Колбэк имеет смысл только если определены настройки волюметра. Колбэк вызывается в контексте главного треда браузера, поэтому в нем не должно быть никаких вызовов, связанных с отрисовкой UI (для этой цели используйте метод window.requestAnimationFrame).
    Параметры:
    • magnitudes - массив значений сигнала для каждого канала, рассчитанных в соответствии с режимом (mode), указанным в настройках волюметра. Возможные значения должны быть от 0 до 1, но могут быть и больше 1, если так задано в источнике звука.
    • decibels - массив значений уровня звука для каждого канала в децибелах, рассчитанный в соответствии с режимом (mode), указанным в настройках волюметра. Возможные значения должны быть от -100 дБ до 0 дБ, но могут быть и больше 0, если так задано в источнике звука.

Пример реализации

Можно пройти на страницу примера и начать просмотр, чтобы увидеть как можно применить SDK для проигрывания потоков на своей странице

Подписаться