《基于Springboot的医学知识普及网站设计》18000字（论文）

、引言1.1课题背景妥瑞氏症是一种发生在儿童时期的慢性神经异常，最典型的症状就是抽动，会出现眨眼、噘嘴、耸肩、挤眉弄眼等症状。TD在人群中的患病率约为0.3%-0.9%,患者具有很强的性别差异（患者男女比例约为2-4:1）REF_Ref71127927\n\h[1]。妥瑞氏症不是精神疾病，而是中枢神经系统异常，不会影响智能发展。但许多患者因合并了注意力不足过动症和强迫症，或不加思索讲出不得体的话，甚至讲脏话等，被视为“没教养”，这些现象引发的生活与学习困扰往往大于疾病本身。综述近年有关抽动秽语综合征病因病机、临床治疗等方面的文献，认为本病病因主要与外感、情志、饮食、失治误治等因素有关REF_Ref29565\n\h[2]。妥瑞儿多在五到七岁左右被确诊症状在青春期达到高峰后，有三分之一的妥瑞儿症状会完全消失，三分之一的症状会逐渐减轻，而剩余的三分之一患者终生与妥瑞氏症为伴。大多数妥瑞氏症患童家长并不知晓妥瑞氏症，而将患者怪异的举动视为故意“捣蛋”，这种错误的对待方式一度导致许多患者对自身生理产生怀疑。这种现象的产生很大程度上是由于妥瑞氏症的疾病资料受众极其有限，信息获取的困难影响了大部分人。新时代下，随着网络与互联网技术的不断迭代更新，一批又一批成熟的社交网站、科普网站层出不穷，以疾病为主题的平台也不在少数，妥瑞氏症作为一种冷门且无有效医疗手段的疾病，一直都与此类网站的重点内容无关。综上所述，患者对妥瑞氏症资料的需求程度十分巨大。妥瑞氏症患者的心理健康问题对患者的影响并不亚于妥瑞氏症本身。患有妥瑞氏症的同时，往往会衍生出各种症状，包括强迫症、焦虑症、学习障碍、睡眠障碍，过度频繁抽动也会为病人带来头痛，肌肉酸痛等不适。而怪异的生理抽动所引起的是旁人异样的眼观，甚至嘲讽、谩骂，若其亲友亦没有妥瑞氏症相关的知识储备，患者极有可能遭到来着亲友的误解，儿童患者遭到父母打骂更是屡见不鲜。妥瑞氏症是一种由于脑神经传导物质不平衡所导致的慢性病REF_Ref29624\n\h[3]。而在医学界，妥瑞氏症依然是一个冷门的病种，许多医生并不能根据患者的生理症状正确推断出患者患有妥瑞氏症，即使诊断出症状，也更多认为是心理问题。基于以上问题，妥瑞氏症的社交需求并不亚于对疾病资料的需求。因此，作为妥瑞氏症患者的本人，决定基于这两大点需求设计一款以妥瑞氏症为主题的网站，以自身所学软件工程知识，力求为患者的需求和痛点提供一个合理的解决方案。1.2研究目的收集妥瑞氏症资料进行初步的疾病研究以觉得疾病资料的展示形式，与患者交流以进一步了解用户需求，研究社交网站、科普网站、医疗疾病网站并将其特点整合，完成初步的设计工作。通过病友咨询用户心仪的网站功能形式，完成网站功能模块拆分以及网站界面交互设计。基于妥瑞氏症患者的社交需求和对妥瑞氏症疾病资料获取困难的需求，充分拆解并分析需求后转化为可落地实现的解决方案，并结合互联网环境下火热的社交板块功能点，利用网站开发服务端、浏览器端、数据库等技术，独立完成一个妥瑞氏症疾病科普与社交网站。该网站能够在提供妥瑞氏症研习资料的同时，给用户一个自由交流平台。在这个基础上，分享一些疾病相关的影视作品以激励患者用户积极面对病情，健康生活。系统除核心功能模块外，提供网站常备功能以保证用户体验良好，设计后台管理系统用以发布疾病资料、影视资源以及维护网站内容的绿色、健康。后期，通过相关公众号和相关影视作品了解隐藏于表面下的深层用户需求，逐步完善项目。最后研发成果需达到能够满足用户社交、疾病科普的大部分需求，并且通过各项软件测试指标，产出一个具备可用性、可靠性的网站系统。1.3国内外现状分析从调查文件的统计情况看，经常关注疾控行业网站的人群比例为27%，而经常关注卫生行业网站的则达47%REF_Ref29686\n\h[4]。妥瑞氏症主题网站作为医疗疾控类网站的一个主题分支，从整个大环境来看，关注度很低，这一点从许多患者甚至不知道自己患的是妥瑞氏症这一现象上有鲜明的体现。从互联网方面来看，国内外的社交网站、科普网站数量巨大，医疗、疾病主题的网站也为数众多，但集社交、科普、医疗疾病等类似主题与一身的网站几乎无具有代表性的解决方案，单独以妥瑞氏症为主题的网站更是寥寥无几。在国内，符合这一设定的只有台湾妥瑞氏症协会的官方网站，而从当前情况来看，该网站近两年并没有更新的迹象。在国际上，妥瑞氏症收关注度依然不高，只有一位英国妥瑞氏症患者开发过一款名为Touretteshero的妥瑞氏症主题网站，但网站用户量稀少，功能点也十分单一。但从其他社交、娱乐软件所出现的妥瑞氏症相关信息中，大多数用户的回复皆表示对患者的理解以及鼓励，可见互联网环境下，对妥瑞氏症患者的态度是十分友好的从患者本身的状况分析，现在的患者们寻找资料手段仍然十分单一，几乎都是依靠搜索引擎来收集疾病资料。在社交方面，大多数患者没有自己的病友圈，且能够通过搜索引擎找到的qq群、微信群十分有限。但已经掌握一点疾病资料，甚至有用病友圈子的患者们所展现出来的社交欲望非常强烈，他们十分渴望倾诉自己因为疾病所遭受的不平等对待，也非常积极地分享自己的成长经历，更是十分珍惜与病友们的交流时光。总而言之，国内外妥瑞氏症网站数量极其少，患者在互联网上找到与疾病相关信息的需求缺口依然很大。1.4论文结构本文在结构上分为八章：第一章为引言，主要说明系统的研究背景与目的，以及对国内外类似网站现状的分析。第二章为开发环境以及系统框架概述，介绍系统开发技术栈与项目框架。第三章为可行性分析，从技术、经济、操作三个方面对项目可行性进行讨论分析。第四章为需求分析，表述已总结的项目目标客户群体的需求痛点以及从需求出发分析出项目的所有功能模块，并结合用例图进行描述。第五章为系统设计，从前台系统、后台系统两个方向来描述整个系统的设计思路。第六章为系统功能模块实现，从系统前端、后端两个层面来阐述系统各个主要功能模块的实现原理。第七章为系统测试，以保障系统可用性、安全性为出发点，阐述系统测试技术与方法。第八章为总结与展望，综述项目开发过程所遇到的问题与收获，并对项目未来的版本迭代、发展方向进行结果上的预期。

