navigator
.mediaDevices
.getUserMedia(constraints)
.then(function(mediaStream) {
var video = document.querySelector('video');
video.srcObject = mediaStream
video.onloadedmetadata = function(e) {
video.play();
};
})
.catch(function(error) {
console.log(error);
});
收集系统上可用的多媒体输入和输出设备信息
enumerateDevices用于收集系统上可用的多媒体输入和输出设备的信息。该方法返回一个Promise对象,如果枚举成功,成功的then 回调函数带有一个MediaDeviceInfo的参数。
navigator
.mediaDevices
.enumerateDevices()
.then(function(MediaDeviceInfo) {
console.log(MediaDeviceInfo);
})
// 输出MediaDeviceInfo为:
[
{
"deviceId": "default",
"kind": "audioinput",
"label": "Default",
"groupId": "50ec3ed5a0cff9ab1c4c5ee9aa81db10c37162fca33c03dc9b5a191dedb2e8e4"
},
{
"deviceId": "e38a9b92758f008e71510a95aa36957553e2a5ce7febc6e4bcd57798807c1519",
"kind": "audioinput",
"label": "Built-in Microphone",
"groupId": "50ec3ed5a0cff9ab1c4c5ee9aa81db10c37162fca33c03dc9b5a191dedb2e8e4"
},
{
"deviceId": "5013c01eb0a704c09d15aa668601f8dfb80f1a33d179b2adcbb64a8fbad5fc62",
"kind": "videoinput",
"label": "FaceTime HD Camera",
"groupId": ""
},
{
"deviceId": "default",
"kind": "audiooutput",
"label": "Default",
"groupId": "50ec3ed5a0cff9ab1c4c5ee9aa81db10c37162fca33c03dc9b5a191dedb2e8e4"
},
{
"deviceId": "ba0bb7502f314e3ad61511aa6468c6a48ec679e34e5ebd975852db1d8d3ab3e7",
"kind": "audiooutput",
"label": "Built-in Output",
"groupId": "50ec3ed5a0cff9ab1c4c5ee9aa81db10c37162fca33c03dc9b5a191dedb2e8e4"
}
]
获取用户支持的Constraints
通过 MediaDevices.getSupportedConstraints() 方法可以返回一个基于 MediaTrackSupportedConstraints 的对象,它包含哪些Constraints属性是浏览器支持的, 例如帧率、窗口大小等。
var supportedConstraints =navigator.mediaDevices.getSupportedConstraints()//输出supportedConstraints
{"aspectRatio": true, //采集比例
"channelCount": true,"deviceId": true,"echoCancellation": true,"facingMode": true,"frameRate": true,"groupId": true,"height": true,"latency": true, //延迟
"sampleRate": true,"sampleSize": true,"volume": true,"width": true}