| 标题 | 虚拟3D场景在网页间对等传输的实现 |
| 范文 | 王成烨 摘 要：在Web3D虚拟场景的应用中，如何用对等传输来支撑海量用户对于海量模型数据的下载是亟待解决的问题。利用谷歌公司的WebRTC技术，该文尝试搭建了浏览器之间的对等数据传输通道，分析了虚拟场景传输与加载的特性，从提升加载速率和优化用户体验的角度出发，设计和实现了虚拟3D场景在网页间对等传输的原型系统。实际应用表明，该系统达到了设计目标，成功实施运行，对于p2p技术在场景传输方面的应用提供了一定的借鉴。 关键词： 对等传输； WebRTC； Web3D 中图分类号：TP393 文献标识码：A 文章编号：1009-3044（2016）36-0203-04 The Realization of the Transmission of the Virtual 3D Scene between the Browsers WANG Cheng-ye （Software Institute，Tongji University，Shanghai 201800，China） Abstract：In the application of Web3D， it is urgent to solve the problem that how to use the P2P transmission to support massive users to download massive model data. By the Googles WebRTC technology， this paper tries to build a peer-to-peer data transmission channel between browsers， analyzes the characteristics of virtual scene transmission and loading.To increase the loading rate and optimize the user experience， the paper design and implement a prototype system of virtual 3D scene transmission between web pages. The practical application shows that the system achieves the design goal and provides some references for the application of P2P technology in the scene transmission. Key words：P2P transmission； WebRTC； Web3D 1 引言 虛拟现实（VR）技术是近年最为火热的技术，其用计算机模拟生成动态的三维图形图像，营造出逼真的场景氛围，并可以和用户进行实时交互。近年来，随着浏览器技术的快速发展，尤其是WebGL技术的逐步成熟，人们可以开始在网页上加载和渲染大规模的3D模型。由于网页应用具有无需下载客户端、灵活方便、跨平台等特点，基于网页的虚拟现实被越来越多的应用到生产生活的各项领域。例如常见的网页虚拟游戏、网页场景漫游、网页模拟购物等。由于3D虚拟场景应用具有场景模型数据量大、用户量多的特点，如何支持3D场景高效安全的传输成为了一个新的课题。传统的C/S架构中，用户统一向服务器发出下载请求。服务器面临着巨大的负载压力和高并发的用户请求，用户的下载质量也受到服务器上传带宽的限制。采用P2P架构进行对等传输可以解决上述问题，在P2P架构的传输系统中，分布在系统中的节点既是模型内容的下载者，也将自己已经下载好的内容分享给其他节点。P2P架构可以充分利用用户节点的上传带宽，分担服务器压力，提升传输效率。本文基于谷歌公司的WebRTC技术，搭建了浏览器间的数据信道，设计并实现了在浏览器间对等传输虚拟场景的原型系统，为用户化身在网页虚拟场景中的畅游提供了网络支撑。 2 虚拟3D场景传输系统的总体设计 2.1 虚拟3D场景传输系统的拓扑设计 常见的P2P传输系统可划分为集中式P2P，分布式非结构化P2P，分布式结构化P2P和混合式P2P[1]。在本系统中，我们的节点架构使用混合式非结构化的P2P架构。这样的设计是出于以下的考虑： （1） 本系统针对的是大规模的虚拟场景传输和海量用户，如果采用集中式P2P架构，中心服务器管理系统中所有节点的信息，虽然无需传输模型数据，但仍然需要处理高并发的用户请求。并且一旦中心服务器崩溃，整个系统就无法运行。故集中式P2P架构不适合本系统。 （2） 分布式结构化P2P系统一般采用DHT结构来管理节点组织，节点在系统中的资源发现、资源查找等行为均建立在节点间的信令交换的基础之上。现有的WebRTC技术虽然支持浏览器间模型数据的传输，但信令的交换还是要借助WebSocket和信令服务器才能够进行。当前技术无法满足浏览器之间直接传递信令。故结构化P2P不适合本系统。 （3） 综上所述，浏览器间的P2P传输仍需借助信令服务器，而为了防止信令服务器单点失效，系统需配置多台信令服务器。因此，我们最终选择了混合式非结构化的P2P架构，该架构中有多个超级节点担当信令服务器的角色。每个超级节点管辖一部分普通节点，并为其管辖的普通节点中转信令，超级节点之间也互相传递信令。系统具体的拓扑设计如图1所示： 图中的节点有三种，普通节点、超级节点和资源服务器。其中，普通节点就是虚拟场景中的用户，被相对应的超级节点管辖。普通节点向超级节点发送请求以获取下载源节点[2]。超级节点在系统中的作用主要有三个： （1） 作为信令服务器。普通节点间建立WebRTC数据传输信道之前需要交换SDP信令，而此时节点信道尚未建立，必须借助超级节点进行中转。普通节点通过WebSocket与超级节点进行通信，将自己的SDP信令报文发给超级节点，超级节点再转发给目的节点。之后节点间才能建立数据信道。 （2） 提供节点查找与选择服务。超级节点存储并管理着其所辖普通节点的性能、带宽信息以及拥有数据的信息。当普通节点需要寻找拥有其所需数据块的节点时，其发送请求给超级节点。超级节点根据存储的信息进行分析计算，并返回一定量的候选下载源给请求节点。请求节点根据返回的节点信息再向它们建立对等连接进行数据传输。 （3） 提供NAT穿透的功能。由于内外网之间IP地址会进行转换，因此两个处于内网之下的节点如果想交换信令建立对等连接，必须进行NAT穿透。超级节点通ICE框架进行NAT穿透，使得节点之间能顺利地建立信道连接。 图中的Resource Server是资源服务器[3]，资源服务器提供系统中场景模型的初始副本下载。当系统中的节点退出而导致某些数据块无法下载时，节点转而向资源服务器进行请求。请求节点的请求一旦超时未收到回应，说明下载链路存在问题，节点也转而向资源服务器进行请求。 2.2 虚拟3D场景传输系统的系统架构 Web3D传输系统主要设计为四层架构，分别为数据信道层，节点选择层，模型数据传输协议层，Web图形渲染层。图2所示为具体的系统架构。 （1） 数据信道层 数据信道层是系统最底层的模块，该模块主要由WebSocket信道和WebRTC信道组成。数据信道承担了传输信令和传输模型数据的通道的作用。在WebRTC信道建立之前，普通节点需要建立WebSocket信道和超級节点进行通信，借助超级节点进行SDP信令交换，以建立WebRTC信道。除此之外，普通节点寻找模型数据下载源向超级节点发出查询信息也借助的是WebSocket。WebRTC信道建立之后，普通节点之间利用WebRTC的信道来传输模型数据。 （2） 节点选择层 节点选择层是基于数据信道层之上的，普通节点通过WebSocket向超级节点发出查询请求，以选择模型最优下载源。超级接收到普通节点的请求后，在其存储中查找到所有拥有该模型的节点信息，通过算法计算出最合适的下载源节点返回给请求节点。请求节点再与该节点建立WebRTC连接并开始下载模型数据。 （3） 模型数据传输协议层 普通节点在场景中通过算法选择优先下载的模型后，就进入模型数据传输协议层进行具体的模型传输。我们将模型等分成较小的piece，piece又等分成block，block是系统中最小的传输单位。普通节点每次请求模型的一个piece，并通过节点选择层获得拥有该模型数据的节点。普通节点与其建立WebRTC连接，向其发出下载piece的请求。下载源节点接收到请求后，以block为单位将piece传输给请求节点。请求节点接收到完整的piece后，对piece的完整性进行验证，如果验证通过，则该piece下载完毕，开始下载新的piece，直到整个模型被下载完毕。 （4） Web图形渲染层 当场景中的全部模型数据被依序下载完毕后，进入图形渲染层将模型场景渲染出来。本系统使用的是基于WebGL的图形渲染库Three.js，其使用简洁方便，能够在网页上高效快捷的渲染模型。 2.3虚拟3D场景传输系统的类的设计 系统的类图设计如图3所示。整体类图设计的思路是单个的类负责具体的功能，降低类之间的耦合性。本系统采用MVC的架构，其中Controller类负责系统整体的流程。整个Controller类分成两个大块。Controller类中的成员对象Discovery类负责节点选择最优下载源并与之建立对等连接。其利用底层的Socket类建立WebSocket连接并通过其上的Tracker类与超级节点进行对话，利用Simple-peer类建立WebRTC连接。Controller类中另一个部分则是进行模型数据的下载工作，其建立在Simple-peer类之上的Wire类来实现模型传输的具体协议。我们将模型等分成piece，又将piece等分成block[4]。节点每次请求一个block，收到block后会更新标志位，收到一个完整的piece后会验证其完整性并下载下一个piece[5]。 2.4 虚拟3D场景传输系统的系统流程 2.4.1 普通节点的流程设计 （1） 用户化身所代表的普通节点进入系统后，在场景中自由的漫游。每当有场景模型进入其视野范围后，普通节点就开始对其下载。普通节点首先向超级节点发送模型数据块的信息，向其请求候选下载源。超级节点接收到请求后查询自身存储，选择最优的下载源返回。普通节点获取最优下载源信息后通过超级节点的信令传递与之建立WebRTC连接[6]。 （2） 普通节点与下载源建立对等连接后，向其发出下载一个piece的请求。请求节点维护一个下载状态表。下载源节点每次向请求节点发送一个block，等到全部的block发送完毕后，请求节点会验证收到的piece内容是否完整正确，如果校验成功，请求节点会更改下载的状态，表示这个piece已经下载完毕了。 （3） 如果该模型在系统中没有节点拥有，或者下载时间超时，普通节点会转向资源服务器完成下载。 （4） 普通节点重复以上流程，每次请求一个piece，直到整个模型下载完毕。普通节点通过three.js库将模型渲染出来，用户就能在场景中看到该模型了[7]。 2.4.2 超级节点的流程设计 （1） 超级节点首先建立http服务器，并在http服务器之上建立WebSocket服务器，开放9090端口，监听来自普通节点的请求。一旦有普通节点发出了连接的请求，超级节点就与之建立WebSocket连接。 （2） 普通节点通过WebSocket向超级节点发送节点查询请求。超级节点接收到报文后，搜索自身的存储，查找拥有请求节点所需模型的最优下载源，并返回给普通节点。同时，超级节点向下载源中转普通节点的SDP信令，以帮助两者之间建立WebRTC连接[8]。 （3） 以上步骤完成后，超级节点继续监听9090端口，以处理来自其他节点的请求。 2.4.3 资源服务器的流程设计 （1） 资源服务器保存有系统模型的初始副本，其监听来自普通节点的下载请求。 （2） 一旦普通节点无法正常下载模型，就转而向资源服务器发送请求。资源服务器接收到请求后将相应的模型传输给请求节点。 3 结论 对等传输系统的Web3D场景应用的重要支撑，高效的传输系统能够保证用户实时下载所见的场景模型，不会感觉到卡顿和延迟。本文研究了如何在浏览器之间建立WebRTC对等传输信道，并以此设计和实现了虚拟3D场景在网页间对等传输的原型系统。该系统首次将对等传输的设计应用到VR领域中，可以安全高效的传输模型场景数据，是一次创新的尝试，也对未来相应的研究起到一定的借鉴作用。 参考文献： [1] 周文莉， 吴晓非. P2P技术综述[J]. 计算机工程与设计， 2006， 27（1）：76-79. [2] Koskela T， Kassinen O， Korhonen J， et al. Peer-to-peer community management using structured overlay networks[C]// International Conference on Mobile Technology， Applications， and Systems， Mobility Conference 2008， Yilan， Taiwan， September. 2008：1-6. [3] Koskela T， Heikkinen A， Harjula E， et al. RADE： Resource-aware distributed browser-to-browser 3D graphics delivery in the web[C]// IEEE International Conference on Wireless and Mobile Computing， NETWORKING and Communications. 2015：500-508. [4] 汪燕， 柳斌. BitTorrent協议分析及控制策略[J]. 实验技术与管理， 2006， 23（1）：54-56. [5] Pouwelse J， Garbacki P， Epema D， et al. The Bittorrent P2P File-Sharing System： Measurements and Analysis[J]. Lecture Notes in Computer Science， 2005， 3640：205-216. [6] Vogt C， Werner M J， Schmidt T C. Leveraging WebRTC for P2P Content Distribution in Web Browsers[C]// IEEE Intern. Conf. on Network Protocols. 2013：1-2. [7] Williams J L. Learning HTML5 Game Programming： Build Online Games with Canvas， SVG， and WebGL[M]. Addison-Wesley Professional， 2011. [8] Burnett D C. WebRTC： Handling Media on the Web[M]// Multimodal Interaction with W3C Standards. Springer International Publishing， 2017. |
| 随便看 |
|
科学优质学术资源、百科知识分享平台，免费提供知识科普、生活经验分享、中外学术论文、各类范文、学术文献、教学资料、学术期刊、会议、报纸、杂志、工具书等各类资源检索、在线阅读和软件app下载服务。