利用webRTC做了一个视频通话,文章内链接可以测试哦!

这里就不做webRTC的介绍了,有需要的可以自行百度。

首先说一下WebRTC通话原理

1、媒体协商

彼此要了解对方支持的媒体格式
媒体协商
比如:Peer­A端可支持VP8、H264多种编码格式,而Peer­B端支持VP9、H264,要保证二端都正确的编解码,最简
单的办法就是取它们的交集H264
注:有一个专门的协议 ,称为Session Description Protocol (SDP),可用于描述上述这类信息,在WebRTC中,参与
视频通讯的双方必须先交换SDP信息,这样双方才能知根知底,而交换SDP的过程,也称为"媒体协商"。

2. 网络协商

彼此要了解对方的网络情况,这样才有可能找到一条相互通讯的链路
先说结论:
1)获取外网IP地址映射;
2)通过信令服务器(signal server)交换"网络信息"
理想的网络情况是每个浏览器的电脑都是私有公网IP,可以直接进行点对点连接。
理想网络下
实际情况是:我们的电脑和电脑之前或大或小都是在某个局域网中,需要NAT(Network Address Translation,网络地址转换),显示情况如下图:
实际情况下

3. 媒体协商+网络协商数据的交换通道

从上面1/2点我们知道了2个客户端协商媒体信息和网络信息,那怎么去交换?是不是需要一个中间商去做交换?所以
我们需要一个信令服务器(Signal server)转发彼此的媒体信息和网络信息。
媒体协议

4. 一对一通话整体架构

架构

在一对一通话场景中,每个 Peer均创建有一个 PeerConnection 对象,由一方主动发 Offer SDP,另一方则应答
AnswerSDP,最后双方交换 ICE Candidate 从而完成通话链路的建立。但是在中国的网络环境中,据一些统计数据
显示,至少1半的网络是无法直接穿透打通,这种情况下只能借助TURN服务器中转。

做完整个demo只要会websocket和js就行
做的一个demo
输入房间号,打开自己的摄像头,等待好友加入
输入房间号等待好友加入

等好友输入同样的房间号之后就会显示对方的视频
好友输入之后就会显示
在线链接:视频通话在线链接
很多细节没时间优化可以自行优化。
有什么问题关注博主吧!!!

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

FirstTalent

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值