Могу ли я использовать несколько веб-камер одновременно в видео js?

Question

Я использую этот пример: https://github.com/collab-project/videojs-record/blob/master/examples/change-video-input.html И я хочу использовать несколько веб-камер (например, встроенный ноутбук и веб-камеру USB) одновременно в нескольких тегах «видео».

Я пытаюсь получить все подключенные устройства:

(async () => {
        await navigator.mediaDevices.getUserMedia({audio: false, video: true});
        let devices = await navigator.mediaDevices.enumerateDevices();
        devices = devices.filter(device => device.kind === 'videoinput')
        createPlayer(devices);
    })();

в функции createPlayers:

let j=1,deviceInfo;
for (i = 0; i !== devices.length; ++i) {
        deviceInfo = devices[i];
        createPlayer("video_" + j, deviceInfo.deviceId)
        j = j + 1;

в createPlayer fn c:

function createPlayer(id, src) {        
    let player = videojs(id, {
        controls: true,
        fluid: true,
        controlBar: {
            volumePanel: false,
        },
        plugins: {
            record: {
                audio: false,                
                video: {                   
                    soruceId: src
                },
                videoMimeType: 'video/mp4',
                maxLength: 10,
                convertEngine: 'ts-ebml',
                debug: true,
                frameWidth: 320,
                frameHeight: 240,

            }
        }
    }, function () {        
    });


    player.on('deviceReady', function () {       
        player.record().enumerateDevices();
    });

    player.on('ready', function () {
        player.record().getDevice();
    });

    player.on('enumerateReady', function () {        
        devices = player.record().devices;
    });

    // error handling
    player.on('enumerateError', function () {
        console.log('enumerate error:', player.enumerateErrorCode);
    });

    // error handling
    player.on('deviceError', function () {
        console.warn('device error:', player.deviceErrorCode);
    });

    player.on('error', function (element, error) {
        console.error(error);
    });

    // user clicked the record button and started recording
    player.on('startRecord', function () {
        console.log('started recording!');
        recordedFramerate = deviceFrameRate;
    });

    // user completed recording and stream is available
    player.on('finishRecord', function () {
        console.log('finished recording: ', player.recordedData);
    });

    player.on('finishConvert', function () {
        // the convertedData object contains the converted data that
        // can be downloaded by the user, stored on server etc.
        console.log('finished converting: ', player.convertedData);
        readAsBuffer(player.convertedData).then(function (videoTypedArray) {
            recordedVideo = videoTypedArray;
        });
    });
}

в html :

 <div class="row">
        <div class="col-xs-6">
            <video id="video_1"
              class="video-js vjs-default-skin"></video>
        </div>
        <div class="col-xs-6">
      
            <video id="video_2"
              class="video-js vjs-default-skin"></video>
            </div>
        </div>

но я могу получить первую камеру в каждом теге видео, когда все веб-камеры будут готовы. Как я могу создать несколько плееров и предоставить другой источник видео (например, веб-камеры), если это возможно?

Если я использую navigator.mediaDevices, это нормально:

var deviceInfo,i, j = 1;
    for (i = 0; i !== devices.length; ++i) {
        deviceInfo = devices[i];
        let stream = await navigator.mediaDevices.getUserMedia({
            audio: false,
            video: {
                deviceId: {exact: deviceInfo.deviceId},
                width: {'min': 640},
                height: {'min': 480}
            },
        });
        const videoElement = document.getElementById("video_" + j);
        videoElement.srcObject = stream;   
        j=j+1;     

    }