Question

我正在尝试使用socket.io通过ffmpeg流式播放rtsp直播流（这样可以正常工作），但现在我需要从套接字中获取该视频并在HTML5视频标记上播放

要执行此操作，我正在使用MediaSurce，通过套接字获取小块视频，然后将其附加到MediaSource

此解决方案会在几秒钟内重现视频，然后突然停止并且它不会在Chrome console

上给我任何错误

    var socket = io();

    var ms = new MediaSource();
    var sourceBuffer;
    var queue = [];
    var video = document.getElementById("video");
    video.src = window.URL.createObjectURL(ms);

    socket.on('start', function (response) {
        console.log(response);
        socket.emit('streaming', $stateParams.id);
        ms.addEventListener('sourceopen', videoLoad, false);
        ms.addEventListener('sourceclose', videoClosed, false);
    });


    function videoLoad() {
        sourceBuffer = ms.addSourceBuffer('video/webm; codecs="vorbis,vp8"');
        sourceBuffer.addEventListener('update', function () {
            if (queue.length > 0 && !sourceBuffer.updating) {
                console.log(queue.length);
                sourceBuffer.appendBuffer(queue.shift());
            }
        });

        socket.on('data', function (response) {
            var bytes = new Uint8Array(response);
            var blob = new Blob(bytes);
            console.log(blob.size);
            if (sourceBuffer.updating || queue.length > 0) {
                queue.push(bytes);
            } else {
                sourceBuffer.appendBuffer(bytes);
            }
        });
    }

    function videoClosed(e) {
        console.log('mediaSource readyState: ' + this.readyState);
    }

在我的chrome://media-internals/视频播放器日志中显示我几次，然后视频停止

video_buffering_state   BUFFERING_HAVE_ENOUGH

MediaSource通过套接字停止

0 个答案: