基于WebRTC的学习交流平台的设计与实现

来源 :计算机与网络 | 被引量 : 0次 | 上传用户:deboywang126
下载到本地 , 更方便阅读
声明 : 本文档内容版权归属内容提供方 , 如果您对本文有版权争议 , 可与客服联系进行内容授权或下架
论文部分内容阅读
  摘要:基于网络实时通信(WebRTC)开源技术,设计了音视频学习交流平台的结构和工作界面,在传递语音和视频的同时,可以根据需要自由切换窗口和调节音量。分析了学习交流平台的工作流程,使用Chrome浏览器和高位摄像头,借助Javascript调用WebRTC的Web API接口,建立一个音频和视频交流平台,实现几个同学之间的学习交流。通过多次使用证明,学习交流平台达到了预期的良好效果。
  关键词:WebRTC;Chrome;视频交流平台
  中图分类号:TP393.08文献标志码:A文章编号:1008-1739(2018)06-65-3
  Design and Implementation of a Learning Communication Platform Based on WebRTC
  HE Yuxuan1, HE Honglei2(1. Jiangsu Xinhai Senior High School, Lianyungang Jiangsu 222006, China; 2. Lianyungang Technical College, Lianyungang Jiangsu 222006, China)


  0引言
  Google的网络实时通信技术可以实现2台计算机之间建立直接的音视频通信,而Chrome浏览器支持WebRTC技术,所以可以使用Chrome浏览器建立直接的通信,包括音视频和其他数据[1]。
  基于这种技术,发送方使用摄像头和麦克风捕获本地的语音和影像视频,然后对音视频进行编码并传输到对方,接收方收到音视频后按照指定的方式播放,即可以建立2个用户之间的音视频交流。通过一台服务器将一个小组内几台计算机的地址信息相互传递,小组内所有计算机按照这个地址信息两两之间建立连接,这样就可以实现一个学习小组的几个同学之间的视频交流了。
  1 WebRTC
  WebRTC是Google提供的开源技术,目的是让开发者能够基于浏览器,轻易快捷地开发出丰富的实时多媒体应用。主要技术包括语音和视频的搜集、编解、网络传送及接收等功能,并且还支持在多种平台上运行[2]。WebRTC提供的Web API是面向浏览器的接口,Web开发者使用这些接口,无需关注多媒体的数字信号处理过程,只需编写简单的Javascript程序,就可实现浏览器之间的音视频通信,WebRTC体系结构如图1所示。


  WebRTC提供的面向浏览器的接口(Web API)有3个。
  (1)MediaStream
  MediaStream能够通过设备的摄像头及话筒获得音视频的同步交流,并且可以通过参数设置获得视频流的高度、宽度和清晰度[3]。
  MediaStream对象又叫做getUserMedia对象,它包含一个或多个单独的轨道(MediaStream Track)。同属于一个MediaStream的Track间彼此同步。输入源可以是物理设备,如麦克风、网络摄像机及来自用户硬盘或远程网络对等点的文件。MediaStream的输出可以被发送到一个或多个目的地,用JavaScript进行后期处理,或者发送到远程节点。
  (2)RTCPeerConnection
  通过这个接口,可以在2个浏览器之间直接建立点对点之间稳定、高效的音视频流信道[4]。功能包括:①负责整个ICE流程;②负责发送automatic(STUN)keepalives,保持Peers的连接[5];③管理本地媒体流;④管理远程流;⑤触发各种跟媒体流有关的事件;⑥提供offer、answer及连接状态查询等。
  (3)RTCDataChannel
  在RTCPeerConnection的基础上建立了一个数据通道,使得浏览器之间能够传输任意数据[6]。
  2学习交流平台的设计
  学习小组的视屏交流界面设计是在浏览器的页面中设置一个长方形的区域,放置参加交流的用户的视频,每当有新用户加入学习小组,会依次将其视屏窗口加入到交流区域,如图2所示,上部是用户的名字,名字右边是最小化和最大化按钮,中间是用户的视屏,底部是视频的声音大小调节滑块控件。


  学习小组的用户在视频学习交流时,为了方便演示交流,配置了一个高位的摄像头,从上向下拍摄,将桌面上的试题和演算过程拍摄下来,这样其他用户就可以很清楚地看到解题过程。
  当某个同学发言讲解的时候,可以点击他的视频窗口的最大化按钮,将其窗口放大,视频看得更清楚。例如B同学开始讲解,将他的窗口最大化,其他同学的窗口缩小,如图3所示,当其他同学发言講解的时候,可以点击其他同学窗口的最大化按钮来切换。


  3交流平台的实现
  Google不但提供了WebRTC技术,还给出了不少实用的demo。这些demo展示了如何搭建语音视屏交流平台,其中在GitHub.com网站上就有不少。通过分析demo的流程,并结合学习小组的实际需求,设计了学习小组交流平台的工作流程,如图4所示。
  服务器端提供Web服务和信令服务,在Windows Server 2008上分别使用IIS和Node.Js的WebSocket模块搭建,Web服务器端编程语言使用asp.net,数据库使用SqlServer。而客户端平台使用Win7系统和Chrome浏览器,编程语言使用Javascript调用WebRTC的接口。部分关键代码如下:   var getUserMedia =……//声明音频视频捕获对象
  var PeerConnection=……//声明音频视频传输连接对象
  socket = new ReconnectingWebSocket (server);//连接到websocket服务器
  function createPeerConnection()//创建音频视频连接对象
  function addStreams()//捕获本地音频视频流,并添加到PeerConnection
  PeerConnection.onaddstream = function(evt){……}//


  接收到对方发来的音视频流,将视屏窗口添加到浏览器的交流区域,系统实际运行结果如图5所示。3个同学进行学习交流,摄像头高位向下拍摄,可以捕获书桌上的试题图像和同学的语音。当某位同学讲解题目时,将其窗口最大化,可以看到清楚的画面,同学之间可以交流学习内容。


  4结束语
  通过Google的开源技术WebRTC,使用摄像头和Chrome浏览器,并参考GitHub.com网站上的示范,搭建了一个高中同学课后视频交流学习的平台,非常的简单有效,利用有限的课后时间达到了同学们互相学习的目的。在平台的多次使用过程中,发现存在一些缺陷,例如参加小组学习的同学不能太多,最好3~4个人,如果人数太多,会造成视频传输不流畅的现象。另外,如果使用音箱播放声音,就会有回音噪声,所以最好使用耳机,总体来说平台还是很实用的。
  参考文献
  [1] Ristic D.Learning WebRTC[M].北京:电子工业出版社,2016.
  [2] Johnston A B.WebRTC权威指南[M].北京:机械工业出版社,2016.
  [3]张向辉,黄佳庆,吴康恒,等.基于WebRTC的实时视音频通信研究综述[J].计算机科学,2015,42(2):1-6.
  [4]林鴻,王松,杨鑫等.基于WebRTC技术的应用及平台技术开发与设计[J].电信科学,2013(9):20-25.
  [5]屈振华,李慧云,张海涛,等.WebRTC技术初探[J].电信科学, 2012(10):106-110.
  [6]郭旭.基于MOOC的在线教学实验平台的设计与实现[J].计算机工程与设计,2016,37(2):545-550.
