Mit welcher Kamera wird die getUserMedia-API im mobilen Gerät geöffnet? Vorne oder hinten?

Question

Während die getUserMedia API für den Zugriff auf die Kamera im Desktop verwendet wird, öffnet sich die Web-Kamera.Es ist natürlich eine Hilfe für die Videokommunikation.aber welche Kamera wird aufgerufen, wenn sie im Mobilgerät verwendet wird.Front cam oder Rear cam ?.ist Code erforderlich für die Auswahl der Kamera?

Answer 1

Leider können Sie dies (noch?) Nicht über den Code auswählen.

• Mozilla Firefox Beta: Wenn der Benutzer die Kamera zu teilen nimmt, kann er/sie auch auswählen, welche Kamera zu teilen.

• Chrome Beta: Ich konnte nur die Gesichtskamera verwenden. Könnte sein konfigurierbar, aber ich weiß nicht, wie ...

EDIT: In Chrom ist es möglich, die Rückseite gerichtete Kamera programmatisch auszuwählen. Siehe die nächste Antwort von Probot in diesem Thread.

Answer 2

Es gibt eine Lösung, bei der der Benutzer eine der Kameras auswählen kann.

Enable rear camera with HTML5

von sourceInfo.facing aus dem folgenden Code Auswertung können Sie eine Kamera auswählen ('user' oder 'Umwelt') (die auf aktuellen Chrom arbeitet> = 30): https://simpl.info/getusermedia/sources/

'use strict'; 

var videoElement = document.querySelector('video'); 
var audioSelect = document.querySelector('select#audioSource'); 
var videoSelect = document.querySelector('select#videoSource'); 

navigator.getUserMedia = navigator.getUserMedia || 
    navigator.webkitGetUserMedia || navigator.mozGetUserMedia; 

function gotSources(sourceInfos) { 
    for (var i = 0; i !== sourceInfos.length; ++i) { 
    var sourceInfo = sourceInfos[i]; 
    var option = document.createElement('option'); 
    option.value = sourceInfo.id; 
    if (sourceInfo.kind === 'audio') { 
     option.text = sourceInfo.label || 'microphone ' + (audioSelect.length + 1); 
     audioSelect.appendChild(option); 
    } else if (sourceInfo.kind === 'video') { 
     option.text = sourceInfo.label || 'camera ' + (videoSelect.length + 1); 
     videoSelect.appendChild(option); 
    } else { 
     console.log('Some other kind of source: ', sourceInfo); 
    } 
    } 
} 

if (typeof MediaStreamTrack === 'undefined'){ 
    alert('This browser does not support MediaStreamTrack.\n\nTry Chrome Canary.'); 
} else { 
    MediaStreamTrack.getSources(gotSources); 
} 


function successCallback(stream) { 
    window.stream = stream; // make stream available to console 
    videoElement.src = window.URL.createObjectURL(stream); 
    videoElement.play(); 
} 

function errorCallback(error){ 
    console.log('navigator.getUserMedia error: ', error); 
} 

function start(){ 
    if (!!window.stream) { 
    videoElement.src = null; 
    window.stream.stop(); 
    } 
    var audioSource = audioSelect.value; 
    var videoSource = videoSelect.value; 
    var constraints = { 
    audio: { 
     optional: [{sourceId: audioSource}] 
    }, 
    video: { 
     optional: [{sourceId: videoSource}] 
    } 
    }; 
    navigator.getUserMedia(constraints, successCallback, errorCallback); 
} 

audioSelect.onchange = start; 
videoSelect.onchange = start; 

start(); 

Answer 3

Die Antwort ist ja, für Android als Standard-Kamera ist die Front (Benutzer) caerma up.so ich dieses Skript vor, um zwischen der vorderen und der hinteren Kamera

//---------------------------------------------------------------------- 
    // Here we list all media devices, in order to choose between 
    // the front and the back camera. 
    //  videoDevices[0] : Front Camera 
    //  videoDevices[1] : Back Camera 
    // I used an array to save the devices ID 
    // which i get using devices.forEach() 
    // Then set the video resolution. 
    //---------------------------------------------------------------------- 
    navigator.mediaDevices.enumerateDevices() 
    .then(devices => { 
     var videoDevices = [0,0]; 
     var videoDeviceIndex = 0; 
     devices.forEach(function(device) { 
     console.log(device.kind + ": " + device.label + 
      " id = " + device.deviceId); 
     if (device.kind == "videoinput") { 
      videoDevices[videoDeviceIndex++] = device.deviceId;  
     } 
     }); 


     var constraints = {width: { min: 1024, ideal: 1280, max: 1920 }, 
     height: { min: 776, ideal: 720, max: 1080 }, 
     deviceId: { exact: videoDevices[1] } 
    }; 
    return navigator.mediaDevices.getUserMedia({ video: constraints }); 

    }) 
    .then(stream => { 
     if (window.webkitURL) { 
     video.src = window.webkitURL.createObjectURL(stream); 
     localMediaStream = stream; 
     } else if (video.mozSrcObject !== undefined) { 
     video.mozSrcObject = stream; 
     } else if (video.srcObject !== undefined) { 
     video.srcObject = stream; 
     } else { 
     video.src = stream; 
     }}) 
    .catch(e => console.error(e)); 

zu wählen