交友APP

交友APP

摘  要

网络技术的不断发展，使网络成为人们的日常生活中不可缺少的一部分，而交友APP是网络的一种新型体现。交友是一个非常现实的问题，特别是在信息技术飞速发展的今天，人与人之间面对面的接触少得多。交友APP提供了这样一个平台，让你快速、轻松地结识志同道合的人。

该管理系统利用VS code开发工具，利用了Node.js语言和MySQL存储数据。该系统采用了一个基于Vue的框架结构，设计开发的交友APP。同时实现并完成了该系统的全部功能，系统的首要角色是管理员和用户。

关键词：交友APP,Node.js,MySQL,Vue
Dating APP

ABSTRACT

The continuous development of network technology makes the network become an indispensable part of People's Daily life, and dating APP is a new embodiment of the network. Making friends is a very real problem, especially in today's rapid development of information technology, face-to-face contact between people is much less. Dating apps provide a platform for you to meet like-minded people quickly and easily.

The management system uses VS code development tools, using Node.js language and MySQL to store data. The system uses a framework structure based on Vue to design and develop the dating APP. At the same time to achieve and complete all the functions of the system, the primary role of the system is administrator and user.

Key words: dating APP; Node.js; MySQL; Vue

目  录

第1章 绪论................................................................. 1

1.1 研究背景............................................................ 1

1.2 选题意义............................................................ 1

1.3 研究内容............................................................ 1

第2章 系统技术............................................................. 3

2.1 Vue框架............................................................. 3

2.2 MySQL数据库......................................................... 3

2.3 Uni-app框架......................................................... 3

2.4 Node.js技术......................................................... 3

第3章 需求分析............................................................. 5

3.1 系统目标............................................................ 5

3.2 系统可行性分析...................................................... 5

3.3 功能性需求.......................................................... 5

3.4 非功能需求分析...................................................... 7

第4章 系统功能设计......................................................... 9

4.1 功能模块设计........................................................ 9

4.2 数据库设计......................................................... 13

第5章 系统实现............................................................ 17

5.1 用户注册登录....................................................... 17

5.2 圈子内容管理....................................................... 17

5.3 好友申请管理....................................................... 18

5.4 好友信息管理....................................................... 19

5.5 群组信息管理....................................................... 20

5.6 用户主页面展示..................................................... 20

5.7 个人中心........................................................... 21

5.8 消息管理........................................................... 22

5.9 群组管理........................................................... 23

5.10 圈子管理.......................................................... 24

第6章 系统测试............................................................ 26

6.1 系统测试的目的..................................................... 26

6.2 测试过程........................................................... 26

6.3 系统测试的意义..................................................... 29

第7章 总结与展望.......................................................... 30

7.1 工作总结........................................................... 30

7.2 展望............................................................... 30

参考文献................................................................... 31

致　　谢................................................................... 32

第1章 绪论

1.1 研究背景

随着互联网的发展，我国上网的人数逐年在增加，网络已经渗透在我们生活的方方面面。交友APP的产生，说明了交友APP的发展前景良好。交友APP的使用与宣传，是社会的资讯物[1]。

人们开始习惯使用交友APP，原本没有联系的产生了联系，我们觉得即使我们在地球的两端，我们仍然很近，因为互联网已经把地球变成了一个地球村[2]。人们不能没有交流，所以有一个良好便捷的交流环境是非常重要的，这也是交友APP的必要性。本系统是一个基于Vue框架的交友APP，方便大家认识不同的朋友，不同地区文化交流与碰撞。丰富我们的个人生活。

1.2 选题意义

互联网技术的不断快速发展，早已成为人们的日常活动，而交友APP也因其自身的便利和快捷，使得用户能够更加轻松地接受。互联网为用户提供了便捷、快速的交友方式。

21个新世纪属于大数据社会，由于在管理交友APP信息的层次上存在着海量的数据，所以管理者要对海量的数据进行管理。因为电子电脑具有自动化的优势，所以许多用户选择使用电脑来进行海量的数据存储，从而提高了交友APP的工作效能与安全。对数据的处理愈是愈趋精密，愈能体现电脑管理之效益[3]。一开始的时候，管理员们都会选择传统的方式来进行数据的管理，但是因为数据的数量实在是太多了，如果要进行大量的数据隐藏的时候，很可能会导致系统的工作效率下降[4]。

