MediaStream图像捕捉API是一种用于从照相设备捕捉图像或视频的API。
1.通过调用获取对设备的引用MediaDevices.getUserMedia();
navigator.mediaDevices.getUserMedia({ video: true })
.then(mediaStream => {
// Do something with the stream.
})
2.隔离媒体流的可视部分;
通过调用来做到这一点MediaStream.getVideoTracks()。这将返回一个MediaStreamTrack对象数组。
const track = mediaStream.getVideoTracks()[0];
3.如果希望在捕获图像之前配置设备功能,可以通过applyConstraints()在执行任何其他操作之前调用track 对象来完成此操作;
let zoom = document.querySelector('#zoom');
const capabilities = track.getCapabilities();
// Check whether zoom is supported or not.
if(!capabilities.zoom) {
return;
}
track.applyConstraints({ advanced : [{ zoom: zoom.value }] });
4.将MediaStreamTrack对象传递给ImageCapture()构造函数。
尽管 aMediaStream包含多种类型的轨道并提供多种检索它们的方法,但 ImageCapture 构造函数将抛出 a DOMExceptionof type NotSupportedErrorif MediaStreamTrack.kindis not "video"。
let imageCapture = new ImageCapture(track);
ImageCapture 图像捕获,用于从通过有效引用的摄影设备捕获图像的接口MediaStreamTrack。
ImageCapture() 构造函数
创建一个新ImageCapture对象,该对象可用于从MediaStreamTrack表示视频流的给定对象中捕获静止帧(照片)。
特性:ImageCapture.track 只读,返回对MediaStreamTrack(媒体流跟踪)传递给构造函数的引用。
ImageCapture.track 图像捕捉跟踪,接口的track只读属性 ImageCapture返回对MediaStreamTrack传递给 ImageCapture()构造函数的引用 。
const mediaStreamTrack = imageCaptureObj.track
该MediaStreamTrack接口表示流中的单个媒体轨道;通常,这些是音频或视频轨道,但也可能存在其他轨道类型。
接口的takePhoto()方法 ImageCapture使用视频捕获设备进行单次曝光MediaStreamTrack并返回Promise 一个Blob包含数据的解析。