无法将数据块附加到MediaSource SourceBuffer

时间:2018-03-29 14:15:13

标签: node.js reactjs streaming socket.io-1.0 media-source

我正在尝试使用socket.io-stream和MediaSource来传输视频。 在客户端响应我试图将我从服务器接收的数据块与socket.io-stream放在一起。所以我的代码看起来像这样:

componentWillReceiveProps(nextProps) {
    nextProps.socket.emit('startDownload', <link to some video>);
    ss(nextProps.socket).on('startStreaming', (stream) => {

        var mediaSource = new MediaSource();

        var video = document.getElementById('video');
        video.src = window.URL.createObjectURL(mediaSource);

        mediaSource.addEventListener('sourceopen', function(event) {
            var sourceBuffer = mediaSource.addSourceBuffer('video/mp4; codecs="avc1.4d401f"');

            sourceBuffer.addEventListener('updatestart', function(e) { console.log('updatestart: ' + mediaSource.readyState); });
            sourceBuffer.addEventListener('updateend', function(e) { console.log('updateend: ' + mediaSource.readyState); });

            stream.on('data', (chunk) => {
                console.log(chunk)
                if (!sourceBuffer.updating) {
                    sourceBuffer.appendBuffer(chunk);
                }
            });
        });
    });
}

在服务器端,我像这样发送流:

var streamedFile = file.createReadStream();

const stream = ss.createStream();
ss(socket).emit('startStreaming', stream);
streamedFile.pipe(stream);

我假设服务器端工作正常,因为我在我的控制台中得到了这个:

Uint8Array(524288) [0, 0, 0, 20, 102, 116, 121, 112, 105, 115, 111, 109, 0, 0, 0, 1, 105, 115, 111, 109, 0, 9, 191, 188, 109, 111, 111, 118, 0, 0, 0, 108, 109, 118, 104, 100, 0, 0, 0, 0, 208, 240, 59, 228, 208, 240, 59, 228, 0, 0, 2, 88, 0, 11, 70, 72, 0, 1, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, …]
updatestart: open
updateend: open

Uint8Array(524288) [0, 0, 1, 119, 0, 0, 1, 18, 0, 0, 0, 254, 0, 0, 0, 241, 0, 0, 0, 234, 0, 0, 1, 133, 0, 0, 1, 95, 0, 0, 0, 243, 0, 0, 0, 230, 0, 0, 0, 219, 0, 0, 1, 96, 0, 0, 1, 86, 0, 0, 0, 240, 0, 0, 0, 243, 0, 0, 0, 238, 0, 0, 0, 216, 0, 0, 1, 133, 0, 0, 1, 4, 0, 0, 0, 242, 0, 0, 0, 218, 0, 0, 0, 235, 0, 0, 1, 7, 0, 0, 0, 241, 0, 0, 0, 226, 0, 0, 0, 229, …]
updatestart: open
error: ended
updateend: ended

似乎sourceBuffer.append第一次工作,然后我收到消息错误:

Failed to execute 'appendBuffer' on 'SourceBuffer': This SourceBuffer has been removed from the parent media source.

0 个答案:

没有答案