Html5 webRTC简单实现视频调用的示例代码

最近在做一个直播功能，查阅了webrTC相关资料，下面是简单实现的栗子哟(基于vue.js)！

子组件

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 webRTC视频调用内容请搜索以前的文章或继续浏览下面的相关文章，希望大家以后多多支持！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！