使用 HTML5 getUserMedia 和 enumerateDevices API 时如何确定哪些摄像头是正面和背面？

如何解决使用 HTML5 getUserMedia 和 enumerateDevices API 时如何确定哪些摄像头是正面和背面？

使用 HTML5 getUserMedia API 访问相机时，您可以：

1. 请求一个未指定的“用户”面对的摄像头
2. 请求面向未指定“环境”的摄像头（可选左侧或右侧）
3. 索取可用摄像机列表

最初我们使用“面向”约束来选择相机。如果相机面向“用户”，我们按照惯例将其显示为镜像。

然而，当用户没有恰好 1 个面向用户和 1 个面向环境的摄像头时，我们会遇到问题。他们可能缺少其中之一，或者有多个。这可能会导致使用错误的相机，或者无法正确镜像相机。

所以我们正在考虑枚举设备。但是，我还没有找到一种方法来确定视频设备是否“面向用户”并且应该被镜像。

在这些 API 中，是否有任何 API 可用于确定视频输入是否面向“用户”？

解决方法

当您枚举设备时，作为输入的设备可能有一个名为 getCapabilities() 的方法。如果此方法可用，您可以调用它来获取 MediaTrackCapabilities 对象。此对象有一个名为 facingMode 的字段，其中列出了该设备的有效 facingMode 选项。

对我来说，这在 PC 上是空的，但在我的 Android 设备上它正确填充。

这里有一个 jsfiddle，你可以用它在你自己的设备上进行检查：https://jsfiddle.net/juk61c07/4/

感谢 O. Jones 的评论为我指明了正确的方向。