Перевод не завершен. Пожалуйста, помогите перевести эту статью с английского.

Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

MediaSource – это интерфейс Media Source Extensions API для предоставления интерактивного источника медиаданных объектам типа HTMLMediaElement.

Конструктор

MediaSource()
Создает и возвращает новый объект MediaSource не имеющий подключенных буферов данных.

Свойства

Наследует свойства родительского интерфейса , EventTarget.

MediaSource.sourceBuffers Только для чтения
Возвращает объект типа SourceBufferList  содержащий список объектов типа SourceBuffer , связанных непосредственно с текущим MediaSource.
MediaSource.activeSourceBuffers Только для чтения
Возвращает объект типа SourceBufferList содержащий подмножество объектов типа SourceBuffer хранящих в себе другие объекты типа SourceBuffers — список объектов, предоставляющих доступ к выбранному видео, доступным аудиодорожкам, текстовым данным и тд.
MediaSource.readyState Только для чтения
Возвращает enum, отображающий состояние текущего MediaSource-объекта, будь то отсутствие подключения к медиа-элементу(closed), подключенный и готовый к передаче объектов типа SourceBuffer (open), или подключенный, но с завершенным потоком MediaSource.endOfStream() (ended.)
MediaSource.duration
Возвращает или устанавливает продолжительность предоставляемых медиаданных.

Методы

Наследует свойства родительского интерфейса, EventTarget.

MediaSource.addSourceBuffer()
Создает новый объект типа SourceBuffer, с указанным  MIME-типом и добавляет в список MediaSource's SourceBuffers.
MediaSource.removeSourceBuffer()
Удаляет указанный SourceBuffer из списка SourceBuffers, связанного с текущим MediaSource-объектом.
MediaSource.endOfStream()
Сигнализирует об окончании потока.

Статичные методы

MediaSource.isTypeSupported()
Возвращает значение Boolean, поясняющее, поддерживается ли клиентом полученный MIME-тип  — если это так, то можно успешно создать объект типа SourceBuffer для этого MIME-типа.

Примеры

Нижеприведенный простой пример подгружает видео фрагмент за фрагментом так скоро, как может, воспроизводя их "как только так сразу". Этот пример был написан Nick Desaulniers и может быть просмотрен здесь в виде демо (также вы можете загрузить исходный код для дальнейшего изучения.)

var video = document.querySelector('video');

var assetURL = 'frag_bunny.mp4';
// Need to be specific for Blink regarding codecs
// ./mp4info frag_bunny.mp4 | grep Codec
var mimeCodec = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"';

if ('MediaSource' in window && MediaSource.isTypeSupported(mimeCodec)) {
  var mediaSource = new MediaSource();
  //console.log(mediaSource.readyState); // closed
  video.src = URL.createObjectURL(mediaSource);
  mediaSource.addEventListener('sourceopen', sourceOpen);
} else {
  console.error('Unsupported MIME type or codec: ', mimeCodec);
}

function sourceOpen (_) {
  //console.log(this.readyState); // open
  var mediaSource = this;
  var sourceBuffer = mediaSource.addSourceBuffer(mimeCodec);
  fetchAB(assetURL, function (buf) {
    sourceBuffer.addEventListener('updateend', function (_) {
      mediaSource.endOfStream();
      video.play();
      //console.log(mediaSource.readyState); // ended
    });
    sourceBuffer.appendBuffer(buf);
  });
};

function fetchAB (url, cb) {
  console.log(url);
  var xhr = new XMLHttpRequest;
  xhr.open('get', url);
  xhr.responseType = 'arraybuffer';
  xhr.onload = function () {
    cb(xhr.response);
  };
  xhr.send();
};

Specifications

Specification Status Comment
Media Source Extensions
Определение 'MediaSource' в этой спецификации.
Рекомендация Initial definition.

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 23-webkit
31
(Да) 25.0 (25.0)[1]
42.0 (42.0)
11[2] 15 8
Feature Android Edge Firefox Mobile (Gecko) Firefox OS (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 4.4.4 (Да)

41.0

41.0 11 30 Нет

[1] Available after switching the about:config preference media.mediasource.enabled to true. In addition, support was limited to a whitelist of sites, for example YouTube, Netflix, and other popular streaming sites. The whitelist was removed and Media Source Extensions was enabled by default in 42+ for all sites.

[2] Only works on Windows 8+.

See also

Метки документа и участники

Внесли вклад в эту страницу: oboshto, Fell-x27
Обновлялась последний раз: oboshto,