MediaStream Image Capture API - 用于从摄影设备捕获图像或视频的 API

MediaStream Image Capture API 是一个用于从摄影设备捕获图像或视频的 API。除了捕获数据，它还允许您检索有关设备功能的信息，例如图像大小、防红眼以及是否有闪光灯以及它们当前的设置。相反，API 允许在设备允许的范围内配置功能。

图像捕获概念和用法

检索图像或视频流的过程如下所述。实例代码改编自 Chrome 的图像捕获示例。

首先，通过调用 MediaDevices.getUserMedia() 获取对设备的引用。下面的实例用于获取任何可用的视频设备，尽管 getUserMedia() 方法允许请求更具体的功能。此方法返回一个 Promise ，它解析为 MediaStream 对象。

navigator.mediaDevices.getUserMedia({ video: true })
  .then(mediaStream => {
    // 对流做一些事情。
  })

接下来，获取媒体流的可视部分。通过调用 MediaStream.getVideoTracks() 来执行此操作。这将返回一个 MediaStreamTrack 对象数组。下面的代码假设 MediaStreamTrack 数组中的第一项是要使用的项。您可以使用 MediaStreamTrack 对象的属性来选择您需要的对象。

const track = mediaStream.getVideoTracks()[0];

此时，您可能希望在捕获图像之前配置设备功能。您可以在执行任何其他操作之前在轨道对象上调用 applyConstraints() 来完成此操作。

let zoom = document.querySelector('#zoom');
const capabilities = track.getCapabilities();
// 检查是否支持缩放。
if(!capabilities.zoom) {
  return;
}
track.applyConstraints({ advanced : [{ zoom: zoom.value }] });

最后，将 MediaStreamTrack 对象传递给 ImageCapture() 构造函数。尽管 MediaStream 包含多种类型的轨道并提供多种检索它们的方法，但如果 MediaStreamTrack.kind 不是 "video"，ImageCapture 构造函数将抛出 NotSupportedError 类型的 DOMException。

let imageCapture = new ImageCapture(track);

接口

ImageCapture

用于从通过有效 MediaStreamTrack 引用的摄影设备捕获图像的接口。

PhotoCapabilities

为连接的摄影设备提供可用的配置选项。通过调用 ImageCapture.getPhotoCapabilities() 检索 PhotoCapabilities 对象。

规范

规范	状态	备注
MediaStream Image Capture	工作草案	初始定义。

浏览器兼容性

ImageCapture

桌面浏览器兼容性

移动浏览器兼容性

1. 不支持 photoSettings 参数。

PhotoCapabilities

桌面浏览器兼容性

移动浏览器兼容性

相关链接

• MediaStream
• MediaStreamTrack