2、开发环境以及系统框架概述2.1项目系统开发环境及使用工具概述妥瑞氏症疾病科普和设计网站系统采用前后端分离式架构进行开发。在服务端，本人使用java语言进行开发，编辑器为IDEA。主要使用java开发生态中最为常用的springboot框架，加之spring系列的安全框架springsecurity实现认证、授权、攻击防护功能，搭配国内最为火热的orm框架mybatis及其mybatis-plus协同开发，另使用quartz，swagger等工具实现定时任务、接口文档等功能。数据库方面，使用官方开源的关系型数据库mysql进行数据存储，搭配最火热的非关系型数据库Redis进行数据缓存操作。前端方面，编辑器为VisualStudioCode，本人使用由华裔开发者研发的Vue.js及其配套组件进行开发，搭配国产ui框架element-ui搭建网站页面，使用极其适合Vue.js+element-ui项目结构的tiptap富文本编辑器实现用户自定义文章富文本化功能。2.1.1java语言Java语言是一门在编程界十分流行的面向对象编程语言，它摒弃了复杂的多继承和指针，完美诠释了“万物皆对象”的面向对象编程思想。据悉，当前有百分之八十以上的互联网应用服务端是采用Java进行开发的。编程人员在使用JAVA编写程序的时候，其具有优越的可复制性，即可以保证的程序在不同的编程环境下移植而没有出现错误。Java相对于其他服务端开发语言有着无比庞大的开发生态，加之JVM独特的JMM内存模型以及垃圾回收、类加载等机制，使得使用Java语言的开发者可以一心专注于系统业务的编码。2.1.2IDEA编辑器IDEA即IntelliJIDEA，是编程领域公认最好的java编码工具。它的开发初衷是实现“智能编码”，而其丰富的导航模式，简约优美的UI风格、灵活的排版功能以及庞大的插件库都受到了Java开发人员们的青睐。IntelliJ在业界被公认为最好的java开发工具之一,尤其在智能代码助手、代码自动提示、重构、J2EE支持、Ant、JUnit、CVS整合、代码审查、创新的GUI设计等方面的功能可以说是超常的REF_Ref29804\n\h[5]。2.1.3SpringBootSpringboot是Spring系列的核心框架，它继承并优化了Spring框架的所有特性，并且简化了spring应用的搭建过程。开箱即用、约定优于配置的策略使得项目减少了大量的XML配置，让开发人员能够更加专注于业务代码编写。为了方便地通过网络记录生活和信息交流,降低搭建网站的门槛,适宜使用SpringBoot后端技术和Bootstrap前端框架进行小型日常交流论坛搭建REF_Ref29846\n\h[6]。2.1.4SpringSecuritySpringsecurity也是spring系列框架之一，它主要能够提供认证、授权、攻击防护三大功能板块。相较于传统的安全框架shiro，它能够完美契合Springboot,提供更加细粒度的权限控制，且对OAuth、OpenID也有支持。2.1.5mybatis及mybatis-plusmybatis是国内最为流行的orm框架，它最受好评是它的灵活性。相比于传统的orm框架，它采用自定义Sql的方式，并且将Sql代码以XML文件的形式统一管理，减少了的多表关联查询的代码复杂度，加之强大的动态Sql功能使得数据层的编码灵活性大大提高。而mybatis-plus是mybatis的增强工具。Mybatis-plus参考了Hibernate和jpa的优点，解决了mybatis在任何情况下都需要开发人员手动编写Sql的痛点，在使用注解和继承BaseMapper的情况下就可以实现基础的数据库增删改查操作。系统开发者可根据预定义的注解和相关通用查询方法快捷操作数据库,避免了在Java文件中编写大量的sql文本和xml文件,降低了代码错误率,提高了开发效率REF_Ref29895\n\h[7]。2.1.6MySql数据库MySQL是一种开放源代码的关系型数据库,因其体积小、速度快、可靠性高等特点而被广泛应用REF_Ref29937\n\h[8]。相较于oracle，它官方开源这一特点更加适合中小型软件项目，MySql强大的索引功能为系统频繁的读操作提供了速度保障，内存占用率低这一点更是十分适合计算机资源有限的学生开发者。2.1.7Redis数据库Redis作为高性能的分布式非关系型数据库,在互联网应用中表现极佳REF_Ref29996\n\h[9]。它最大的亮点是基于内存的数据读写所提供的高性能，故应用于数据缓存功能。Redis另有哨兵、自动分区等机制，使得其在高可用领域有不可代替的作用。2.1.8VisualStudioCode编辑器VisualStudioCode简称VSCode，是\t"/item/visual%20studio%20code/_blank"Microsoft开发的一款可运行于各种操作系统的源代码编辑器，它有对\t"/item/visual%20studio%20code/_blank"JavaScript，\t"/item/visual%20studio%20code/_blank"TypeScript和\t"/item/visual%20studio%20code/_blank"Node.js的内置支持，并具有丰富的其他语言极其运行时扩展的生态系统。2.1.3Vue.jsVue.js作为前端开发的渐进式框架，严格遵循CMD标准REF_Ref30042\n\h[10]。“数据驱动视图”是vue最大的特点，这使得dom操作大大减少。相较于react和angular，vue更容易上手，简单小巧的核心足以开发任何大型应用。图2-1系统技术选型图2.2系统开发框架概述本系统采用B/S架构的前后端分离式开发。系统后端采用的是经典的MVC框架模式，即把代码按照功能分为三层，模型层(Model)、显示层(View)、控制层(Controller)。并且使用Springboot+mybatis进行开发。Springboot的自动配置中包含了SpringMVC的所有组件，并格外提供了更多的注解简化了Controller的操作。近年来,Web前端开发变得越发复杂。相应的,也出现了众多的MVC框架。从其积极作用来看,将MVC框架合理的应用到WEB前端开发中,能够在一定程度上提升整个网页的运行效率REF_Ref30140\n\h[11]。MVC架构的优点在于耦合性低，重用性高，部署快，生命周期成本低，可维护性高。视图层和业务层的解耦使得修改视图层代码的同时无需修改数据模型和控制器代码，且多个视图可以共享同一个数据模型。本系统基于MVC所进行的架构如下：(1)Model(模型)模型在本系统中具体表现为各种POJO、DTO、VO对象，POJO对象是对每一张数据库表的数据映射对象；DTO是针对特定业务设计的数据传输对象，主要表现形式为从数据库取出的各类数据在经过筛选、结合后的数据集合；VO是用于与前端交互的对象，主要表现形式为前端请求对象和数据返回对象。(2)View(视图)在本系统的后端中，视图并没有具体的表现形式，在整个系统的架构中，这部分被完全交给前端负责。而视图中的数据来源是基于前后端的ajax交互，数据模型以json格式在前后端传输。(3)Controller(控制器)控制器是处理视图与业务代码中交互问题的关键。控制器在本系统中的表现形式即由每一个Controller类组成的控制层。Controller类使用Springboot集成SpringMVC并优化的各项注解进行编写，像前端提供了后端的接口地址及参数，并且调用业务层进行业务处理。后端项目核心目录由controller、service、dao、domain组成，另有存放配置代码、工具代码、枚举、常量、定时任务等等必备目录。Controller代表控制层，负责接收前端请求，进行各项校验，并在返回业务层处理数据的返回结果的同时，体现状态码、错误信息等必要的返回数据项。Service代表业务层，负责业务逻辑代码的编写，调用数据访问层完成对数据库的读写操作，将最终的数据返回给控制层。Dao代表数据访问层，封装了针对数据库表的原子操作，并最终返回POJO或DTO对象。Domain代表数据模型对象，即各种POJO、DTO、VO对象，保证每种数据可以被各层代码复用。系统前端采用MVVM架构，即将代码按照功能分为Model（模型），View（视图），ViewModel（视图模型）三个部分。MVVM（Model-View-ViewModel）模式是软件架构设计模式,是一种程序设计思想,在软件开发过程中进行分层设计,各层有不同的任务,目的是减少程序代码的耦合,提高软件的重用性、可维护性、可扩展性REF_Ref30195\n\h[12]。本系统基于MVVM架构的设计详情如下：(1)View(视图)视图层即展示给用户的页面，本系统使用国产UI框架ElementUI编写界面样式，使用vue-router控制页面路由，保证用户的界面体验一流。(2)ViewModel(视图模型)本系统前端使用Vue.js框架进行开发，Vue.js框架很好地实现了ViewModel该有的功能，数据双项绑定功能完美实现了视图随数据变化而变化，将HTML、CSS代码和数据无缝连接在一起。(3)Model(模型)前端系统从后端系统得到返回的Json数据一定程度上已经是视图的体现，加上前端代码自己的封装，产出可供视图层直接使用的数据模型。而在像后端发起请求时，则封装与接口参数格式一直的数据模型对象。前端项目中，将访问后端接口的api单独封装以供调用，再将页面中可重用的部分封装成vue组件以减少代码耦合度等，都是为了实现视图和模型间的解耦，从而实现高内聚低耦合的代码结构，这些都直接体现了MVVM的思想。

