如何使用getusermedia

Question

我们要使用后置摄像头进行扫描，然后选择正确的后置摄像头-主摄像头，而不是广角镜摄像头。

较新的移动设备（例如Samsung galaxy s10）具有多个前置和后置摄像头。当调用enumerateDevices（）时，我们获得了正面和背面的摄像头列表。我们要从后置摄像头列表中选择主摄像头。我们可以使用约束条件来选择后置摄像头（朝向：“环境”），但是我们不知道如何分辨每个设备是主摄像头还是广角镜摄像头。

navigator.mediaDevices.enumerateDevices().then(function (devices) {
        for(var i = 0; i < devices.length; i ++){
            var device = devices[i];
            if (device.kind === 'videoinput') {
                //any useful device info here?
            }
        }
    });

Answer 1

device.label对象通常具有DEBUG个描述它们的文本。但是，此文本是特定于设备的。

如果您将https://webrtc.github.io/samples/src/content/devices/input-output/加载到浏览器中，它将为您提供可用媒体源（相机，麦克风）的下拉列表。标签标识每个摄像机。它们因设备而异。

在iPhone上，它是“前置摄像头”和“后置摄像头”。

这是页面的二维码。

Answer 2

这取决于您所说的“主”后置摄像头的含义。我们的用例需要支持自动对焦的后置摄像头（并非全部如此）。检查您可以查询here的约束，并正确调用navigator.mediaDevices.getUserMedia（）。

例如：

cam = await navigator.mediaDevices.getUserMedia({video: {facingMode: {exact: "environment"}, focusMode: {ideal: "continuous"}}}});

您提到远摄，所以您可能正在追求缩放级别。这也是一个选择，但是我自己还没有玩那么多。

对约束API的支持因设备而异，并且非常严格。我建议您建立后备选项，使用自定义查询针对特定的os版本/设备，并进行大量实验以确保您能获得最适合自己的相机。