1.3 研究内容

关于这篇文章的文献管理体系的文章有以下几章：

第一章为绪论。本文的研究背景、意义以及本文的框架。

第二章介绍了该软件的开发平台和技术。本文主要阐述了交友APP的开发背景以及所采用的技术。

第三章为需求分析。对交友APP的功能和非功能要求进行了详细的阐述。

第四章对整个体系进行了整体的设计。完成了各子系统的功能模块的划分与数据库的开发。

第五章为本论文的研究内容。该章主要介绍了各功能模块在交友APP中的作用。

第六章对本论文进行了详细的论述。这一章介绍了如何利用黑箱测试进行系统的试验。

第2章 系统技术

2.1 Vue框架

Vue具有Web站点的设计构件，使用该构件可以更好地构建站点的各个模块。Vue基于 Html, CSS, JavaScript等语言，其编码更加简洁，更便于编写Web应用程序。Vue Framework不但可以创建前端网页，还可以减少系统的开销。Vue的优势有很多：

（1）可与装置及浏览器相适应。能够与 FireFox等流行的浏览器相适应。

（2）反应式排版。Vue的前部结构是一个内部的流形格栅，它可以根据使用者的计算机的解析度来自动调节网页，这样就不会出现由于分配法则的问题造成的版面混乱。

（3）CSS系统的模块性；Vue架构中的 CSS部件可以让您可以对网页进行直接的访问。

（4）内置JavaScript插件。JavaScript的外挂可以为网站的效果而使用。

（5）大量的组件。Vue Framework包含大量的构件，如导航条和标签库等。

2.2 MySQL数据库

MySQL是Oracle数据库的主要产物，是一种基于关系的数据库。MySQL指的是一个数据仓库，它可以被看作是一个真实的文档。使用者可以利用这个数据库储存资料至数据库。MySQL所用的语言版本是作为建立表的语言。

由于MySQL系统的安装费用低廉，运行速度较快，因此许多中小公司在使用 MySQL数据库时都会采用 MySQL。MySQL数据库具有良好的性能，而且它的源代码是自由的，因此可以大大减少企业的开发费用。

2.3 Uni-app框架

Uni-app是一款基于VUE框架的前端应用开发框架。其优点分为三点：其一是Uni-app采用多端开发，极大提高了开发效率，一套源码可以运行到许多宿主环境中。其二是Uni-app学习成本低，Uni-app封装的组件与小程序相似，上手容易。其三是功能强大，Uni-app 提供了丰富的组件和API，可以满足开发者的大部分需求，可以快速实现复杂的功能。本项目是基于Uni-app框架使用Hbuilder开发平台开发的小程序端。

2.4 Node.js技术

Node.js是一个基于Google开发的V8引擎的JavaScript运行环境。Node.js实现了通过JavaScript来开发后端。Node.js作为一门较新的语言，由于其异步I/O的特性，在高并发的I/O场景下比传统服务器语言的处理效率更高，近年来逐渐成为主流的服务器开发语言。由于Node.js发展时间较短，目前基于Node.js的Web服务端框架正处于发展阶段[5]。而其基于模块化的设计使得用户可以通过引入自己所需要的模块实现相应的功能。

第3章 需求分析

3.1 系统目标

利用MVC技术和MySQL技术，实现了交友APP中最大限度地解决了交友APP中遇到的各种问题。

交友APP的实施要根据现实情况，明确用户的需求，并对其进行需求的分析，进而制订出系统的设计方案，并对其进行分析，最终形成一个完整的交友APP的设置。

（1）各子系统应保持各自的独立性和稳定性，便于各子系统的开发与维修。

（2）在管理中应充分顾及各部门之间的工作关系，尽量将各功能子部门置于同一职能的管辖范围内，便于对各子系统进行有效的控制。

（3）用户对交友APP的操作不要太过繁琐，因为不同的使用者拥有的操作权利也是不一样的，所以必须在使用者的表格中进行区别[6]。

在系统的表现上，对用户的接口要更加的人性化，而且可以让使用者简单的学习。在开发过程中，要注重开发费用，以保证系统的运行效益。

