如何使用后置摄像头代替前置摄像头？

Question

我有一个 QR 扫描摄像头，但是当我在手机上打开我的网站时，面部摄像头会在我的网站中打开。 我想用后置摄像头。

function setwebcam()
{

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




document.getElementById("result").innerHTML="- scanning -";
if(stype==1)
{
    setTimeout(captureToCanvas, 500);    
    return;
}
var n=navigator;
document.getElementById("outdiv").innerHTML = vidhtml;
v=document.getElementById("v");

if(n.getUserMedia)
    n.getUserMedia(constraints, success, error);
else
if(n.webkitGetUserMedia)
{
    webkit=true;
    n.webkitGetUserMedia(constraints, success, error);
}
else
if(n.mozGetUserMedia)
{
    moz=true;
    n.mozGetUserMedia(constraints, success, error);
}

Answer 1

如果要强制设备使用前置摄像头，可以在约束中添加facesMode ：

var constraints = { 
  audio: true,
  video: {
    facingMode: 'environment'
};

或使用exact ：

facingMode: { exact: 'environment' }

Answer 2

您可以使用MediaStreamTrack.getSources(callback)获取所有媒体源及其 ID。 使用其他属性，您可以过滤以检查它是音频视频还是按名称过滤。 一旦您知道要显示的媒体源的 id，就可以使用它来将其附加到视频标签上。

这是一个很好的例子：
https://simpl.info/getusermedia/sources/
https://github.com/samdutton/simpl/blob/master/getusermedia/sources/js/main.js

Answer 3

如果前面的示例不适合您，请尝试其他方式：

Webcam.set({
 width: 250,
 height: 200,
 image_format: 'jpeg',
 jpeg_quality: 90,
 // I add this object constraints
 constraints: {
   facingMode: 'environment'
 }
});