论文总字数：24887字

摘 要

随着智能手机的飞速发展，人机交互已经不再局限于鼠标键盘或者简单的触控，去年，苹果公司和谷歌公司分别推出了自家智能手机系统下的增强现实开发平台——ARKit和ARCore，这标志着增强现实已经成为主流厂商关注的下一代人机交互重点。虽然已经有了原生的平台支持，但开发一个全平台的AR应用程序依然充满挑战，不同平台之间的技术支持不同，开发不能同步，难以保证最终的效果没有差异。Web应用程序具有方便访问，跨平台等优点，非常适合轻量级跨平台增强现实应用程序的开发。

本文对增强现实应用程序的框架和目前的技术发展进行了总结和综述，以简化代码，增强效率和减少耦合为开发目的，详细分析了在Web平台增强现实应用程序的具体开发思路，通过编码实现了最终的Web 增强现实应用程序，并对Web 增强现实应用程序的效率进行了测试，总结了Web 增强现实应用目前的效率瓶颈和可能的解决方案。

关键词：增强现实，Web应用程序，AR应用程序

Abstract

With the rapid development of smartphones, human-computer interaction is no longer limited to the mouse and keyboard or simple touch. Last year, Apple and Google launched the augmented reality development platform under their own smart phone system - ARKit and ARCore. This indicates that augmented reality has become the focus of the next generation of human-computer interaction that mainstream manufacturers are concerned about. Although there is already native platform, developing a full-platform AR application still is a challenge. Different platforms have different technical support and development cannot be synchronized. Web applications have the advantages of easy access, cross-platform, etc. It is the ideal platform for the development of lightweight cross-platform augmented reality applications.

This article summarized the framework of augmented reality applications and current development techniques. And designed a specific development idea for the application of augmented reality on the Web platform to simplify the code, enhance efficiency and reduce coupling, I also coded the final Web AR application, tested the efficiency of Web AR, and summed up the current efficiency bottleneck and improvement program of Web AR.

KEY WORDS: Augmented Reality, Web Application, AR Application

目录

摘要 I

Abstract II

第一章 绪论 5

1.1 课题背景 5

1.1.1 AR的研究背景 5

1.1.2 Web 应用程序的研究背景 5

1.1.3 Web AR的研究背景 5

1.2 国内外研究现状 6

1.3 论文目的及意义 6

1.4 论文内容 6

1.5 论文章节安排 7

第二章 增强现实的相关技术 8

2.1 AR的基本概念 8

2.2 数据采集和识别跟踪 8

2.2.1 基于传感器的跟踪技术 8

2.2.2 基于计算机视觉的跟踪技术 9

2.2.3 混合跟踪技术 9

2.3 渲染与交互 9

2.4 显示 10

2.5 本章小结 10

第三章 Web AR的技术架构分析 12

3.1 Web AR的系统框架 12

3.1.1 整体框架 12

3.1.2 为什么不使用混合跟踪 12

3.2 使用WebRTC获取摄像头数据 12

3.2.1 WebRTC的概念 12

3.2.2 使用WebRTC的API获取摄像头数据 13

3.3 处理获取到的数据流 13

3.3.1 在Web前端处理数据流 13

3.3.2 在Web后端处理数据流 14

3.3.3 后端处理的数据流的局限性 14

3.4 使用ARToolKit5实现基于Maker的AR跟踪 14

3.4.1 JSARToolKit5介绍 14

3.4.2 使用AR.js封装的ARToolKit组件 16

3.5 使用WebGL进行渲染 16

3.5.1 WebGL介绍 16

3.5.2 使用Three.js减少代码量 16

3.5.3 结合Three.js和JSARToolKit5实现跟踪和渲染 16

3.5.4 使用A-Frame框架结合数据获取和渲染 16

3.6 Web AR的交互 16

3.7 使用Web模块化的思想模块化AR的各个组件 17

3.8 本章小结 17

第四章 Web AR的具体实现 18

4.1 开发环境介绍 18

4.1.1 开发工具 18

4.1.2 所用库版本 18

4.2 系统层级结构 18

4.3 系统流程图 19

4.4 文件结构说明 20

4.5 本章小结 20

第五章 测试与分析 21

5.1 非功能性测试 21

5.1.1 测试环境 21

5.1.2 测试目的 21

5.1.3 测试方案 21

5.1.4 测试记录 21

5.1.5 测试结果分析 22

5.2 功能性测试 22

5.2.1 测试环境 22

5.2.2 测试方案 23

5.2.3 测试记录 23

5.2.4 测试结果分析 25

第六章 改善Web AR的方法研究 26

6.1 让Web AR更接近原生AR应用 26

6.1.1 使用渐进式Web应用开发技术（PWA）代替Vue开发 26

6.1.2 使用WebAssembly技术加快Web应用程序的运行速度 26

6.1.3 在Web端共享内存和多线程 26

6.2 使用多个AR Marker增强稳定性 27

6.3 结合二维码和AR Marker 27

6.4 进一步拓展Web AR应用程序的交互 27

6.5 本章小结 27

第七章 总结与展望 28

7.1 总结 28

7.2 展望 28

致谢 30

参考文献 31

绪论

课题背景

人机交互是计算机领域的一个重要研究课题，近年来，随着智能手机的飞速发展，人机交互不再局限于鼠标键盘或者简单的触控，以增强现实（Augmented Reality，下文简称AR）为代表的新一代人机交互模式不再局限于实验室的开发，进入到了人们的视野。去年，苹果公司和谷歌公司分别推出了自家智能手机系统下的AR开发平台——ARKit和ARCore，这标志着主流的智能手机已经在向AR为止的人机交互方向靠拢。增强现实应用未来可期。虽然增强现实在主流的移动平台已经有了官方解决方案，但开发一个全平台的AR应用程序依然充满挑战，不同平台之间的技术支持不同，开发不能同步，难以保证最终的效果没有差异。对于营销活动等为目的的轻量级AR应用程序，原生移动平台的开发时间和访问便捷性都难以满足开发要求。Web应用程序的开发周期短，方便访问，跨平台等优点，能很好地解决这个问题，非常适合轻量级AR应用程序的开发。

AR的研究背景

最早的AR开发至今已经过去了半个世纪，在AR的进化过程中，各种相关的研究课题已经得到了广泛的发展和讨论。早期的AR研究专注于阐述真实世界物体识别，追踪以及这些领域的研究如何发展。近年来，随着识别和追踪技术的不断完善，AR的研究已经逐渐由底层的基本技术支持发展为应用层面的研究。

手持型移动设备如智能手机，平板电脑具有侵入性低，社会可接受度高，易于获得且移动性强等适合AR应用程序开发的特点。近年来，手持移动设备的处理器，摄像头也都在飞速发展，足以支撑AR应用程序的开发，移动端AR已经迅速成为目前AR研究的最主要领域。

Web 应用程序的研究背景

Web应用程序已经由简单的网页开发转为复杂的模块化开发，这意味着复杂的大型应用程序不再只局限于在原生层开发，Web层也能利用模块化开发大型应用程序。模块化的开发思路允许Web程序员将Web应用程序将按照能划分为模块，最终实现协同开发。

剩余内容已隐藏，请支付后下载全文，论文总字数：24887字