ManagedMediaSource: ManagedMediaSource() constructor
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Note: This feature is available in Dedicated Web Workers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The ManagedMediaSource() constructor of the ManagedMediaSource interface constructs and returns a new ManagedMediaSource object instance with no associated source buffers.
Syntax
js
new ManagedMediaSource()
Parameters
None.
Return value
A new ManagedMediaSource object instance.
Examples
Creating a ManagedMediaSource and attaching it to a video element
The following example creates a new ManagedMediaSource, attaches it to a <video> element, and uses the startstreaming event to begin fetching media data.
js
const videoUrl =
"https://mdn.github.io/shared-assets/videos/flower-fragmented.mp4";
const mediaType = 'video/mp4; codecs="avc1.64001F, mp4a.40.2"';
if (ManagedMediaSource.isTypeSupported(mediaType)) {
const source = new ManagedMediaSource();
const video = document.createElement("video");
video.controls = true;
video.disableRemotePlayback = true;
video.src = URL.createObjectURL(source);
document.body.appendChild(video);
source.addEventListener("sourceopen", () => {
const sourceBuffer = source.addSourceBuffer(mediaType);
source.addEventListener("startstreaming", async () => {
console.log("startstreaming — fetching media data");
const response = await fetch(videoUrl);
const data = await response.arrayBuffer();
sourceBuffer.appendBuffer(data);
});
});
}
Specifications
| Specification |
|---|
| Media Source Extensions™ # dom-managedmediasource-constructor |