Book
Search…
getUserMedia
MediaDevices.getUserMedia() 会提示用户给予使用媒体输入的许可,媒体输入会产生一个MediaStream,里面包含了请求的媒体类型的轨道。 流里可以包含一个视频轨道(来自硬件或者虚拟视频源,比如相机、视频采集设备和屏幕共享服务等等)、一个音频轨道(同样来自硬件或虚拟音频源,比如麦克风、A/D转换器等等),也可能是其它轨道类型。
它返回一个 Promise 对象,成功后会resolve回调一个 MediaStream 对象。若用户拒绝了使用权限,或者需要的媒体源不可用,promise会reject回调一个 PermissionDeniedError 或者 NotFoundError
getUserMedia API最初是navigator.getUserMedia,目前已被最新Web标准废除,变更为navigator.mediaDevices.getUserMedia(),但浏览器支持情况不如旧版API普及。
返回的promise对象可能既不会resolve也不会reject,因为用户不是必须选择允许或拒绝。
通常可以使用 navigator.mediaDevices 来获取 MediaDevices ,例如:
1
navigator.mediaDevices.getUserMedia(constraints)
2
.then(function(stream) {
3
/* 使用这个stream stream */
4
})
5
.catch(function(err) {
6
/* 处理error */
7
});
Copied!
也可以用
1
async function getMedia(pc) {
2
let stream = null;
3
4
try {
5
stream = await navigator.mediaDevices.getUserMedia(constraints);
6
/* use the stream */
7
} catch(err) {
8
/* handle the error */
9
}
10
}
Copied!
如果当前的document存在安全性问题,也会导致getUserMedia返回undefined等情况,安全问题后面讨论。

兼容性

 下面我们开始实践一下,先看最新的API,最后在讨论兼容性的问题。

Sources

Copy link