appendBuffer

Summary

Appends the specified media segment to the SourceBuffer.

Method of apis/media_source_extensions/MediaSource apis/media_source_extensions/MediaSource

Syntax

 SourceBuffer.appendBuffer(data);

Parameters

data

Data-type: VARIANT

Type: ArrayBuffer. The media segment to append

Return Value

No return value

Examples

This example uses XMLHttpRequest to get a segment of video (range) from a file (url) and appends it to the current sourceBuffer.



//  Load video's initialization segment
function initVideo(range, url) {
  var xhr = new XMLHttpRequest();
  if (range || url) { // make sure we've got incoming params
    // Set the desired range of bytes we want from the mp4 video file
    xhr.open('GET', url);
    xhr.setRequestHeader("Range", "bytes=" + range);
    segCheck = (timeToDownload(range) * .8).toFixed(3); // use .8 as fudge factor
    xhr.send();
    xhr.responseType = 'arraybuffer';
    try {   xhr.addEventListener("readystatechange", function () {
         if (xhr.readyState == xhr.DONE) { // wait for video to load
          // Add response to buffer
          try {            videoSource.appendBuffer(new Uint8Array(xhr.response));
            // Wait for the update complete event before continuing            videoSource.addEventListener("update",updateFunct, false);
          } catch (e) {
            log('Exception while appending initialization content', e);
          }
        }
      }, false);
    } catch (e) {
      log(e);
    }
  } else {
    return // No value for range or url
  }
}
function updateFunct() {
  //  This is a one shot function, when init segment finishes loading,
  //    update the buffer flag, call getStarted, and then remove this event.
  bufferUpdated = true;
  getStarted(file); // Get video playback started
  //  Now that video has started, remove the event listener
videoSource.removeEventListener("update", updateFunct);
}

Related specifications

Media Source Extensions: W3C Candidate Recommendation

Attributions

Microsoft Developer Network.