文档章节

WEBRTC执行流程

方宏春
 方宏春
发布于 2017/05/15 09:22
字数 870
阅读 11
收藏 0
点赞 0
评论 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 

共有 人打赏支持
方宏春
粉丝 27
博文 70
码字总数 12634
作品 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
2018:WebRTC开发五大趋势

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

livevideostack
01/12
0
0
鹅厂优文|打通小程序音视频和webRTC

欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 作者:腾讯视频云终端技术总监常青, 2008 年毕业加入腾讯,一直从事客户端研发相关工作,先后参与过 PC QQ、手机QQ、QQ物联 等产...

腾讯云加社区
05/04
0
0
了不起的WebRTC:生态日趋完善,或将实时音视频技术白菜化

本文原文由声网WebRTC技术专家毛玉杰分享。 1、前言 有人说 2017 年是 WebRTC 的转折之年,2018 年将是 WebRTC 的爆发之年,这并非没有根据。就在去年(2017年),WebRTC 1.0 标准草案出炉(...

JackJiang2011
06/04
0
0
WebRTC入门学习之初识WebRTC

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

小小实习生
2015/08/08
0
0
黄开宁:搞多媒体开发要掌握好信号处理、统计和数理分析

尽管有WebRTC和FFmpeg这样的超级工具,但多媒体开发的核心难点的难度并没有因此降低,这需要开发者掌握牢固的基础知识。LiveVideoStack专访了即构科技音视频技术资深架构师黄开宁,他对学习多...

livevideostack
05/15
0
0
WebRTC技术大会将于5月19日在上海举行

一场WebRTC技术大会即将在上海上演,这是一次面向全球的WebRTC技术的技术实践和应用案例的梳理与展示,预计将有超过250名的多媒体开发工程师、技术负责人、产品负责人及高端行业用户出席本次...

LiveVideoStack
05/02
0
0
学习多媒体开发的正确姿势?陈功:看书 啃代码 搞插件

陈功说,要想学好多媒体开发,首先需要兴趣,接下来还需要好的方法。LiveVideoStack邮件采访了声网Agora首席WebRTC架构师,畅聊了自己的成长经历,WebRTC的演进趋势等。陈功表示,WebRTC的未...

vn9plgzvnps1522s82g
04/13
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

聊聊spring cloud的AsyncLoadBalancerAutoConfiguration

序 本文主要研究一下AsyncLoadBalancerAutoConfiguration AsyncLoadBalancerAutoConfiguration spring-cloud-commons-2.0.0.RELEASE-sources.jar!/org/springframework/cloud/client/loadba......

go4it
15分钟前
0
0
10.19 iptables规则备份和恢复 ,firewalld的9个zone,service的操作

保存和备份iptables规则 内容: 保存iptables规则 service iptables save 把iptables规则备份到my.ipt文件中: iptables-save > my.ipt 恢复刚才备份的规则: iptables-restore < my.ipt 1.......

Linux_老吴
17分钟前
0
0
Vue 自动化表单相关资料

1.使用vue自动化表单 2.Vue可视化,Vue代码生成,Vue动态表单 3.前端表单进阶之路:通过 Vue.js 实现表单可配置化 4.使用Vue动态生成form表单 5.autoform-devtool...

IT追寻者
18分钟前
0
0
动态SQL

一、动态SQL 1、if <select id="findActiveBlogWithTitleLike" resultType="Blog"> SELECT * FROM BLOG WHERE state = ‘ACTIVE’ <if test="title != null"> AND title l......

一个yuanbeth
21分钟前
1
0
使用ExternalDNS自动化DNS配置

Kubernetes社区的生态繁荣和该领域技术的快速茁壮发展,已经是众所周知。Kubernetes领域有太多强大的、创新的技术产品,而最近引起我注意的项目是ExternalDNS。这是在近期的POC期间客户主动咨...

RancherLabs
25分钟前
0
0
多线程-Lock

今天写了一段测试Lock的代码,如下: namespace TLock{ class Program { static void Main(string[] args) { TMyThread myThread = new TMyThre......

kaixinguo314
36分钟前
0
0
如何清洁你脏兮兮的笔记本电脑?

简评:我还以为清理笔记本就是吹灰。 本文转自纽约时报(中文版),原文见文末。 你知道你的笔记本电脑很脏。你可以看到键盘上的灰尘和污垢,以及触控板中间的皮肤油印。那你上次清洁它是什么...

极光推送
40分钟前
1
0
中国经济模式转型的挑战

  中国经济模式转型的挑战   陈志武(耶鲁大学金融经济学教授)   今天我讲的题目是当前大家关心的,特别是这次金融危机之后,中国学界、决策层还有民间,都很关注中国以后的走向,社会...

吕伯文
46分钟前
2
0
win10玩docker无法Share Drivers的坑

Win10下使用Docker的开启Shared Drivers的时候,一直卡在:Sharing Drivers。 原因如下: 1.检查操作性系统的net share功能开启了没有 cmd-->services.msc 查看Server和Workstation两个S...

傲娇字符
47分钟前
0
0
Intellij Idea快捷键的使用

Ctrl +H 全文搜索 快捷键模式Eclipse Alt +左箭头 上一个方法 Alt + 右箭头 下一个方法 Ctrl + 左键点击文件title 提示文件路径 参考资料 http://wiki.jikexueyuan.com/project/intellij-ide...

轩辕剑
52分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部