MediaSource: Methode addSourceBuffer()
Hinweis: Dieses Feature ist verfügbar in Dedicated Web Workers.
Die addSourceBuffer()
-Methode der MediaSource
-Schnittstelle erstellt ein neues SourceBuffer
des angegebenen MIME-Typs und fügt es der sourceBuffers
-Liste der MediaSource
hinzu. Das neue SourceBuffer
wird ebenfalls zurückgegeben.
Syntax
addSourceBuffer(mimeType)
Parameter
mimeType
-
Ein String, der den MIME-Typ des zu erstellenden und der
MediaSource
hinzuzufügendenSourceBuffer
angibt.
Rückgabewert
Ein SourceBuffer
-Objekt, das den neuen Quellpuffer darstellt, der erstellt und der Medienquelle hinzugefügt wurde.
Ausnahmen
InvalidAccessError
DOMException
-
Wird ausgelöst, wenn der für
mimeType
angegebene Wert ein leerer String anstelle eines gültigen MIME-Typs ist. InvalidStateError
DOMException
-
Wird ausgelöst, wenn die
MediaSource
nicht im Zustand"open"
desreadyState
ist. NotSupportedError
DOMException
-
Wird ausgelöst, wenn der angegebene
mimeType
vom User Agent nicht unterstützt wird oder nicht kompatibel mit den MIME-Typen andererSourceBuffer
-Objekte ist, die bereits in dersourceBuffers
-Liste der Medienquelle enthalten sind. QuotaExceededError
DOMException
-
Wird ausgelöst, wenn der User Agent keine weiteren
SourceBuffer
-Objekte verarbeiten kann oder das Erstellen eines neuenSourceBuffer
mit dem angegebenenmimeType
zu einer nicht unterstützten Konfiguration vonSourceBuffer
s führen würde.
Beispiele
Das folgende Snippet stammt aus einem Beispiel von Nick Desaulniers (sehen Sie sich das vollständige Live-Demo an oder laden Sie den Quellcode herunter für weitere Untersuchungen). Die Funktion getMediaSource()
, die hier nicht definiert ist, gibt eine MediaSource
zurück.
const assetURL = "frag_bunny.mp4";
// Need to be specific for Blink regarding codecs
// ./mp4info frag_bunny.mp4 | grep Codec
const mimeCodec = 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"';
const mediaSource = getMediaSource();
if ("MediaSource" in window && MediaSource.isTypeSupported(mimeCodec)) {
console.log(mediaSource.readyState); // closed
mediaSource.addEventListener("sourceopen", sourceOpen);
video.src = URL.createObjectURL(mediaSource);
} else {
console.error("Unsupported MIME type or codec: ", mimeCodec);
}
function sourceOpen() {
console.log(this.readyState); // open
const sourceBuffer = mediaSource.addSourceBuffer(mimeCodec);
fetchAB(assetURL, (buf) => {
sourceBuffer.addEventListener("updateend", () => {
mediaSource.endOfStream();
video.play();
console.log(mediaSource.readyState); // ended
});
sourceBuffer.appendBuffer(buf);
});
}
Spezifikationen
Specification |
---|
Media Source Extensions™ # dom-mediasource-addsourcebuffer |
Browser-Kompatibilität
BCD tables only load in the browser