3.2 系统可行性分析

本文在分析了该系统的目的后，从技术、经济两个方面对交友APP进行了可行性分析。

（1）技术上是可行的。在开发交友APP的过程中，软件和软件的需求并不高，只要Win10就可以了，不需要硬盘，而且价格也不贵。在软件上，仅需建立一个数据库和一个编译环境即可，而且在许多系统中使用了大量的软件，因而可以降低开发费用。

（2）经济上是有可能的。经济上的可行性，需要通过交友APP所产生的效益，来弥补软件的研发费用。利用本系统，可以极大地减少人工的工作，提高管理的效率。本系统采用开放源码架构，利用开放源码架构可以减少开发费用。该系统具有很好的扩展性，便于维护，从而极大地减少了后期的维修成本。

（3）在实际应用中是切实可行的。交友APP的研制，是为了便于用户使用，在设计与实施过程中，要考虑到使用者的可操作性。此次的交友APP没有太多的专业性，所用的按键和接口也是用户比较熟悉的。

3.3 功能性需求

用例图是一种以图形方式说明系统用户对操作功能的基本认知的方式。可以直观地看到，用户正在使用系统的操作权限。从另一个角度来看，它相当于用户在需求分析中想要的功能动作的设计和实现[7]。下面将分别对用户和管理员的用例图进行说明。

用户：登录、消息管理、好友管理、群组管理、圈子管理、个人中心。用户用例图3-1所示。

图3-1 用户用例图

管理员：登录、通知公告、群组信息管理、圈子内容管理、好友申请管理、好友信息管理、系统管理、开发管理。管理员用例图如图3-2所示。

图3-2 管理员用例图

3.4 非功能需求分析

（1）在使用客户机进行系统存取时，要检验交友APP相关的运行状况，并在此基础上设定多个伺服器，改善其运行效率。MySQL支持高速缓存，利用 MySQL对数据库进行缓存，调整数据库的参数，改善数据库的运行效率。若采用数据库的快取特性，则在使用者存取同一资料时，可以从快取中读出资料，加快资料存取的效率。

（2）在使用过程中，交友APP必须要有足够的可靠性和承受一定的负荷。当程序中有一些微小的差错，那么交友APP的操作需求就不会受到很大的影响。当系统发生故障时，必须保证交友APP的基础设施还能正常工作。

（3）在进行交友APP的过程中，要考虑到它的可维护性，它要求使用多层次的体系结构，软件开发人员在划分的过程中要考虑清楚，便于后期的维护。

（4）该交友APP的相关体系内容具有灵活的检索功能，当管理员在查询的同时进行信息的录入，可以有效地提升检索的速度[8]。

第4章 系统功能设计

4.1 功能模块设计

该系统分为客户端、服务端和数据库端三大部分，客户端采用了开放源码的架构，便于用户对系统的功能进行操作。在服务方中采用 HTTP，通过采用统一的协议可以降低由于工作的不同而造成的问题，从而简化了软件的研发过程，降低了软件的研发困难，从而增强了系统的可重用性等内容。

4.1.1 设计结构

该系统的主要功能是 MVC，将用户的要求发送到控制区进行处理，由该控制区将采集到的信息与该视图相关联结合，从而对该数据进行存储和应用。互动接口也是可以向使用者展示的视图内容。

4.1.2 业务流程

（1）登录

管理员在登录后可以对系统的所有信息进行查询和管理。

结束

登录成功

数据是否正确

查询数据库

接受登录信息

登录失败

开始

是

否

图4-1 登录流程图

（2）注册

使用者必须先进行登记才能登录，如果输入的信息跟数据库记录相冲突则不能够成功注册。

结束

注册成功

用户是否存在

查询数据库

数据是否为空

开始

接受注册信息

注册失败

是

是

否

否

图4-2 注册流程图

（3）用户管理

管理员在登录了系统以后，就可以直接管理自己的系统了。

开始

删除用户

是否删除

输入修改的信息

是否选择用户

是否修改

结束

选择用户

进入链接管理界面

选择要进行的操作

是否增加

输入要添加的用户信息

是

是

否

是

否

是

否

图4-3 用户管理流程图

4.1.3 层次模块

图4-4 功能模块图