3.可行性分析软件工程项目开发并不是纯粹的技术行为，在新时代的背景下，软件项目往往会与商业、公益、服务、教育等领域挂钩。能够保证项目初步落地，顺利开发，并在成功投入市场后能够正常迭代的前提并不单单只有技术这一项保证因素，在项目落地前期进行各项可行性分析的重要性是不言而喻的。本系统并非是具有商业性质的盈利型互联网项目，而是为妥瑞氏症患者群体及他们的亲友所设计的具有公益性质的互联网平台。公益性是本项目的一个重要性质，故在进行可行性分析的过程中，需要着重考虑技术成本、经济成本以及用户操作难度系数几个方面。保证公益性的同时，不可避免的是经济效益的牺牲，所以本项目要尽量减少经济上的前期开支。本项目由本人独立开发，所以开发过程的可靠性完全取决于本人的技术水平，故在技术选型上会选择更加成熟的框架以及本人更加熟悉的技术栈。妥瑞氏症并不会影响患者的智力水平，故患者群体是一个身份多样化的群体，即系统的操作难度必须能够运行最普通的用户正常使用。保证在尽量低的经济成本下，使用开发者所持有的技术成本，产出一个操作难度尽量低的网站。故本项目的可行性分析将从技术可行性、经济可行性、操作可行性三个方面进行阐述。3.1技术可行性按照系统架构的设计，本系统所采用的B/S架构节省了客户端的技术成本，无需自主开发客户端，而将系统核心功能集中在服务器端上。系统后端技术栈主要是依赖Java生态中的Spring系列。Spring系列作为Java编程语言的核心技术栈，可以应付绝大多数规模的系统开发。Spring系列作为完全开源的框架集合，学习渠道非常丰富，从快速入门到深入理解皆有许多网络教程。对于身为学生的开发者而言，已经完全具备使用Spring系列框架的技术水准，可以保证项目后端的顺利编码。系统数据库使用的是开源的关系型数据库MySql和Redis，二者皆为互联网数据库技术中的火热技术，且使用orm框架使得数据库操作变得更加简单高效，能够实现绝大部分的数据库操作。系统前端主要使用Vue.js框架及其衍生技术，Vue.js相对于传统前端框架而言，具有易上手的特点，且对运行环境的要求十分宽松，其精致小巧的核心足以应对任何规模的前端应用，十分适合学生开发者。部署项目所需的服务器使用的是租赁的云服务器。云服务器由云服务器的开发商提供，服务器质量可以得到非常好的保证，且项目部署速度快。云服务的优势还在于，开发人员无需关注服务器本身的维护。不需要承担硬件损耗的责任。本项目开发所要求的技术栈中，都是当前互联网技术中的主流，且皆是本人最熟悉的软件开发技术，基本可以杜绝在开发过程中遇到技术工具自身问题无法解决的现象。在开发过程中，并不会出现临时引入新技术栈的举动。可以保证在当前的开发条件下达到功能目标、性能目标，在规定的期限内完成整个项目。3.2经济可行性从技术工具的经济成本上分析，Spring系列完全是开源的，不需要支付任何费用。使用的数据库MySql和Redis也是完全免费，Vue.js更是由作者亲自讲解过整个项目源码。visualstudiocode编辑器完全免费，而IntelliJIDEA编辑器也对学生开发者免费开放，虽然免费版本所支持的功能有限，但对于本项目而言完全足够。所以系统所需的开发工具是不需要支出经济成本的。唯一需要费用的是租赁供项目部署的云服务器，但普通的云服务器费用并不高昂，且云服务器对学生群体有较大的优惠政策，完全在可以接受的范围内。从科普资料的成本上看，妥瑞氏症的疾病资料虽然少，但价格并不高昂。只需购买相关的书籍进行研读即可。且互联网上能够搜索的到疾病资料数量已经足够网站初期的展示需求，故这一方面的经济成本也十分低，唯一需要大量花费的是时间成本。本项目是一个公益性的项目，而非盈利型的商业项目。故项目开发完成后并没有商业利润收入。但妥瑞氏症患者的数量并所占人群基数的比例并不高，系统对高可用、高并发、性能优化等指标并没有非常高的要求，故完全不需要通过增加服务器数量、外聘技术人员、购买硬件设备等经济花费来提高系统可靠性，所以在项目后期维护的成本并不高。3.3操作可行性本系统界面主题色为浅蓝色，UI风格简约淡雅，能够使用户对所有功能操作一目了然。网站配有必备的导航栏菜单、个人中心等必备功能，能够在提供完整的业务服务的前提条件下，使用户快速上手网站的所有功能，保证用户的良好体验。疾病资料方面，用户只需简单地点击浏览资料文章，从中提取所需的信息即可，并不需要很高的操作技巧。该模块会显示所有相关信息，并加以合适的排版，保证用户能够在有限的页面高度内获取到足够多的信息。社交方面，用户发表文章时可通过富文本编辑器对文章进行编辑排版，富文本编辑器的元素设置皆是与word软件类似的功能，用户只需具备基本的文章编辑基础即可完成文章的发表，且用户可以在个人中心页面浏览所有已发表的文章。经过以上几个方面的可行性分析，本次系统的开发出了在经济成本上有较低的开销外，在技术、操作方面都没有另外的支出，时间成本虽然会比较高，但系统开发时间安排已经足够。本人有信心能够在规定的期限内，完成项目的落地、整体研发和测试工作。

