Javascript - buffer video from blobs source?

Question

Context:

Fiddling with javascript.

Html5 browser.

Question:

Is it possible to have, say, two video blobs and buffer their content in a video tag and play them smoothly without concatenating them at first ?

The underlying is : is it possible to dynamically add data to the video buffer in javascript in the browsers at any moment (the video may have already started to play and we still add data from a blob after that)?

All the solutions seems to need the whole data at the beginning.

Antonin M. · Accepted Answer · 2015-05-22 11:21:21Z

1

There is the Media Source API which is, unfortunately, only available on Chrome. AFAIK it only works with webm container and vorbis and vp8 codecs.

var ms = new MediaSource();

var video = document.querySelector('video');
video.src = window.URL.createObjectURL(ms);

ms.addEventListener('sourceopen', function(e) {
    ...
    var sourceBuffer = ms.addSourceBuffer('video/webm; codecs="vorbis,vp8"');
    sourceBuffer.appendBuffer(oneVideoWebMChunk);
    ....
}, false);

Here is a little demo

W3C draft

answered May 22, 2015 at 11:21

Antonin M.

1,7841 gold badge19 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Larry Over a year ago

I feared that answer :) i will have to find a way to smooth transition between two videos then..

Collectives™ on Stack Overflow

Javascript - buffer video from blobs source?

Context:

Question:

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

Context:

Question:

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related