4.2 数据库设计

数据库是一个档案库，利用相应的api界面来管理数据。在很久之前，可以将资料储存在档案里，不过透过这个方法储存与阅读资料的效率并不高，因此，在执行过程中，必须使用 MySQL来储存及阅读资料。MySQL是一个自由开放的、基于关系的数据库，它必须以关系模式为核心，用基本的代数等概念来进行数据的分析。

4.2.1 概念模型设计

该交友APP的功能设计目标是针对使用者的需求而设定的，而建立系统的概念模型则是建立一个目标架构，建立一个数据库必须包括此一步。该系统具有大量的资料，能够代表交友APP中的实体，并能利用E-R图表来表达。

（1）当数据被处理时，可以满足使用者的需要，并且可以对现实的世界进行更高效的显示和反馈。

（2）用户在使用过程中易于使用，数据库的设计要更加复杂，但是易于理解。

（3）当数据要求变化时，可以方便地更改数据库和模型结构。

图4-5 数据库E-R图

4.2.2 逻辑结构设计

使用MySQL相关内容建立了一个可用于存储系统所需数据的数据库表格。

（1）sys_user表

表4-1  sys_user表

列名	数据类型	长度	主外键
user_id	bigint	20	主键
dept_id	bigint	20
account	varchar	50
password	varchar	100
nick_name	varchar	50
real_name	varchar	100
avatar	varchar	1000
birthday	date	0
sex	tinyint	0
email	varchar	50
phone	varchar	50
telephone	varchar	50
last_login_ip	varchar	100
open_id	varchar	64
last_login_time	datetime	0
user_type	tinyint	0
status	char	1
create_time	datetime	0
create_user	varchar	64
update_time	datetime	0
update_user	varchar	64
is_deleted	tinyint	0
remark	varchar	255

（2）gen_plan表

表4-2 gen_plan表

列名	数据类型	长度	主外键
id	bigint	20	是
name	varchar	50
code	varchar	50
sort	int	11
remark	varchar	255
create_time	datetime	0
create_user	varchar	64
update_time	datetime	0
update_user	varchar	64
is_deleted	tinyint	0

（3）gen_form_component表

表4-3 gen_form_component表

列名	数据类型	长度	主外键
id	bigint	20	是
label	varchar	50
value	varchar	50
sort	int	11
remark	varchar	255
create_time	datetime	0
create_user	varchar	64
update_time	datetime	0
update_user	varchar	64
is_deleted	tinyint	0

（4）gen_datasource表

表4-4 gen_datasource表

列名	数据类型	长度	主外键
id	bigint	20	是
name	varchar	54
db_type	varchar	54
config_type	char	1
url	varchar	1000
username	varchar	64
password	varchar	100
sort	int	11
host	varchar	100
port	int	11
database_name	varchar	64
instance	varchar	100
remark	varchar	255
create_time	datetime	0
create_user	varchar	64
update_time	datetime	0
update_user	varchar	64
is_deleted	tinyint	0

第5章 系统实现

5.1 用户注册登录

在登记之前，用户必须要填写相应的身份信息内容，然后进行登录，然后将登记的资料保存在数据库中，然后在上面填写登记的资料，确认无误之后，方可登录。在后台的逻辑程序中，必须要有一个 login的定义，然后根据使用者的名字来找到使用者的资料，然后利用 SQL语句来查询使用者的资料，当使用者的名字与数据库中的资料不符时，就会在后台显示使用者的资料。使用者也可以重新设置口令、呼叫session中的invalidate来登出使用者。

图5-1 登录界面

5.2 圈子内容管理

在圈子内容的管理界面中，可以利用网页的方式来呈现信息，如果有大量的数据可以进入下一页，利用网页的工具类别来完成上一页和下一页的效果。当管理者在输入栏中查找圈子内容的信息时，必须向后端的逻辑编码的query功能进行传输，当可以查询到圈子内容的相关数据时，就必须通过put功能将这些数据导入到前面的接口中。管理员单击“移除”键后，就必须在后台程序中设定“delete”功能，并使用SQL声明来删除圈子内容的相关信息。

图5-2 圈子内容管理界面

5.3 好友申请管理

