• webrtc笔记(2): 1对1实时视频/语音通讯原理概述


    开始正文之前,先思考1个问题:2个处于不同网络环境的(具备摄像头/麦克风多媒体设备的)浏览器,要实现点对点的实时视频/语音通讯,难点在哪?

    至少得先搞定下面2个问题:

    1、彼此要了解对方支持的媒体格式、支持的最大分辨率等媒体信息

    比如:peerA端可支持MPEG-1/2、H264多种编码格式,而peerB端支持MPEG-4、H264,要保证二端都正确的编解码,最简单的办法就是取它们的交集H264

    就象2个不同国家的人交流,1个只会讲英文、中文,另1个只会讲德语、英文,他俩肯定要能相互正常沟通,肯定会用双方都懂的英文来交流一样。

    注:有一个专门的协议 ,称为Session Description Protocol (SDP),可用于描述上述这类信息,在webrtc中,参与视频通讯的双方必须先交换SDP信息,这样双方才能知根知底,而交换SDP的过程,也称为"媒体协商"。

    2、彼此要了解对方的网络情况,这样才有可能找到一条相互通讯的链路

    类似的道理,在复杂的网络环境中,要建立二个端的连接,得有一条双方都能访问的链路。

    如上图,peerA端具体有公网ip以及192网段的内网环境,而peerB没有公网,只有192、198二个内网地址,从图中可知,它俩可以使用公用的192网段来通讯。webrtc通讯过程中,这些网络相关的信息,也得相互交换,找出共同的交集,这个过程也称为“网络协商”。

    顺着这个思路再琢磨一下,刚开始前,这2个端还没建立连接,既然连都没连上,又如何交换“媒体信息”、“网络信息”?

    这时候就该所谓的信令服务器signal server出场了:

    如上图,2个浏览器端的上层,可以抽象出一层信令服务器(可以是1台或多台,看实际应用的情况,如果2端的浏览器都能访问某个公共的网络环境,比如公网,可以让它们都连到这台公用的信令服务器上;如果没有公共的网络环境,可以在2端各搭一组服务器,即signal serverA、signal serverB,但是这二组信令服务器之间要能互通),借助信令服务器,就可以实现上面提到的SDP信息及网络信息交换。

    交换SDP的过程,大致如上图:

    1、Amy(1个假想的人名),把自身的SDP信息,通过setLocalDescription方法保存起来,然后通过offer方法,发给信令服务器。

    2、信息服务器把Amy的SDP向前传递到另1端的Bob(另1个假想的人名),Bob会先调用setRemoteDescripition把Amy的SDP保存下来。

    3、然后Bob调用setLocalDescription方法保存自己的SDP,然后再通过answer方法,把自己的SDP通过信令服务器发给Amy

    4、Amy收到Bob的SDP后,调用setRemoteDescription保存起来,这样双方就完成了SDP交换,然后找出其中的交集,如果能达成一致,就可以建立p2p连接,开始通讯了。

    但是现实往往是残酷的,在中国的网络环境中,据一些统计数据显示,至少1半的网络是无法直接穿透打通的(我个人认为根本原因是:IP4地址资源在互联网发展早期绝大多数都被国外占用了,轮到中国这些发展中国家使用时IP地址严重不足,所以大多数电脑都不具备公网ip,只能通过路由器、交换机做NAT转换,而相当一部分NAT是对称型的,基本上没法空透),这种情况下只能借助上一节讲到的turn服务器中转。

    另外,在视频对话框中,通常会有房间(或群)的概念,用于做一些业务上的隔离,这部分逻辑也是在signal server中实现的,综合考虑peer端、信令服务器、stun/turn服务器后,整个1对1实时视频通讯的时序图如下:

    主要过程如下:

    1、双方先调用getUserMedia打开本机摄像头

    2、向信令服务器发送加入房间apply_join请求

    3、信令服务器通知本人加入成功(joined),同时向其它人广播加入消息(other_joined)

    4、二端开始创建peerConnection连接

    5、peerB端创建offer,同时将SDP保存到本机(setLocalDescription),并通过信令服务器传递到peerA

    6、peerB在setLocalDescription后,会异步触发“候选网络链路”收集,大致是通过Stun确定自己所有的NAT映射出口,如果Stun返回NAT是“对称型”的,基本上就没法穿透了,会再通过Turn拿到中继reply地址,并通过信令服务器,将网络候选链路信息发到peerA(即:开始网络协商)

    7、peerA收到的peerB的SDP后,开始回应(createAnswer),仍然通过信令服务器,将SDP发送到peerB

    8、同时peerA也会开始网络候选链路的收集,并将自己的网络信息,通过信令服务器,发到peerB(即:网络协商)

    这样peerA,peerB就相互交换了媒体信息及网络信息,如果能达到一致(即:找到交集),就可以开始通讯了

    基于以上原理,做了一个demo示例程序,见:https://github.com/yjmyzz/webrtc-samples

    参考资料:

    https://rtcdeveloper.com/t/topic/13742

    https://www.html5rocks.com/en/tutorials/webrtc/basics/

    https://hpbn.co/webrtc/#standards-and-development-of-webrtc

    https://blog.csdn.net/momo0853/article/details/85157775

    https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Connectivity

    https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/setLocalDescription

    https://www.cnblogs.com/lingyunhu/category/626157.html

  • 相关阅读:
    [CISCN2019 总决赛 Day2 Web1]Easyweb
    [极客大挑战 2019]Upload
    [SUCTF 2019]EasyWeb
    2020/2/1 PHP代码审计之任意文件读取及删除漏洞
    2020/1/31 PHP代码审计之文件包含漏洞
    [Luogu P1120]小木棍·加强版
    学习笔记·堆优化$mathscr{dijkstra}$
    [LuoguP1462]通往奥格瑞玛的道路($SPFA+$二分)
    [USACO08JAN]电话线$Telephone Lines$(图论$+SPFA+$ 二分答案)
    [USACO06NOV]玉米田$Corn Fields$ (状压$DP$)
  • 原文地址:https://www.cnblogs.com/yjmyzz/p/webrtc-basic.html
Copyright © 2020-2023  润新知