javascript–无法通过MediaSourceAPI附加细分,获取“InvalidStateError：尝试使用不可用或不再可用的对象

我使用以下示例程序追加媒体文件,但得到“Uncaught InvalidStateError：尝试使用一个不可用或不再可用的对象”错误,它在第一个瞬间命中“mediaSource.sourceBuffers [0] .appendBuffer(mediaSegment);”.我使用的是Chrome 31.0.1650.57.谁能建议我解决这个问题？

https://github.com/jbochi/media-source-playground/blob/master/test.html

我已完成以下修改以附加文件.

var buffer_len = 0;

function HaveMoreMediaSegments(){
//return false; //return buffers.length > 0;

return buffers.length > buffer_len;

}

//var GetNextMediaSegment = GetInitializationSegment;

function GetNextMediaSegment(){

var buffer = buffers[buffer_len];

buffers = buffers.slice(1);

buffer_len = buffer_len + 1;

return buffer;

}

并改变了

mediaSource.sourceBuffers[0].append(mediaSegment);

to

mediaSource.sourceBuffers[0].appendBuffer(mediaSegment);

和

sourceBuffer.append(initSegment);

to

sourceBuffer.appendBuffer(initSegment);

因为append方法在我的环境中不起作用.

我在window.setTimeout()事件中使用sourceopen而不是webkitsourceopen.

mediaSource.addEventListener(‘sourceopen’, onSourceOpen.bind(this, video));

解决方法:

问题是,在附加数据后,SourceBuffer实例在其工作时暂时无法使用.在此期间,SourceBuffer的更新属性将设置为true,因此很容易检查.

但是处理这个问题最简单的方法可能就是监听updateend事件,只是排队所有缓冲区,只在SourceBuffer告诉你它准备好新的缓冲区时才附加它们.像这样：

// store the buffers until you're ready for them
var queue = [];
// whatever normally would have called appendBuffer(buffer) can
// now just call queue.push(buffer) instead
sourceBuffer.addEventListener('updateend', function() {
if ( queue.length ) {
sourceBuffer.appendBuffer(queue.shift());
}
}, false);


请记住,为了触发第一个事件,您需要手动附加第一个缓冲区,而不是推送到队列.之后,只需将所有内容转储到数组中.