基于JavaWeb的“大学印迹”网站的设计与实现

夏曦 李洪 贾香恩 谢涵风 杨颖

摘要：时间如白驹过隙，人们都想留住大学中的珍贵记忆。为此，针对大学生，设计并实现一个“大学印迹”的网站。用户可以在网站上书写经历或者心情，网站免费提供个人存储空间来上传珍贵的文档、图片、音频、视频等资料，并且提供分享功能。“大学印迹”网站的实现为大学生的美好时光保存提供了便利的平台。

关键词：“大学印记”网站；Java Web；JSP；MYSQL

中图分类号：TP393 文献标识码：A 文章编号：1009-3044（2018）23-0120-02

Abstract： Time flies， and people want to keep their precious memories of college. For this reason， a "university imprint" website is designed and implemented for college students. Users can write about their experiences or moods on the website. The website provides free personal storage space to upload precious documents， pictures， audio， video and other materials， and provides sharing function. The realization of the "university imprint" website provides a convenient platform for college students to keep their good time.

Key words： "university imprint" website； Java Web； JSP； MYSQL

1 背景

四年时光匆匆流逝，眨眼就过去。待到毕业后回忆时，发现好像什么都不记得了，大学就这样了无痕迹地划过了，非常遗憾！针对这个问题，提出了建设“大学印迹”网站，以保存大学四年珍贵的记忆。通过查找类似已有网站（比如文献[1]和[2]，该网站能提供使用图片的相关功能），结合当前流行的QQ空间、博客、网盘等的使用体验，文中建设的“大学印迹”网站具有记录心情、上传和下载图片、视频、音频、文章等资料的功能，同时也具有分享功能。目标是用网站记录大学生活中的点点滴滴的变化，让大学不再留有遗憾。

2 网站需求分析

通过调研、学生交流和查找文献及相关网站资源[4-6]，确定该网站需要有记录大学四年的点点滴滴，书写文章和心情，并且还能随时查看和修改的已记录的信息；网站基本需要是能上传文件、视频、图片，并且能够随时查找上传的内容和下载相关文件；能够分享记录下来的点滴。“大学印迹”网站的建设目的是开发一个具有开放体系结构的、易扩充的、易维护的、具有良好人机交互界面的个人空间网站，为用户提供方便管理自己个人空间的平台。

3 网站设计

3.1 网站体系结构设计

网站采用MVC（model-view-controller，简称MVC）三层架构的设计模式。模型层用于应用程序對数据库中的数据进行处理。视图层通过前端界面将数据库中的数据显示出来。控制层将前端页面提交的数据传给模型层，进一步与数据库进行交互。模型层返回结果到控制层，控制层处理重定向或转发到相应的页面，视图层将数据呈现。MVC分层设计有利于管理复杂程序，可以让程序人员在一段时间内只关心某个层面，有利于网站的调试与管理。

该网站是基于jdk1.8+mysql5.5+eclipse+Tomcat9环境下实现的。首先，在主机上搭建jdk1.8环境并在环境变量中进行配置，然后安装mysql5.5，选择server模式进行安装，设置字符字符集为UTF-8，设置root用户密码，并下载sqlyog数据库管理软件，与数据库进行相连接。第二步是搭建Tomcat服务器，首先在http：//tomcat.apache.org/网站下载tomcat包，然后解压到C盘根目录下并在环境变量中配置，运行startup打开服务器，并在浏览器中测试服务器。最后部署Tomcat服务器，下载eclipse ，并解压到合适的磁盘中。打开eclipse，将所有的字符集都设置为UTF-8，并集成jdk1.8环境，选择合适的工作目录。然后在eclipse中集成Tomcat服务器，并选择Tomcat服务器中的webapp路径为Delay Path。最后用eclipse启动服务器，并在浏览器中输入：http：//localhost：8080/测试服务器是否正常。网站开发环境搭建成功。

3.2 网站功能模块设计

