mediasource readystate如何改变其状态

时间:2014-04-01 03:29:50

标签: javascript html5 filereader media-source

在浏览完在线文档后,我编写了下面提到的代码。每当它是一个小尺寸的文件,它运作良好。但是对于更大的文件,我收到错误:Uncaught InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable。这是因为mediasource.readystate已更改为关闭。我无法确定哪个语句更改为readystate,从close到open然后再返回close。我在所有地方记录了readystate值。它在mediacallback方法中更改为打开。什么引发了这种变化?

WT = (function () {
var mediaSource = new MediaSource();
function fileSelected(evt) {
    var video = document.getElementById("vid");
    var file = evt.target.files[0];
    if (file) {
        var NUM_CHUNKS = 10000, i = 0;
        var chunkSize = Math.ceil(file.size / NUM_CHUNKS);
        console.log(mediaSource.readyState);
        video.src = window.URL.createObjectURL(mediaSource);
        console.log(mediaSource.readyState);
        var queue = [];


        var mediaCallback = function (e) {
            console.log(mediaSource.readyState);
            var sourceBuffer = mediaSource.addSourceBuffer('video/mp4; codecs="avc1.42E01E, mp4a.40.2"');
            sourceBuffer.addEventListener('updateend', function() {
                console.log("update end");
                if (queue.length ) {
                    sourceBuffer.appendBuffer(queue.shift());
                }
            }, false);
            (function readChunk(i) {
                var reader = new FileReader();
                reader.onload = function(et) {
                    var buff = new Uint8Array(et.target.result);
                    if(!sourceBuffer.updating && queue.length === 0) {
                        sourceBuffer.appendBuffer(buff);
                    } else {
                        queue.push(buff);
                    }
                    if (i == NUM_CHUNKS - 1) {
                        console.log("end of stream");
                        mediaSource.endOfStream();
                    } else {
                        if (video.paused) {
                            console.log("video puased");
                            video.play(); // Start playing after 1st chunk is appended.
                        }
                        readChunk(++i);
                    }
                };

                var startByte = chunkSize * i;
                var chunk = file.slice(startByte, startByte + chunkSize);

                reader.readAsArrayBuffer(chunk);
            })(i);
        }
        mediaSource.addEventListener('sourceopen', mediaCallback, false);
        mediaSource.addEventListener('sourceended', function(e) {
            console.log('ended: mediaSource readyState: ' + this.readyState);
        }, false);
        mediaSource.addEventListener('sourceclose', function(e) {
            console.log('closed: mediaSource readyState: ' + this.readyState);
        }, false);

    } else {
        console.log("NO FILE SELECTED");
    }
}

return {
    init: function() {
        console.log("Onclick");
        if (window.File && window.FileReader && window.FileList && window.Blob) {
            $("document").ready(function(){
                $("#fileToUpload").on("change", fileSelected);
            });
        } else {
            alert('The File APIs are not fully supported in this browser.');
        }
    }
}
})();
WT.init();

0 个答案:

没有答案