CODEWITHSUNDEEP
javascriptfrontendhtml5-videomedia-source
namnv
namnv

Reputation: 49

How to seek video when playing from MediaSource

I followed this guide: https://github.com/nickdesaulniers/netfix/blob/gh-pages/demo/bufferWhenNeeded.html

When the user selects a play point on the progress bar.

will call seek() to return the corresponding data then append the data to sourceBuffer,

    function seek(e) {
        const start = (Math.round((totalFileSize / video.duration) * video.currentTime));
        const end = (start + Math.round(start / 5));
        fetchRange(assetURL, start, end);
    };

    function fetchRange(url, start, end) {
        var xhr = new XMLHttpRequest;
        xhr.open('get', url);
        xhr.responseType = 'arraybuffer';
        xhr.setRequestHeader('Range', 'bytes=' + start + '-' + end);
        xhr.onload = function () {
            console.log('fetched bytes: ', start, end);
            bytesFetched += end - start + 1;
            sourceBuffer.appendBuffer(chunk);
        };
        xhr.send();
    };

however i always get an error:

"Failed to execute 'appendBuffer' on 'SourceBuffer': The HTMLMediaElement.error attribute is not null."

I really searched a lot but couldn't solve it,

I'm really grateful someone can help.

Upvotes: 1

Views: 567

Answers (0)

Related Questions