管理员在管理交友APP相关资料的同时还必须要有后端界面来完成好友申请的增、删、查。前面的好友申请显示要求使用列表功能，并且在前面和后面的资料都是由请求对象来传送的。好友申请信息被包装成页面物件，而前端介面使用规则运算来分析页面。好友申请的资料必须储存在好友申请的本体类别中，而好友申请类别的资料与数据库内的数据库资料一一相符。管理员要加入好友申请信息，必须登录后台，按下“加入”键，加入按键需“绑定”。

图5-3 好友申请管理界面

5.4 好友信息管理

在好友信息的管理界面中，可以利用网页的方式来呈现信息，如果有大量的数据可以进入下一页，利用网页的工具类别来完成上一页和下一页的效果。当管理者在输入栏中查找好友信息的信息时，必须向后端的逻辑编码的query功能进行传输，当可以查询到好友信息的相关数据时，就必须通过put功能将这些数据导入到前面的接口中。更改键的时间必须与后台的逻辑程式码所设定的更新功能一致。管理员单击“移除”键后，就必须在后台程序中设定“delete”功能，并使用SQL声明来删除好友信息的相关信息。

图5-4 好友信息管理界面

5.5 群组信息管理

管理员在管理交友APP相关资料的同时还必须要有后端界面来完成群组信息的增、删、查。前面的群组信息显示要求使用列表功能，并且在前面和后面的资料都是由请求对象来传送的。群组信息信息被包装成页面物件，而前端介面使用规则运算来分析页面。群组信息的资料必须储存在群组信息的本体类别中，而群组信息类别的资料与数据库内的数据库资料一一相符。管理员要加入群组信息信息，必须登录后台，按下“加入”键，加入按键需“绑定”。

图5-5 群组信息管理界面

5.6 用户主页面展示

用户进入交友APP后可以看见五大导航块（消息、好友、群组、圈子、我的）用户主页界面如图5-6所示。

图5-6 用户主页面展示界面

5.7 个人中心

用户在个人信息处可以修改个人的账户信息。用户修改信息界面如图5-7所示。

图5-7 个人中心界面

5.8 消息管理

用户输入正确的账号和密码登录后，会收到好友消息，可以对好友消息进行查看以及回复。好友消息界面如图5-8所示。

图5-8 消息管理界面

5.9 群组管理

用户点击群组，可以进行新建群组、建群后可以在群里发送消息。群组管理界面如图5-9所示。

图5-9 群组管理界面

5.10 圈子管理

用户点击圈子，可以查看其他好友的圈子内容，也可以自己上传内容到圈子里。圈子管理界面如图5-10所示。

图5-10 圈子管理界面

第6章 系统测试

在整个软件开发过程中，都要进行软件相关测试，以确定系统的功能满足需求，以及满足性能需求的合理性。通过软件测试，可以对软件进行更好的质量保障，对软件进行需求分析，对代码进行最后的复查。软件测试是为了使系统更好地进行优化。

6.1 系统测试的目的

该软件的主要目标是：

第一，保证了软件的品质相关问题，保证了交友APP员的安全性问题，另外，它还可以发现在软件的研发中存在的缺陷，以及各模块的功能能否正确的应用与实施[9]。

第二种，是要有即时的资讯，比如技术工作者的回馈，以及评估所必需的资讯。

第三种，既能检验最终的交友APP体系满足基本需求，又能检验出在整个设计中的交友APP的严密程度。在试验中，一旦有问题出现，必须要及时修复。

在进行软件开发的过程中，测试员需要完成以下工作：

（1）查找并纠正体系中的不足。

（2）查找在函数试验中出现的系统故障。

（3）对所述软件进行的所述压力进行试验，由此可以判定所述软件的可用性是否优良。

（4）能否满足测试体系的基本性能[10]。

6.2 测试过程

6.2.1 登录测试

表6-1 登录用例表

模块测试	测试用例	预期结果	实际结果	是否通过
登录	账号:abo 密码:abo	能够使用系统功能	可以有效使用系统功能	通过
登录	账号:null 密码:abo	无法良好使用系统功能，系统提示请输入账号	无法良好使用系统功能，系统提示请输入账号	通过
登录	账号:abo 密码:null	无法良好使用系统功能，系统提示请输入密码	无法良好使用系统功能，系统提示请输入密码	通过
登录	账号:null 密码:null	无法良好使用系统功能，系统提示请输入账号	无法良好使用系统功能，系统提示请输入账号	通过