4、需求分析在确定功能模块之前，是将用户的需求充分拆解，深度分析用户真正需要的功能，并且结合当前互联网环境中较为流行的社交、医疗、科普、公益网站的功能板块进行充分融合，最终形成各种以妥瑞氏症为主题的实际功能形式。本人依据一些妥瑞氏症的疾病特性和患者心理特征，在进行了充分的病友咨询后，总结出了网站需要解决的一些用户痛点，并根据这些需求痛点进一步分析得出了本系统的所有核心模块。患者心理需求痛点与功能模块分析详情如下：（1）妥瑞氏症疾病资料获取渠道的缺失妥瑞氏症的冷门以及患者稀少的特性，决定了互联网上与妥瑞氏症相关的疾病资料非常少，大多数患者在使用搜索引擎进行搜索时，只能得到非常少的资料资源。且资料获取渠道几乎只有上网搜索这一种。当然，有热心病友创建了相关的微信公众号且持续更新，但由于公众号宣传力度不够大，至今关注人数并没有覆盖太多的患者群体。因此，系统实现了“疾病资料”模块，以达到科普妥瑞氏症的目的。（2）患者的不自信心理眨眼、做鬼脸是"抽动—秽语综合征"最为常见的症状REF_Ref30264\n\h[13]。妥瑞氏症的患者还会有不自主的抽搐、挤眉弄眼、发怪声等在外人看来是怪异的举动。这就很容易导致患者在日常生活中遭到嘲笑、歧视、谩骂。妥瑞氏症所带来的强迫症以及抽搐所引起的处事不便甚至肌肉酸痛都大大影响了患者的学习能力和日常生活。故极大一部分患者会有自卑心理。但妥瑞氏症对智力水平并没有影响，只要能够正视病情，依然能够取得事业上的成功。布拉德·科恩（BradCohen）自小患有妥瑞症（Tourettesyndrome）。但生性乐观的他最终战胜了种种挫折和困难,如愿以偿地成了一名优秀教师和青年励志演说家REF_Ref30306\n\h[14]。因此，网站的疾病资料模块添加了“名人病友”的资料类型，通过分析患有妥瑞氏症的妥瑞氏症名人明星来证明妥瑞氏症是并不是不可战胜的，以此激励患者们顽强对抗病魔，消除自卑心理，积极面对生活。患者对缓解病情的迫切希望虽然妥瑞氏症目前在医学领域并无有效的治疗方案。由于发病机制尚不明确,治疗手段单一,部分患儿经中医、西医治疗均不能取得满意疗效,为儿童临床难治性精神类疾病REF_Ref30368\n\h[15]。但随着现代医学的蓬勃发展，已经有许多专家正在尝试攻克这个难题。而妥瑞氏症患者对缓解病情的需求无疑是最大的。因此，网站的疾病资料模块提供“医学进展”板块，用以展示近年来医学在妥瑞氏症治疗方向上所取得的最新进展。（4）病情交流的需求妥瑞氏症的患者数量稀少导致患者在地理上的分部极其分散，大多数患者身边并没有病友，更没有多少人愿意关注妥瑞氏症，所以患者常常将自己的患病经历埋在心里。而在各大互联网社交平台中，出现妥瑞氏症相关内容的主题帖子下，都有相当一部分病友在倾诉自己的患病经历，可见患者们对病情交流有巨大的需求。只有同是患者的病友才能体会对方言语中所包含的沉重内涵。基于这个需求，本网站实现了“疾病论坛”模块，提供一个专门交流妥瑞氏症的论坛。（5）患者的隐私心理虽然患者在病情交流上有极大的需求，但依然有许多患者不希望暴露自己的个人信息。妥瑞氏症病情的背后，或许是一段极其不堪的过往，许多患者的童年过得并不幸福。很多患童的家长和老师并不知道妥瑞氏症，在患童出现抽动，发出怪声的时候，他们可能会认为这是故意的捣蛋行为，并加以打骂。这种情况对患者的心理打击极大，十分可能导致患者的内向甚至社交恐惧。预计将有很大一部分患者即有倾诉的欲望，但又因为羞于说出自己的生活经历而不敢发言。所以网站应该提供一种匿名的发声形式，从而解决这类用户的病情交流需求。基于这个分析结果，本网站专门实现了“树洞心声”模块，用户可以像对树洞倾诉一样表达自己的心声，而树洞模块的文章将不会展示作者信息，文章的评论也将只有作者自己可见，就像发送给树洞而得到的回声一样。线下社交的需求线上再火热的交流，也比不过面对面的情感诉说。大多数患者还是希望能够与广大病友进行线下的面对面密切接触，让对方成为自己生活中真正的朋友或知己。而最好的社交方式就是各类社交活动。在进行各种团体活动的同时，促进病友感情，舒缓因疾病而带来的消极心理，对患者的病情十分有帮助。所以网站应该提供一个能够发起各种由妥瑞氏症主题活动的渠道，使用户能够自由地发起活动、参加活动。所以，本网站实现了“疾病活动”模块，用户可以在该平台发起自己主办的妥瑞氏症相关活动，也可以报名他人举办的活动。（7）妥瑞氏症相关影视作品对患者的极大激励作用从妥瑞氏症进入民众视野开始，有一些导演在自己的影片中加入了相关的元素，甚至以妥瑞氏症患者为原型制作了电影。这些电影紧扣妥瑞氏症这个主题，讲述了主角与病魔抗争，不向生活低头的积极生活态度。而很可惜的是，这些影视作品的宣传度并不高，这就导致许多患者并没有知晓电影的机会。网站应该提供这些电影的信息资源以及在线观看链接（这些电影并不需要付费下载观看，各大视频网站均有免费观看链接），这能够让患者对疾病的态度有巨大的改变，是一个妥瑞氏症主题网站不可缺失的一部分。故本网站提供了“影视资源”模块，用以展示与妥瑞氏症相关的影视作品的各项信息，包括导演、主演、剧情简介、在线观看链接等等。作为一个需要发布资料，同时也提供用户发文渠道的网站，必须要有官方发送各类疾病资料的渠道，也要具备对用户发文进行审核、封禁相关操作的系统。所以本人设计了该网站的后台管理系统，主要提供疾病资料和影视资源的编辑发布以及用户发文和活动的审核功能。

