Можно ли отображать фрагменты видео с веб-камеры с помощью Media Source Extension? - PullRequest
Новая
       16

Можно ли отображать фрагменты видео с веб-камеры с помощью Media Source Extension?

0 голосов
/ 16 октября 2018

Я ищу способ создания фрагментов видео из потока веб-камеры и подачи их в расширение Media Source.

Я пытался использовать этот код, но он не работает: 

 var mediaConstraints = {
    audio: true,
    video: true
};

navigator.getUserMedia(mediaConstraints, onMediaSuccess, onMediaError);


function onMediaSuccess(stream) {
    var multiStreamRecorder = new MultiStreamRecorder(stream);
    multiStreamRecorder.mimeType = 'video/webm; codecs="opus, vp09.00.10.08"';
    multiStreamRecorder.ondataavailable = function (blob) {
        // blobs.audio
        // blobs.video

        console.log('data available');
        var fileReader = new FileReader();
        fileReader.onload = function(event) {
            var arrayBuffer = event.target.result;
            console.log(arrayBuffer);
            console.log('appending buffer');
            sourceBuffer2.appendBuffer(arrayBuffer);
            //sourceBuffer2.appendBuffer(blob);
            if (!playing)
            {
                playing = true;
                video2.play();
            }
        };
        fileReader.readAsArrayBuffer(blob);

    };
    multiStreamRecorder.start(3000);
}

function onMediaError(e) {
    console.error('media error', e);
}

var ms2 = new MediaSource();

var video2 = document.getElementById('video2');
video2.src = window.URL.createObjectURL(ms2);
//video2.crossOrigin = 'anonymous';
var sourceBuffer2;
ms2.addEventListener('sourceopen', function(e) {
sourceBuffer2 = ms2.addSourceBuffer('video/webm; codecs="opus, vp09.00.10.08"');
    //sourceBuffer2.appendBuffer(arrayBuffer);

}, false);

ms2.addEventListener('updateend', function(e) {
    console.log('update');
    sourceBuffer2.appendBuffer(arrayBuffer);
}, false);

В результате получается, что некоторые ArrayBuffers с содержимым видео генерируются, но не отображаются.Консоль показывает ошибки Uncaught (in promise) DOMException: Failed to load because no supported source was found., а затем Uncaught DOMException: Failed to execute 'appendBuffer' on 'SourceBuffer': This SourceBuffer has been removed from the parent media source. at FileReader.fileReader.onload

Что я делаю не так?

1 Ответ

0 голосов
/ 16 августа 2019

@ Комментарий Kaiido правильный

Да, возможно, ваша проблема, вероятно, в том, что используемый вами кодек не поддерживается: jsfiddle.net/dcowst62 Голосование за опечатку.

Использование: 

addSourceBuffer('video/webm; codecs="vp8"');

вместо 

addSourceBuffer('video/webm; codecs="opus, vp09.00.10.08"');
...