在Html5如何使用webRTC进行简单视频调用?案例代码分享!
2021-08-17 10:14:54
浏览数 (2962)
今天小编来和大家说说有关于:“在Html5如何使用webRTC进行简单视频调用?”这个问题的相关内容和解决方法分享,希望小编分享的内容对大家有所帮助!
子组件:
<template>
<video id="rtc"></video>
</template>
<script>
export default {
name: "LiveDetails",
data() {
return {};
},
mounted() {
let video = document.querySelector("#rtc");
// 参数表示需要同时获取到音频和视频
// 获取到优化后的媒体流
// { audio: true, video: true }
const constraints = {
audio: { echoCancellation: { exact: false } },
video: true
};
navigator.mediaDevices
.getUserMedia(constraints)
.then(stream => {
console.log(stream) //此处打印请看下方
video.srcObject = stream;
video.onloadedmetadata = e => {
video.play();
};
})
.catch(err => {
console.log(err);
});
}
};
</script>
亲测有效,会有回声,后端可以进行处理
在通过简单的自己实践之后在分享给大家相信大家对于:“在Html5如何使用webRTC进行简单视频调用?”这个问题会有更好的了解,更多有关于html5这方面的相关内容我们都可以在W3Cschool中进行学习和了解!