其他文献
介绍了土城矿采煤四区15128回风巷大断面交岔巷修时采用锚网喷、锚索、注浆支护方式的情况。
【摘要】新课改下的小学语文教学,应与时俱进,研究和总结学生习作的客观规律,提高课堂教学。习作是学生运用掌握的语言进行思想情感表达的重要方式,是他们认识自我、认识世界、进行创造性和独特性表述的重要过程。  【关键词】小学语文 习作教学 立足生活 多批少改《九年义务教育全日制小学语文教学大纲》规定,我国现阶段对小学作文教学的要求是:“会写简短的记叙文和常用的应用文,做到思想健康、中心明确、内容具体、条
经济全球化的浪潮极大地加强了各个国家和地区之间的联系,而语言作为交流沟通的载体,在经济、文化交流中起到了关键性的纽带作用。从“跨文化”的概念和中学英文教学大纲要求出发,分析了跨文化意识培的主要目标,并于文末给出了具体的教学建议。  中学英语教学语言文化跨文化意识语言,在浅层次上表现为一种口头或书面的交流工具,在深层次上则是一种历史传承的、动态发展的文化符号。语言与文化之间存在着千丝万缕的联系,是不
信息化时代,现在基本上是每人都拥有一台手机,现实中,可能你会收到某个亲戚的短信或电话,来电是显示“亲人”名字,然而你仔细看看号码,这并不是你亲友手机号码,这是怎么回事?近日,国内知名黑客安全组织东方联盟曾演示过这一技术:“你可以从你的朋友那里收到一条短信,在后来才发现它不是真的来自你的朋友?在使用iOS上的联系人框架之后,惊讶地发现这是一种非常现实的可能性。Apple和Google都已收到通知(同
现在,许多网络安全专家谈论网络攻击的情况并不少见。随着移动通信和云计算技术的发展,私营企业网络和公共互联网之间明确界定的界限实际上已经基本消失了,而让IT部门更为担心的不只是预算缩减和影子IT,还有网络安全。  在IT安全管理员必须管理的众多问题中,员工使用个人设备开展工作的需求不断增长。ComScore表示,移动通信正迅速成为全球城市数字活动的主要模式。虽然这包括在公司中使用个人移动设备如平板电
摘要:数学是一门基础学科,是生活重要的组成部分,它能够影响人类生活的各个方面,帮助人类计算、推理和证明,有效解释生活中遇到的困难,是一切科学研究的基础学科。就如何在小学阶段学习好数学知识,养成良好的数学学习习惯进行研究,目的是提高学生的数学学习素养,进而提高综合素质能力。  关键词:数学教学 学习习惯 独立思考 认真听课 阅读课本  《数学课程标准》指出,数学是人们在生活、劳动和学习中必不可少的工
在初中数学教学实践中,受传统教学观念的影响,老师教学模式相对单一,学生在学习过程中会出现较多的问题。分层教学是一种较为新颖的教学形式,能够在对学生有效分层的基础上,
【关键词】一年级动态教学快乐识字  小学语文第一冊要求认识常用汉字400个,这么大的识字量对于一年级小学生来说,无疑是繁重的。如果教师一味地让学生被动、机械识字,势必会造成他们的厌学情绪。在起步阶段让识字教学“活起来”“动起来”,显得尤为重要。  一年级学生的思维特点是具体形象思维为主,教师要把课本中大量的、抽象的归类识字由“静”变“动”,调动学生的眼耳口鼻心脑感官刺激,让一个个方块字在学生的头脑
摘要:分析了数据的存储架构和存储网络间的通信技术,针对教学过程中由于缺少存储设备而导致的数据存储实验难做的问题,给出了一种实验室的NAS存储设计方案,并介绍了在VMware中使用FreeNAS实现NAS技术的方法。该方法在一个虚拟机上安装了FreeNAS,并建立了磁盘阵列作为共享存储,设置OPT网卡和iSCSI目标,使得客户端连接到存储服务器,访问磁盘阵列。通过教学实践,取得了不错的教学效果,有一
课堂提问是一种教学手段,更是一种教学艺术。在现今动态生成型的课堂中,我们要不断优化课堂提问的方法、过程、内容、角度和表达,充分发挥提问的有效性。