文档章节

WEBRTC执行流程

方宏春
 方宏春
发布于 2017/05/15 09:22
字数 870
阅读 16
收藏 0

转载请注明出处:http://www.cnblogs.com/fangkm/p/4364553.html 

WebRTC是HTML5支持的重要特性之一,有了它,不再需要借助音视频相关的客户端,直接通过浏览器的Web页面就可以实现音视频对聊功能。而且WebRTC项目是开源的,我们可以借助WebRTC源码快速构建自己的音视频对聊功能。无论是使用前端JS的WebRTC API接口,还是在WebRTC源码上构建自己的对聊框架,都需要遵循以下执行流程:

 

上述序列中,WebRTC并不提供Stun服务器和Signal服务器,服务器端需要自己实现。Stun服务器可以用google提供的实现stun协议的测试服务器(stun:stun.l.google.com:19302),Signal服务器则完全需要自己实现了,它需要在ClientA和ClientB之间传送彼此的SDP信息和candidate信息,ClientA和ClientB通过这些信息建立P2P连接来传送音视频数据。由于网络环境的复杂性,并不是所有的客户端之间都能够建立P2P连接,这种情况下就需要有个relay服务器做音视频数据的中转,本文本着源码剖析的态度,这种情况就不考虑了。这里说明一下, stun/turn、relay服务器的实现在WebRTC源码中都有示例,真是个名副其实的大宝库。

上述序列中,标注的场景是ClientA向ClientB发起对聊请求,调用描述如下:

  • ClientA首先创建PeerConnection对象,然后打开本地音视频设备,将音视频数据封装成MediaStream添加到PeerConnection中。
  • ClientA调用PeerConnection的CreateOffer方法创建一个用于offer的SDP对象,SDP对象中保存当前音视频的相关参数。ClientA通过PeerConnection的SetLocalDescription方法将该SDP对象保存起来,并通过Signal服务器发送给ClientB。
  • ClientB接收到ClientA发送过的offer SDP对象,通过PeerConnection的SetRemoteDescription方法将其保存起来,并调用PeerConnection的CreateAnswer方法创建一个应答的SDP对象,通过PeerConnection的SetLocalDescription的方法保存该应答SDP对象并将它通过Signal服务器发送给ClientA。
  • ClientA接收到ClientB发送过来的应答SDP对象,将其通过PeerConnection的SetRemoteDescription方法保存起来。
  • 在SDP信息的offer/answer流程中,ClientA和ClientB已经根据SDP信息创建好相应的音频Channel和视频Channel并开启Candidate数据的收集,Candidate数据可以简单地理解成Client端的IP地址信息(本地IP地址、公网IP地址、Relay服务端分配的地址)。
  • 当ClientA收集到Candidate信息后,PeerConnection会通过OnIceCandidate接口给ClientA发送通知,ClientA将收到的Candidate信息通过Signal服务器发送给ClientB,ClientB通过PeerConnection的AddIceCandidate方法保存起来。同样的操作ClientB对ClientA再来一次。
  • 这样ClientA和ClientB就已经建立了音视频传输的P2P通道,ClientB接收到ClientA传送过来的音视频流,会通过PeerConnection的OnAddStream回调接口返回一个标识ClientA端音视频流的MediaStream对象,在ClientB端渲染出来即可。同样操作也适应ClientB到ClientA的音视频流的传输。

这里的流程仅仅是从使用层面上描述了一下,具体内部都做了什么、怎么做的,以后的文章中会慢慢细扒,万事开头难,自我鼓励一下。

本文转载自:http://www.cnblogs.com/fangkm/p/4364553.html 

共有 人打赏支持
方宏春
粉丝 29
博文 94
码字总数 14512
作品 0
南京
程序员
git 设置代理下载 webrtc代码

前言 很多同学想学习 webrtc,但发现下载 webrtc 代码并能成功编译它,成为了一只拦路虎。今天我们就来看看如何通过 VPN 下载webrtc代码。 购买 VPN 要想下载 webrtc 代码,我们必须要有 VP...

音视频直播技术专家
06/27
0
0
5月19-20日WebRTCon 2018 梳理全球WebRTC技术实践与案例

4月17日,距离WebRTCon 2018举行还有一个多月的时间,这是由音视频技术社区LiveVideoStack发起的WebRTC生态大会。大会将聚焦WebRTC技术实践与应用案例两大主线,旨在为WebRTC的7年长跑做一次...

vn9plgzvnps1522s82g
04/17
0
0
[翻译] 通过WebRTC技术实现点对点通信

通过WebRTC技术实现点对点通信 WebRTC是一个实验性技术。 因为该技术的规格还没有稳定下来,在各浏览器中必须通过检查属性表的前缀来正确使用,例如:在Chrome中使用 webkitRTCPeerConnectio...

yunfound
2014/03/20
0
0
WebRTC入门学习之初识WebRTC

引言: 先声明本人只是小小实习生一枚,若有不正确的,希望大家帮忙指正。 一、WebRTC基本架构 图一 WebRTC总体架构,摘自百度百科 先说说WebRTC大致的实现思路:我们创建的web app,然后在a...

小小实习生
2015/08/08
0
0
2018:WebRTC开发五大趋势

也许对于大部分WebRTC的开发者而言,2018年将是忙碌的一年。主流浏览器和苹果官方支持,标准和API定型,WebRTC生态具备了快速发展的条件。WebRTC技术服务商“WebRTC.Ventures”撰文,预测了2...

livevideostack
01/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

nginx 负载均衡

一.配置方式 1.轮询(默认) 优点:实现简单; 缺点:不考虑每台服务器处理能力 2.权重 weight默认是1。如果有多个配置权重的节点,比较相对值。 15:10,只代表访问8080端口的概率是访问908...

imbiao
36分钟前
1
0
jQuery学习笔记180923

jQuery 操作 CSS jQuery 拥有若干进行 CSS 操作的方法。我们将学习下面这些: addClass() - 向被选元素添加一个或多个类 removeClass() - 从被选元素删除一个或多个类 toggleClass() - 对被选...

颖伙虫
47分钟前
1
0
[python] colorama 模块 - 改变控制台输出文本的颜色

除了使用 PyQt 这样的图形化开发框架外,基本上 python 程序都是跑在控制台中的。很多时候,单纯使用黑白的文字不能很好地突出我们要显示的信息。有时候我们需要将错误的提示使用红色标注,而...

cometeme
52分钟前
1
0
Makefile 学习 2 - 基于若干 Blog 的汇总

基于若干 Blog 汇总的 makefile 教程 陈皓 https://blog.csdn.net/haoel/article/details/2886 Makefile 进阶 1. Makefile 中的内容 显式规则。显式规则说明了,如何生成一个或多的的目标文件...

公孙衍
今天
1
0
NIO与BIO的区别、NIO的运行原理和并发使用场景

NIO(Non-blocking I/O,在Java领域,也称为New I/O),是一种同步非阻塞的I/O模型,也是I/O多路复用的基础,已经被越来越多地应用到大型应用服务器,成为解决高并发与大量连接、I/O处理问题的...

Java干货分享
今天
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部