首页截图
获取音视频
关键Code
获取摄像头数据
/**
* 获取流数据
*/
openUserMeida() {
var that = this
// 判断是否支持获取媒体数据
if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
that.$notify({
title: '警告',
message: '浏览器不支持获取媒体设备',
type: 'warning'
});
return;
}
let constraints = {video: true, audio: true}
this.loading = true
this.getLocalUserMedia(constraints).then(stream => {
// 拿到流数据后，将流显示在video
this.setDomVideoStream('localVideo', stream);
});
},
/**
* 获取音视频流
* @param constraints
* @returns {Promise<MediaStream>}
*/
async getLocalUserMedia(constraints) {
return await navigator.mediaDevices.getUserMedia(constraints).catch(this.handleError)
},
/**
* 异常处理
* @param error
*/
handleError(error) {
this.loading = false;
this.$notify({
title: '警告',
message: '无法获取媒体设备，请检查是否占用或缺失',
type: 'warning'
});
console.error('navigator.MediaDevices.getUserMedia error: ', error.message, error.name);
},
关闭摄像头
/**
* 关闭
* @param domId
*/
closeUserMedia(domId) {
let video = document.getElementById(domId)
// 获取video流数据
let stream = video.srcObject
// 判断流数据是否存在 ，存在则关闭所有轨道数据
if (stream) {
stream.getTracks().forEach(e => {
e.stop();
})
}
video.srcObject = null
}
期待更新，麻烦点个赞，点个关注，栓Q !
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/197540.html