6.2.2 圈子内容管理测试

表6-2 圈子内容管理用例表

模块测试	测试用例	预期结果	实际结果	是否通过
圈子内容管理	管理员希望增加圈子内容的资料，并键入圈子内容必须填写的资料	在没有与数据库纪录冲突的情况下，可以加入第一份记录	在没有与数据库纪录冲突的情况下，可以加入第一份记录	通过
圈子内容管理	管理员希望增加圈子内容的资料，并键入圈子内容必须填写的资料	在有与数据库纪录冲突的情况下，不可以加入第一份记录	在有与数据库纪录冲突的情况下，不可以加入第一份记录	不通过
圈子内容管理	管理员希望移除圈子内容资讯单击删除键	若要管理员移除的圈子内容跟数据库信息互相绑定，那么则不能够成功删除	若要管理员移除的圈子内容跟数据库信息互相绑定，那么则不能够成功删除	不通过
圈子内容管理	管理员希望移除圈子内容资讯单击删除键	若要管理员移除的圈子内容跟数据库信息不互相绑定，那么则能够成功删除	若要管理员移除的圈子内容跟数据库信息不互相绑定，那么则能够成功删除	通过
圈子内容管理	如果管理员希望在输入框中查找圈子内容的资料，请键入圈子内容名称搜索	如果输入的使圈子内容名称与数据库纪录不符，无法找到	如果输入的使圈子内容名称与数据库纪录不符，无法找到	不通过
圈子内容管理	如果管理员希望在输入框中查找圈子内容的资料，请键入圈子内容名称搜索	输入的使圈子内容名称与数据库纪录相符，成功找到信息	输入的使圈子内容名称与数据库纪录相符，成功找到信息	通过

6.2.3 群组信息管理测试

表6-3 群组信息管理用例表

模块测试	测试用例	预期结果	实际结果	是否通过
群组信息管理	管理员希望增加群组信息的资料，并键入群组信息必须填写的资料	在没有与数据库纪录冲突的情况下，可以加入第一份记录	在没有与数据库纪录冲突的情况下，可以加入第一份记录	通过
群组信息管理	管理员希望增加群组信息的资料，并键入群组信息必须填写的资料	在有与数据库纪录冲突的情况下，不可以加入第一份记录	在有与数据库纪录冲突的情况下，不可以加入第一份记录	不通过
群组信息管理	管理员希望移除群组信息资讯单击删除键	若要管理员移除的群组信息跟数据库信息互相绑定，那么则不能够成功删除	若要管理员移除的群组信息跟数据库信息互相绑定，那么则不能够成功删除	不通过
群组信息管理	管理员希望移除群组信息资讯单击删除键	若要管理员移除的群组信息跟数据库信息不互相绑定，那么则能够成功删除	若要管理员移除的群组信息跟数据库信息不互相绑定，那么则能够成功删除	通过
群组信息管理	如果管理员希望在输入框中查找群组信息的资料，请键入群组信息名称搜索	如果输入的使群组信息名称与数据库纪录不符，无法找到	如果输入的使群组信息名称与数据库纪录不符，无法找到	不通过
群组信息管理	如果管理员希望在输入框中查找群组信息的资料，请键入群组信息名称搜索	输入的使群组信息名称与数据库纪录相符，成功找到信息	输入的使群组信息名称与数据库纪录相符，成功找到信息	通过

6.3 系统测试的意义

本交友APP的设计包括需求分析、功能设计、系统实现和软件的调试等多方面内容。需要分析的目标就是决定这个软件的价值和它的可用性。功能性的设计决定了软件的功能。本系统的实施是为了能够将一套实用的交友APP体系得以实践。而对于软件的测试，就是对整个系统的检测。如果能够尽早地解决这些问题，那么后期的经济损耗就会大大减少，而且还能减少损失的程度。因此，在正式发布之前，一定要先把问题解决清，然后再进行有计划、有组织性的检测。一旦该软件开始运行，其发现问题的危害程度就会被无限的扩大，进而对使用者的体验产生一定的负面作用。