摘要：如今，随着移动终端的迅速普及，移动端的应用也急速递增，由于原生App在面对终端多样化需要逐个进行适配的压力，Web App逐渐随着前端技术的更迭而高速发展，有着一套代码兼容多个平台设备的优势，作为一种轻应用，Web App在未来5G等高速网速的加持之下，将会有着媲美原生App的优秀用户体验，具有很大的应用价值。又由于当下社会节奏过快，用户难以抽出整块时间来进行阅读，通常使用的方式便是使用随身携带的终端来进行碎片化的阅读，而听书功能在其中便是具有着重要的现实意义。所以，此款电子阅读器Web App是具有开发意义的。

本论文就电子阅读器Web App的开发与设计做了完整的叙述。通过的对本系统的需求分析确定了系统的书城功能、书架功能、听书功能和阅读器功能，将使用前端流行的vue框架来进行实现，其中涉及的技术有vue-cli脚手架自定义搭建系统、epubjs解析和渲染电子书，axios发出请求下载文件以及科大讯飞语音合成API。

本文运用Web开发技术，实现了对系统的开发、测试与完善，并在本论文中叙述了开发过程与主要功能的实现。

 

关键词：Web App；电子阅读器；前端；Vue

 

目 录

摘 要

Abstract

1绪论-1

1.1系统背景-1

1.2研究现状-2

1.3系统意义与目的-3

2相关技术概述-4

2.1前端相关概述-4

2.1.1前端开发的三要素-4

2.1.2前端框架介绍-5

2.2系统后端相关概述-6

2.2.1 node.js-6

2.2.2 nginx-7

2.3系统数据库相关概述-7

2.4语音合成技术-7

3系统需求分析-8

3.1系统可行性分析-8

3.2系统功能需求分析-8

3.2.1阅读器功能-8

3.2.2书城功能分析-9

3.2.3书架功能分析-9

3.2.4听书功能分析-9

4系统概要设计-10

4.1系统总体设计-10

4.1.1 系统体系架构的设计-10

4.2主要功能模块设计-11

4.2.1阅读模块设计-11

4.2.2书城模块设计-12

4.2.3书架模块设计-13

4.2.4 听书模块设计-13

4.3数据持久层设计-14

4.3.1 localstorage存储-14

4.3.2 IndexedDB存储-14

4.3.3 MySQL数据库-14

5系统实现与测试-16

5.1系统实现-16

5.1.1 阅读器模块实现-16

5.1.2 书城模块实现-20

5.1.3 书架模块实现-22

5.1.4 听书模块实现-23

5.2系统测试-24

5.2.1 系统测试环境-24

5.3.2 测试内容-24

5.3.3 测试结果分析-27

6总结与展望-28

6.1全文总结-28

6.2 未来展望-28

参考文献-29

致谢