标签：否则 localhost text aci support eal gets constrain resolve
因为最近在学习WebRTC,前端就需要学习一下媒体的相关知识.
MediaDevice.getUserMedia()与WebRTC相关,欣慰他是通过这组API的门户.提供访问用户本地相机/麦克风媒体流手段
MediaDevice.getUserMedia()方法提示用户是否允许使用一个视频或音频输入设备,例如相机或屏幕共享或麦克风.如果用户给予许可,就返回一个Promise对象.
需要注意的是,由于用户不会被要求必须做出允许或者拒绝,所以返回的Promise对象可能既不处罚resolve也不触发reject
【注意】新版本的视频获取接口要用HTTPS协议，否则会抛出错误，当然现在在本地访问通过 localhost, 127.0.0.1 或者文件协议，都可以正常使用
使用video组件输出产生的视频(就是一个播放器)
<style type="text/css">
#video{
width: 320px;
height: 180px;
background-color: #000000;
}
</style>
<-- autoplay 自动播放 controls视频播放器的控件(暂停播放哪些~) -->
<video id="video" autoplay="autoplay" controls="controls"></video>var constrains = {
audio: true,
video: true
};当然可以指定视频源的一些信息,比如摄像头分辨率,最高,最低,理想的摄像头分辨率,强制使用后置摄像头,采样率.当让你可以使用getSupportedConstraints方法获取,浏览器支持哪些配置
var constraints = {
audio: false,
video: {
width: 160,
height: 90,
facingMode: {
exact: "environment"
},
frameRate: {
ideal: 10,
max: 15
}
}
};navigator.mediaDevices.getUserMedia(contraints).then(function(mediaStream)){
var video = document.querySelector(‘video‘);
video.srsObject = mediaStream
video.onloadedmetadata = function(e) {
video.play();
};
})
.catch(function(error)) {
console.log(error);
});
}标签：否则 localhost text aci support eal gets constrain resolve
原文地址：https://www.cnblogs.com/chougoushi/p/13930276.html
