在 appendBuffer 之后关闭 MediaSource答案

【问题标题】：MediaSource closed after appendBuffer在 appendBuffer 之后关闭 MediaSource
【发布时间】：2018-02-02 16:31:01
【问题描述】：

我尝试使用 MediaSource 播放两个视频，但其中只有一个有效。两者都将编解码器设置为 avc1.4d401f 和 mp4a.40.2，但其中一个播放得很好，另一个在我调用 SourceBuffer 上的 appendBuffer 时立即关闭 MediaSource。代码相关位如下：

var mainSource;
var mimeCoded = 'video/mp4; codecs="avc1.4d401f,mp4a.40.2"';

    mainSource = new MediaSource();
    var sourceBuffer;

    mainSource.addEventListener('sourceopen', () => {
        console.log('readystate', mainSource.readyState);
        var xhr = new XMLHttpRequest();
        xhr.responseType = 'arraybuffer';
        xhr.open('get', 'main.mp4');
        xhr.addEventListener('load', (e) => {
            sourceBuffer = mainSource.addSourceBuffer(mimeCoded);
            sourceBuffer.mode = 'sequence';
            sourceBuffer.addEventListener('updateend', onUpdateEnd);
            sourceBuffer.appendBuffer(e.target.response);
            console.log('updating', sourceBuffer.updating);
        });
        xhr.send();

    });

    vid.src = URL.createObjectURL(mainSource);

    onUpdateEnd = function ()
    {
        console.log('readystate2', mainSource.readyState, sourceBuffer.updating);
        vid.play();
        sourceBuffer.removeEventListener('updateend', onUpdateEnd);
    };

当使用其中一个视频时，mainSource.readyState 上的两个日志都将输出 open，但另一个日志会在第二个日志上显示 closed（因此在 vid.play() 上出现错误）。我已经对可能发生的事情一无所知，因此感谢您提供任何帮助。

【问题讨论】：

标签： javascript media-source

【解决方案1】：

回答以供进一步参考，要使其正常工作，视频必须在编码时分段。使用以下 ffmpeg 命令可以解决问题：

ffmpeg -i input.mp4 -movflags frag_keyframe+empty_moov+default_base_moof output_frag.mp4

【讨论】：