最近在做一个直播功能,查阅了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视频调用内容请搜索代码网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持代码网!
发表评论