5、系统设计5.1前台功能设计浏览器客户端系统分为六个模块：用户模块，论坛模块，疾病资料模块，树洞模块，疾病活动模块，资源库模块。用户模块：包含登录注册，个人中心。用以展示用户的个人信息以及提供个人资料的编辑修改功能。显示用户发布的论坛帖子、树洞心声、疾病活动信息，以及相对应的帖子回复、树洞回声与活动审核状态等必要信息。用户可以通过用户模块的相关功能了解到与当前账号有关的一切信息。论坛模块：实现论坛帖子文章的编辑、推送，用户点赞、评论等。用户编辑文章功能采用的是tiptap富文本剪辑器工具，提供了富文本化的所有功能选项，用户只需有拥有基本的word软件操作功底，就可以轻松上手。在评论功能的基础上提供子评论功能，即可以针对评论进行评论，使论坛交流内容更加丰富。疾病资料模块：实现妥瑞氏症疾病相关资料文章的推送。该模块的板块包括妥瑞士症研习（妥瑞氏症疾病的相关资料）、名人病友（患有妥瑞氏症的名人明星及其主要事迹和作品）、医学进展（推送近两年来医学领域在妥瑞氏症治疗方向上的最新进展）、活动推送（将成功举办并且顺利进行的病友活动编辑成文章推送）。树洞模块：用户可以以匿名的方式在树洞模块发送文章和音频（心声），音频文件可以是用户倾诉的录音，也可以是用户想要分享的音乐等等，展示出来的信息中并不会携带和用户有关的任何信息。其他用户可以进行回复（回声），但回声的信息中会显示评论者的昵称、头像，即心声作者会知晓给自己发送回声的用户是哪位。不过回声仅心声作者可见，其他用户在浏览心声文章时只能够看见文章内容而没有评论信息。活动模块：提供用户可以发起与妥瑞氏症相关的线上线下活动（需要管理员审核后方能成功发布，主要审核活动合法性、活动信息是否完善等）的渠道，系统实现活动信息展示并统计用户报名数据，在疾病资料模块推送成功举办的热点活动文章。资源库模块：展示与妥瑞氏症相关的影视作品信息，包括导演、主演、语言、影视类型、地区、上映时间、片长、剧情简介，以及在线观看链接（妥瑞氏症主题的大多数影视作品在各大视频网站都可以免费观看），影视具体信息由后台管理系统进行发布。5.2后台功能设计后台管理系统分为八个模块：用户模块，权限模块（角色管理）,菜单管理模块，疾病资料管理模块，树洞管理模块，论坛管理模块，疾病活动管理模块，资源库管理模块后台管理员相关功能：包含管理员的登录注册以及个人信息的编辑修改功能。管理员分为超级管理员和普通管理员两种，超级管理员能够增加管理员的数量，并对管理员进行管理。用户模块：针对网站系统用户进行信息展示和管理。菜单管理模块：对后天管理系统的导航栏菜单进行管理，通常操作是增加或删除导航栏菜单项。权限管理模块：对管理员账号的权限管理。超级管理员可以分配普通管理员能够访问的菜单项。论坛管理模块：对网站论坛模块进行管理，主要涉及到论坛文章的审核与封禁功能。疾病资料管理模块：后台管理系统负责对妥瑞氏症疾病相关资料文章的编辑和推送。该模块的文章编辑使用wangEditor富文本编辑器，管理员只需具备word软件的最基本功能的操作基础即可上手。树洞管理模块：针对网站树洞模块的心声文章管理。活动管理模块：对网站病友活动模块中的活动进行审核管理，没有审核通过的活动不出现在用户的视野中。资源库管理模块：对网站影视资源模块的电影信息进行管理。后台管理系统提供展示和发布影视资源的功能图5-1功能模块图5.3系统用例图网站用户在进行登录操作后可以浏览疾病资料和影视资源库，进行论坛和树洞的发文、点赞、回复，发起和报名疾病活动。图5-2网站用户用例图后台管理系统的超级管理员有权限使用所有功能，而普通管理员只有在超级管理员赋予权限后才可以访问对应功能。图5-3后台管理员用例图

