Vue+WebRTC实现音视频直播

SpringBoot+WebSocket+Vue+PeerJs实现WebRTC视频通话功能，Vue视频通话，web视频通话，webrtc视频通话

一款电商app的全栈开发，其中涉及到一个视频通话功能。但是由于业务需求及成本考虑，不能使用第三方提供的SDK进行开发。所以选择使用PeerJs+WebSocket来实现这个功能。

参考

https://blog.csdn.net/daiyi666/article/details/126751502

 

 

 

webRTC中文网

https://www.webrtc.org.cn/

视频编解码器采用VP8

 

WebRTC简介

WebRTC，名称源自网页即时通信（英语：Web Real-Time Communication）的缩写，是一个支持网页浏览器进行实时语音对话或视频对话的实时通信框架，提供了一系列页面可调用API。

最近项目中的需求则是与服务端建立即时通信，实现低延迟音视频直播。

RTC的特征是（参考来源：https://www.zhihu.com/question/22301898）

复杂度较高
半可靠传输，对于特定情境（比如网络环境较差时）可以对音视频进行有损传输，降低延迟
音视频友好：可针对音视频做定制化优化
提供端对端优化方案。 对于传统连接模式，使用C/S架构，A=>服务端=>B，而WebRTC使用的是peer-to-peer模式，A=>B，一旦点和点之间的连接形成，它们之间的数据传输是不经过服务端的，大大降低了服务端的压力。
理论延迟较低，能应用在各种低延迟场景。

业务描述

功能描述：
实现对摄像设备的管理列表，在设备列表点击查看视频时，弹出页面浮窗，进行摄像机摄像的视频和音频实时转播。
视频弹窗下方有自己实现的控制条，实现播放/暂停控制，能显示播放时间、切换分辨率、是否全屏等。

 

 

参考

https://blog.csdn.net/qq_22309741/article/details/109749476