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

2024-11-2 22:17| 发布者: ae2942d9| 查看: 109| 评论: 0

摘要: 最近在做一个直播功能，查阅了webRTC相关资料，下面是简单实现的栗子哟(基于vue.js)！子组件 [code] <template> <video id="rtc"></video> </template> <script> export default { name: "LiveDetails", da

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

子组件

[code] <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> [/code]

亲测有效，会有回声，后端可以进行处理

到此这篇关于Html5 webRTC简单实现视频调用的示例代码的文章就先容到这了,更多相关Html5 webRTC视频调用内容请搜刮脚本之家从前的文章或继续欣赏下面的相关文章，希望大家以后多多支持脚本之家！

来源：https://www.jb51.net/html5/746305.html
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

收藏分享邀请

上一篇：Html5之webcoekt播放JPEG图片流下一篇：HTML5超文本标记语言的实现方法

账号		自动登录	找回密码
密码			立即注册

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

相关分类

站长推荐 /6