5.4系统数据库设计本系统存储数据采用的是关系型数据库MySql，数据库引擎为InnoDB。数据库表设计并不是一蹴而就的工作，在创建表之前，是总结需要用到的数据。所以本人在设计数据库前所完成的工作是界面交互设计工作，即将各个页面的低保真原型制作完成，以提炼出所有需要的数据，在根据数据库设计理论基础绘画数据库E-R图（为避免干扰读者视线，以下所展示的E-R图并未附带具体表数据），然后创建每一张数据库表。图5-4用户/管理员属性E-R图图5-5疾病资料、疾病活动、影视资源相关E-R图图5-6树洞模块相关E-R图图5-7权限、菜单相关E-R图图5-8论坛相关E-R图所有数据库表及字段信息如下：用户表：用来存储普通用户和管理员用户信息（根据is_admin字段判断是否是管理员）。具体字段名称和类型如下：图4-9用户表(sys_user)权限表：基于权限信息建立的权限表，用来存储管理员的权限映射信息。具体字段名称和类型如下：图4-10权限表(sys_role)权限用户关联表：用来记录管理员的权限信息。具体字段名称和类型如下：图4-11用户权限表(sys_user_role)菜单表：记录后台管理的导航栏菜单项信息。具体字段名称和类型如下：图4-12导航栏菜单项表(sys_menu)菜单权限关联表：记录某个权限可以访问的菜单项。具体字段名称和类型如下：图4-13菜单-权限关联表(sys_role_menu)活动信息表：用来记录疾病活动信息。具体字段名称和类型如下：图4-14活动信息表表(tuotuo_activity)活动报名表：记录用户所报名的活动。具体字段名称和类型如下：图4-15活动报名表(tuotuo_activity_sign)论坛表：用来记录论坛文章信息，文章信息以html字符串的新式存储。具体字段名称和类型如下：图4-16论坛文章信息表(tuotuo_article)论坛文章评论表：记录论坛的第一级评论信息，即论坛文章下直接显示的评论信息。具体字段名称和类型如下：图4-17论坛文章评论表(tuotuo_article_comment)论坛文章子评论表：用来记录论坛的子评论，即第一级评论的评论。具体字段名称和类型如下：图4-18论坛文章子评论表(tuotuo_article_child_comment)论坛文章点赞表：用来记录用户点赞的论坛文章信息。具体字段名称和类型如下：图4-19论坛文章点赞表(tuotuo_article_child_comment)树洞心声表：记录树洞心声信息。具体字段名称和类型如下：图4-20树洞心声表(tuotuo_heartfelt_wishes)树洞回声表：记录树洞回声信息，即树洞文章的评论信息。具体字段名称和类型如下：图4-21树洞回声表(tuotuo_echo)影视资源表：记录影视资源的基本信息。具体字段名称和类型如下：图4-22影视资源表(tuotuo_film_resource)疾病资料信息表：用来存储疾病资料文章信息。具体字段名称和类型如下：图4-23疾病资料信息表(tuotuo_film_resource)

