Javascript 使用媒体源扩展的视频流问题

我似乎有一个很奇怪的问题。我正在尝试播放一段视频，该视频正在使用网络浏览器进行直播。为此，我将查看MediaSource对象。我已经得到了它的方式，使视频是从一个服务器在块播放。问题是，第一个块正确播放，然后播放停止

更奇怪的是，如果我在开始播放流媒体后让电脑进入睡眠状态，然后将其唤醒，视频将按预期播放

一些注意事项：

我目前正在使用chrome

我试过这两种方法，有没有打过MediaSource的endOfStream

var VF = 'video/webm; codecs="vp8,opus"';
var FC = 0;
alert(MediaSource.isTypeSupported(VF));

var url = window.URL || window.webkitURL;
var VSRC = new MediaSource();
var VURL = URL.createObjectURL(VSRC);
var bgi, idx = 1;
var str, rec, dat = [], datb, brl;
var sbx;

//connect the mediasource to the <video> elment first.
vid2.src = VURL;

VSRC.addEventListener("sourceopen", function () {
    // alert(VSRC.readyState);
    //Setup the source only once.
    if (VSRC.sourceBuffers.length == 0) {
        var sb = VSRC.addSourceBuffer(VF);
        sb.mode = 'sequence';
        sb.addEventListener("updateend", function () {
            VSRC.endOfStream();
        });
        sbx = sb;
    }
});


//This function will be called each time we get more chunks from the stream.
dataavailable = function (e) {
            //video is appended to the sourcebuffer, but does not play in video element
            //Unless the computer is put to sleep then awaken!?
            sbx.appendBuffer(e.result);
            FC += 1;
            //These checks behave as expected.
            len.innerHTML = "" + sbx.buffered.length + "|" + VSRC.duration;
            CTS.innerHTML = FC;
};

var VF='video/webm；codecs=“vp8，opus”；
var FC=0；
警报（MediaSource.isTypeSupported（VF））；
var url=window.url | | window.webkitURL；
var VSRC=new MediaSource（）；
var VURL=URL.createObjectURL（VSRC）；
var bgi，idx=1；
变量str，rec，dat=[]，datb，brl；
var-sbx；
//首先将mediasource连接到elment。
vid2.src=VURL；
VSRC.addEventListener（“sourceopen”，函数（）{
//警报（VSRC.readyState）；
//仅设置源一次。
if（VSRC.sourceBuffers.length==0）{
var sb=VSRC.addSourceBuffer（VF）；
sb.mode=‘顺序’；
sb.addEventListener（“更新”，函数（）{
VSRC.endOfStream（）；
});
sbx=sb；
}
});
//每当我们从流中获得更多块时，就会调用此函数。
数据可用=功能（e）{
//视频附加到源缓冲区，但不在视频元素中播放
//除非计算机处于睡眠状态，否则请将其唤醒！？
sbx.appendBuffer（即结果）；
FC+=1；
//这些检查的行为符合预期。
len.innerHTML=“”+sbx.buffered.length+“|”+VSRC.duration；
CTS.innerHTML=FC；
};

---

你犯了两个大错误：

当sbx.updateing属性为false时，只能调用sbx.appendBuffer，否则appendBuffer将失败。因此，实际上您需要做的是拥有一个区块队列，如果sbx.updateing为true，则向队列添加一个区块：

if (sbx.updating || segmentsQueue.length > 0)
    segmentsQueue.push(e.result);
else
    sbx.appendBuffer(e.result);

您的代码明确表示在第一个区块之后停止播放：

sb.addEventListener("updateend", function () {
    VSRC.endOfStream();
        });

以下是您真正需要做的：

sb.addEventListener("updateend", function () {
    if (!sbx.updating && segmentsQueue.length > 0) {
        sbx.appendBuffer(segmentsQueue.shift());
    }
});