通过需求分析，“大学印迹”网站的主要功能模块包括：首先是用户的登录和注册模块，当用户登录成功后会自动跳转到网站主页。主页功能主要是呈现不同特色的个人空间，界面保持简洁美观，突出重点。在个人空间中设置大学四年印记模块，该模块按照年级分类，分别记录大学四年的心情和随想。四年的珍藏模块中可分类上传珍贵的图片、文档、音频和视频等，也提供了将上传的资料随时下载的功能。同时，根据个人的需要，网站还提供的分享功能。具体的功能模块图见图1。

3.3 网站数据库设计

数据库中建立了多个表，下面以article和Blog表为例，article表中存储文章，blogid记录这篇文章属于哪个用户sortid表示文章属于哪些类型id是主键，title是文章标题，pubtime是文章发布时间。如表1所示。

Blog表用来存储用户信息username和password分别用来存储用户的账户名和密码id用来唯一标识用户信息是主键。Subject是用户空间主题，email是用户邮箱。如表2所示。

4 “大学印迹”网站的实现

4.1 登录与注册界面

基于Java Web的“大学印迹”网站的登录和注册界面，用户可以通过网站的登录界面输入用户名和密码并输入随机的验证码，进入到个人空间。对于未注册用户，可以通过点击登录界面的注册选项卡进入到注册界面，需要填写用户名和密码，并附加一个邮箱就可以完成注册。登录界面和注册界面如图2和图3所示。

4.2 个人空间主界面

网站主页面是一个网站的门脸，界面的整体设计，板块的分类有创新，才可以让用户接受。主界面主要由用户的拾光台历、四年印迹、四年的珍藏、内容的显示部分组成。拾光台历显示用户名和头像；四年印迹包括“印”心情和“迹”回忆；四年的珍藏由“时光机”功能模块组成，具体是上传和下载功能；用户的书写的文字是内容的显示部分。主界面如图4所示。

4.3 四年的印迹

主页面中点击四年的印迹窗口，四年的印迹中的“印”心情窗口如图5所示，该窗口中可以记录生活中的方方面面，可以分享生活的感悟，学习的收获，对未来的打算，对最爱的Ta想说的话等等。如果以后想查找回忆，就可以点击“印”心情窗口，那时候书写的内容都会在窗口中显示，书写的文章也会保存在数据库以及云端，这样保证的数据的安全性和查找的方便性。

4.4 四年的珍藏

在主界面点击四年的珍藏模块中的“时光机”，進入网盘空间，网站采用apache的开源工具common-fileupload这个文件上传组件（上传文件应该放在外界无法直接访问的目录下，放于WEB-INF目录下）。将Web中的文件资源提供给用户进行下载，首先有一个页面列出上传文件目录下的所有文件，当用户点击文件下载超链接时就进行下载操作，编写一个FileServlet（列出web应用中用户上传的所有文件）。common-fileupload是依赖于common-io这个包的，所有要导入这两个jar包。

进入界面，就可以跟着“时光机”回忆起大学生活的点点滴滴。此外，网站还可以实现上传下载文件、图片、视频等功能，如图7所示。该功能提供足够的私密空间和个性化服务。如果以后需要查找以前上传的文件、图片、视频等珍贵资料，可以通过点击下载界面进入下载窗口，这里保存了上传的所有内容，只要点击下载就可以了。下载界面如图8所示。

5 结束语

基于Java Web开发的“大学印迹”网站更具有针对性，通过部分同学测试使用，学生普遍反映该网站能较好地保存大学四年的点点滴滴；同时还可以上传、下载个人资料。随着网站的使用，根据用户的反馈，下一步会增加个性化界面、增加时间轴等功能。此外，还会进一步增加界面中的版块，并且完善分享功能。

参考文献：

[1] 赵春争. 黑龙江大学照片网站系统的分析与设计[D]. 北京： 北京邮电大学， 2010.

[2] 马静. 基于Web的高校图片管理系统的设计与实现[D]. 西安： 西安工业大学， 2014.

[3] 张志峰. Java Web技术整合应用与项目实践[M]. 北京： 清华大学出版社， 2013.

[4] QQ空间[DB/OL]. https：//user.qzone.qq.com.

[5] 博客[DB/OL]. http：//blog.sina.com.cn/u/1195031270.

[6] 百度网盘[DB/OL]. https：//pan.baidu.com.

【通联编辑：谢媛媛】