6、系统功能模块实现6.1系统前端功能设计通过数据流图以及用例图的分析，本系统的浏览器客户端前端中打算分为以下几个页面：妥瑞氏症研习页面、妥友论坛页面、树洞心声页面、妥友活动页面、影视资源页面、个人中心页面、发布论坛文章页面、发表树洞心声页面、发表活动、登录注册页面。所有页面跳转操作使用Vue-router统一管理。每一个页面都对应一个路由，而每个页面的子标签则在页面路由中新建一个子路由。对后端接口的访问统一封装好后，放置于项目src目录下的api文件夹中进行管理。接口使用axios工具进行访问，设置拦截器进行用户登录状态判定以及token验证，并在访问接口失败时弹出各种提示。当页面逻辑需要调用后端接口时，直接引入接口文件，调用相应的接口。页面布局：网站顶端置顶菜单项导航栏，各个页面设置有必要的子导航栏（子路由），方便用户浏览各个页面信息。妥友论坛、树洞心声、妥友活动、个人中心页面的右侧附带选项卡，可以路由到发布论坛文章、发表树洞心声、发起活动页面。导航栏右侧展示当前登录用户的昵称、头像信息，点击头像可进入到个人中心页面。妥瑞氏症研习模块：该模块页面用来展示妥瑞氏症资料相关的文章。页面顶端显示轮播图信息，轮播图下则显示疾病资料文章。根据妥瑞氏症疾病资料的妥瑞氏症研习（全部）、名人病友、医学进展、活动推送四种文章类型，分为四个子标签。轮播图依赖element-ui的carousel组件封装实现，加载页面时，在vue生命周期函数的create()中，根据用户选择的标签调用后端diseaseInformation相关接口，传入分页参数，模糊查询参数（用户没有填写就不传）获得疾病资料相关数据，并将数据渲染到页面上。用户点击文章时，控制路由跳转至资料详情页面，调用detail接口获取疾病资料文章数据并渲染至页面。妥友论坛模块：用户进入论坛页面时，调用后端接口得到数据并渲染论坛文章的标题、摘要、点赞数量、评论数量、作者（不展示文章内容）等信息，点击可跳转至文章详情页面。文章详情页面加载时调用文章详情articleDetail接口和文章评论comment接口，展示文章的详情和评论信息。用户点赞时，调用doLike函数请求后端接口进行点赞数量的添加，并且将页面上的点赞数量添加一次。用户进行评论时，调用新增评论接口存储评论信息，并再次调用comment接口请求最新的评论列表，异步渲染至页面上。图6-1心声发布功能前端设计流程图树洞心声模块：该模块页面展示用户发表的树洞心声文章和音频。用户在发表心声时除了可以编辑心声文章外，还可以上传音频文件，音频文件上传依赖element-ui的文件上传组件实现。在上传音频时，调用audio接口储存音频文件并得到后端返回的音频播放地址，然后将播放地址拼接入心声数据的实体类中，发布心声时，音频播放地址也作为参数传给后端进行储存。播放音频时，使用audio标签指向音频播放地址，即可从播放音频。音频播放组件使用element-ui的滑块组件结合原生js的音频操作api实现，编写定时事件来刷新每秒音乐播放的当前时间，根据音频长度和当前播放时间来动态更新滑块。妥友活动模块：该模块页面显示活动的海报、标题、摘要、报名时间、报名截止时间、活动开始时间、报名人数、活动地址等信息。加载页面时，调用activity相关接口，后端接口会自动过滤未审核通过或待审核的活动项，故前端页面调用activity接口时不需要传入审核状态相关的参数。报名按钮颜色调用signBtnType方法，按照活动信息中的“报名开始时间”，“报名截止时间”进行红色、蓝色变换和可用、禁用转换，当处于报名时间时为绿色用户点击报名时，调用doSignUp接口，传入报名信息，后端返回200时则调用$message函数提示用户报名成功，若后端抛出异常，则根据异常提示“用户已经报名”，“报名人数已满”等信息。影视资源模块：该页面展示推送的影视资源信息，具体包括电影名称、导演、主演、语言、地区、上映日期、片长、在线观看链接、剧情简介等。封面裁切功能使用图片裁剪工具Cropperjs实现。注册Cropperjs组件后，配置viewMode ,dragMode，aspectRatio，cropBoxResizable等属性，设置裁切框的初始位置、长宽尺寸。在用户点击确定后，调用onUpdatePhoto方法，onUpdatePhoto方法中调用后端上传封面接口并得到后端生成的封面地址，然后将地址拼接到FilmResource类中，并更新页面中的封面图片。个人中心模块：该页面展示用户的个人信息，并提供头像修改、个人资料编辑的功能。在个人信息下方，是各项个人相关的子路由导航栏，包括：我的论坛文章、我的文章回复、我的树洞心声、我的树洞回声、我发起的活动。“我发起的活动”信息中包含活动的审核状态信息。子页面跳转基于vue-router实现，注册一个个人中心路由，然后在该路由下注册各个页面的子路由，再将各个页面组件绑定到路由中，即可实现单页面应用形式的局部模块刷新，各个子页面均在加载时拉取后端数据并渲染。用户个人信息会在登录时存于localStorage中，故个人中心页面加载时，直接从localStorage中获取用户的各项信息并渲染，修改用户信息时，调用后端user模块相关接口进行数据更新。浏览器客户端前端采用Vue.js框架搭配ElementUI框架实现。使用Vuerouter控制页面跳转和页面子导航栏跳转。后台管理系统后端采用基于Vue.js与ElementUI的后台管理系统框架el-admin搭建，各大管理界面均为本人手动完成。涉及文章编辑的功能使用富文本编辑器技术完成，浏览器客户端的富文本编辑器为tiptap，后台管理系统的富文本编辑器则为el-admin框架自带的wangEditor，二者同为富文本编辑器，只是在配置和使用方法上有较大区别，但具体所展现的功能一致，皆是实现富文本化功能。tiptap结合有结合ElementUI的版本，即Element-ui-tiptap，这个版本使得tiptap的整体ui风格更加贴近ElementUI。tiptap作为为Vue.js量身定做的富文本编辑器工具，其配置依然是结合Vue.js的组件机制，只需注册tiptap组件并实例化相关配置对象即可。而wangEditor的配置则更趋向原生JavaScript的配置。图6-2wangEditor配置项6.2系统后端功能设计用户模块：实现登录、注册接口和用户信息获取接口、个人资料编辑接口等、验证码生成接口等。用户登录时验证用户登录信息和验证码十分正确，用户登录成功后将用户数据以Hash数据类型存储于redis数据库，方便获取当前用户信息。验证码生成后也以Sting数据类型存储于redis数据库中。论坛模块：模块下设论坛文章模块、评论模块、子评论模块三个子模块，论坛文章额外提供文章封禁接口以及热榜文章查询接口，论坛热榜文章会在数据库中筛选点赞数最多的十篇文章返回给前端。文章封禁时先根据文章id查询文章是否存在以及文章封禁状态，若文章不存在或已是封禁状态，则抛出相应的异常。点赞是用户较为常用的功能，直接对数据库进行频繁的写操作对数据库的负担极大，也会延长用户响应数据的时间。故在实现点赞功能时，先将点赞对应的文章id和用户id数据缓存于redis中，设置定时任务每小时将缓存数据持久化到对应的数据库表中一次。而用户浏览时，也先尝试从redis中点赞记录，若redis获取不到，再从数据库中获取。图6-3系统论坛模块数据流图（顶层）树洞模块：该模块下设树洞心声、树洞回声两个子模块，分别对于树洞心声的相关业务和树洞回声的相关业务。两个子模块都提供模糊查询接口、发布接口、删除接口接口，以及查询当前登录用户发表的树洞心声文章和收到的树洞心声。图6-4系统树洞模块数据流图（顶层）疾病资料模块：提供疾病资料的模糊查询、发布、删除接口以及资料分类查询接口。疾病资料由后台管理员进行发布。为防止资料文章中图片文件过大而导致的数据响应缓慢问题，将图片文件与文字分开储存。前端所用的富文本编辑器需要插入图片时，调用后端提供的图片上传接口储存图片，然后得到该接口返回的图片显示地址，并将img标签的src属性指向该地址。这样一来，就可以实现文字和图片的异步加载，解决图片文件过大引发的各类问题。图6-5系统疾病资料模块数据流图（顶层）活动模块：提供活动信息的模糊查询、发布、删除接口。实现活动的审核功能接口和报名接口。活动报名时需要先判断活动是否在报名时间、活动报名人数是否已经达到上限以及用户是否已经报名该活动，最后在活动报名表中更新相应字段。为保证活动报名状态的实时更新，使用定时任务框架Quartz建立定时任务，每两秒钟对所有活动信息进行检查，保证对活动的报名状态随报名时间的改变而改变。图6-6定时任务配置代码图6-7系统疾病活动模块数据流图影视资源模块：提供影视资源的模糊查询、发布、删除接口。在上传封面时，前端调用图片上传接口对图片封面图片文件进行储存，并获得封面的展示url地址，在上传影视资源模块时，将该url与其他影视资源信息数据一起传给后端，即数据库中只存储封面文件的图片显示地址，而非图片转化成的base64字符串。图6-8系统影视资源模块数据流图（顶层）使用接口文档swagger生成接口文档，并在每个接口开发完成后输入测试数据测试接口功能是否正常。本系统后端使用Springboot+Mybatis/Mybatis-plus框架搭配其他工具实现，简单的增删改查功能使用Mybatis-plus所提供的注解和接口完成，复杂的多表关联查询则手动创建Mybatis相关Mapper.xml文件编写动态Sql语句实现。7、系统测试7.1测试概述本系统的测试结合白盒测试和黑盒测试，即关注系统功能的完整实现，又关注测试用例设计时在代码分支上的条件覆盖率。在黑盒测试时，设计测试用例的原则着重于测试功能是否达到需求初衷。在整体功能达到要求的情况下，进行丰富的数据写操作，对数据的格式、边界值等进行充分的输入测试。除UI界面上进行模拟用户操作的测试外，还需要对后端接口进行单独测试。本系统使用接口访问工具PostMan进行接口测试工具，在设计测试用例时尽量不与UI界面测试时使用同样的数据。白盒测试部分，主要使用Junit编写每个业务功能的单元测试。在单元测试时，根据每个判断分支的条件，进行条件覆盖、分支覆盖等测试。最终设计的测试用例使得条件覆盖率达到百分之八十以上。7.2可用性测试用户模块测试：测试用户的登录、注册功能，以及个人中心界面的个人资料显示与编辑功能论坛模块测试：测试用户是否能够正常浏览和发表论坛文章以及评论、子评论，管理员能否正常封禁文章。着重测试文章编辑时能否顺利插入图片，且图片正常上传至文件上传接口，并且在浏览文章时显示与编辑时一致。疾病资料模块测试:测试用户能否正常根据分类导航正常浏览各个类型的疾病资料文章，在后台管理系统方面，测试能否获取完整的疾病资料信息，以及能否正常发送疾病资料文章。树洞模块测试：测试用户能否正常浏览和发表树洞心声、能否正常发送回声。着重测试浏览心声文章时是否只有作者能看见用户信息以及相应的回声信息。活动模块测试：测试用户是否能正常浏览和发起活动，且只能看见审核已经通过的活动信息，后台管理系统方面测试能否正常审核活动影视资源模块测试：测试用户能否正常浏览影视资源，后台管理系统能否正常编辑推送影视资源信息7.3安全性测试本系统在安全测试方面重点测试授权、认证功能以及Sql注入攻击。根据权限系统的功能设计，用户必须登录才能访问所有页面，超级管理员也必须在登录后才能访问所有菜单项，而普通管理员只有在超级管理员进行授权后才能拥有菜单项的访问权限。Sql注入攻击测试需要在UI界面测试和接口访问测试中都进行，以保证功能