From 074785cea106179cb3305637055ab0a009ca74f2 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:52 -0500 Subject: initial commit --- files/ru/web/api/mediasource/index.html | 194 ++++++++++++++++++++++++++++++++ 1 file changed, 194 insertions(+) create mode 100644 files/ru/web/api/mediasource/index.html (limited to 'files/ru/web/api/mediasource') diff --git a/files/ru/web/api/mediasource/index.html b/files/ru/web/api/mediasource/index.html new file mode 100644 index 0000000000..86746ab4e1 --- /dev/null +++ b/files/ru/web/api/mediasource/index.html @@ -0,0 +1,194 @@ +--- +title: MediaSource +slug: Web/API/MediaSource +tags: + - Видео + - Интерфейс + - Источник + - Потоковое медиа + - Расширение + - аудио +translation_of: Web/API/MediaSource +--- +

{{APIRef("Media Source Extensions")}}{{SeeCompatTable}}

+ +

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

+ +

Конструктор

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

Свойства

+ +

Наследует свойства родительского интерфейса , {{domxref("EventTarget")}}.

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

Методы

+ +

Наследует свойства родительского интерфейса, {{domxref("EventTarget")}}.

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

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

+
+
{{domxref("MediaSource.isTypeSupported()")}}
+
Возвращает значение {{domxref("Boolean")}}, поясняющее, поддерживается ли клиентом полученный MIME-тип  — если это так, то можно успешно создать объект типа {{domxref("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

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Media Source Extensions', '#mediasource', 'MediaSource')}}{{Spec2('Media Source Extensions')}}Initial definition.
+ +

Browser compatibility

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support23{{property_prefix("-webkit")}}
+ 31		{{CompatVersionUnknown}}{{CompatGeckoDesktop("25.0")}}[1]
+ {{CompatGeckoDesktop("42.0")}}		11[2]158
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidEdgeFirefox Mobile (Gecko)Firefox OS (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support4.4.4{{CompatVersionUnknown}} +

41.0

+ 		41.01130{{CompatNo}}
+
+ +

[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

+ + -- cgit v1.2.3-54-g00ecf