MediaSource: addSourceBuffer() 方法
注意：此功能在 專用 Web Workers 中可用。
addSourceBuffer() 方法用於 MediaSource 介面，它根據指定的 MIME 型別建立一個新的 SourceBuffer，並將其新增到 MediaSource 的 sourceBuffers 列表中。新建立的 SourceBuffer 物件也會被返回。
語法
js
addSourceBuffer(mimeType)
引數
mimeType-
一個字串，指定要建立並新增到
MediaSource的SourceBuffer的 MIME 型別。
返回值
一個 SourceBuffer 物件，代表已建立並新增到媒體源的新源緩衝區。
異常
InvalidAccessErrorDOMException-
如果為
mimeType指定的值為空字串而不是有效的 MIME 型別，則丟擲此異常。 InvalidStateErrorDOMException-
如果
MediaSource的readyState不是"open"，則丟擲此異常。 NotSupportedErrorDOMException-
如果 使用者代理不支援指定的
mimeType，或者它與媒體源sourceBuffers列表中已包含的其他SourceBuffer物件的 MIME 型別不相容，則丟擲此異常。 QuotaExceededError-
如果使用者代理無法處理更多
SourceBuffer物件，或者使用給定的mimeType建立新的SourceBuffer會導致 不支援的SourceBuffer配置，則丟擲此異常。
示例
以下程式碼段來自 Nick Desaulniers 編寫的示例（線上檢視完整演示，或下載原始碼以供進一步研究）。函式 getMediaSource()（此處未定義）返回一個 MediaSource。
js
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);
});
}
規範
| 規範 |
|---|
| Media Source Extensions™ # dom-mediasource-addsourcebuffer |
瀏覽器相容性
載入中…