javascript - getUserMedia 锁定焦点/曝光

Question

我正在使用navigator.getUserMedia限制访问用户的网络摄像头，使用提要作为 HTML 的源 <video>然后将其流复制到 drawImage一个<canvas>语境。我这样做是为了每隔一段时间就拍一张快照。

我想做的是，一旦页面开始拍摄快照，就锁定 getUserMedia 相机的焦点/曝光，以便在快照间隔之间环境可以改变，而无需改变光平衡或相机重新对焦。

有人知道这在 JS 端是否可行吗？

Answer 1

标记为重复项:Take photo when the camera is automatically focused

首先 - 虽然这里的做法可能不好 - 我将链接到为什么 MediaCapture 可能比预期模糊或颗粒状:

为什么 iPad/iOS 上的 native 相机分辨率 - 与 getUserMedia 存在差异？

简而言之:MediaCapture 对媒体源进行大量转换，这可能会导致图像模糊或有颗粒感。

要解决此问题，请使用 ImageCapture:

The ImageCapture API enables control over camera features such as zoom, brightness, contrast, ISO and white balance. Best of all, Image Capture allows you to access the full resolution capabilities of any available device camera or webcam. Previous techniques for taking photos on the Web have used video snapshots, which are lower resolution than that available for still images.

解决您的问题:

您可以通过用户体验和缩放 slider 来解决这个问题。以下是有关如何使用 ImageCapture(静态图像)实现此目的的信息。 MediaCapture(视频源)不允许此功能。您可以使用 MediaCapture 并提供“手动模式”等按钮，并允许用户选择正确的缩放比例来拍摄照片。

您还可以通过每次更新执行 n 个 ImageCapture 的更新循环来“模拟”相机，并使用缩放 slider 。

https://developers.google.com/web/updates/2016/12/imagecapture

这是一个如何使用它/polyfill 的示例:https://github.com/GoogleChromeLabs/imagecapture-polyfill

确保您使用最新的 getUserMedia polyfills 来处理跨平台支持:https://www.npmjs.com/package/webrtc-adapter

希望这有帮助