基于struts技术的跑步社区前台界面的设计与实现

基于STRUTS技术的跑步社区前台界面的设计与实现摘要随着人们生活水平的提高，越来越多的人们选择上网作为自己娱乐消遣的一种方式，并且随着互联网的发展，计算机的应用也越来越广泛，由于计算机和网络的发展，为了满足经常上网并且热爱运动的人们的需要，并且能够宣传某公司的品牌及其公司形象，开发了以下的基于STRUTS框架的跑步社区。本社区是一个以MYECLIPSE为开发工具，以ORACLE为后台数据库的网络应用软件。针对网络运动爱好者作为主要用户而开发，主要用来对网络运动爱好者的信息进行管理并且提供一个供运动爱好者之间交流的平台。本系统前台采用流行的JSP、AJAXASYNCHRONOUSJAVASCRIPTANDXML和JAVASCRIPT技术实现了丰富客户端及动态生成网页的功能。还采用了目前流行STRUTS和HIBERNATE组合技术实现了对业务逻辑的处理，后台采用ORACLE实现了对用户数据的持久操作。本系统实现了会员信息管理，短信息管理，好友管理，管理员后台管理模块的全部功能。系统可以在应用环境为WINDOWS2000及以上版本及相应LINUX上运行。系统具有界面直观友好、操作简单、功能强、自动化程度高等特点。系统能够同时承受500多的用户上线，满足了用户在网络交流方面的需求。关键词跑步社区；MVC模式；STRUTS框架；JSPARUNNINGCOMMUNITYWEBSITEBASEDONTHESTRUTSFRAMEWORKABSTRACTASPEOPLESLIVINGSTANDARDIMPROVED,MOREANDMOREPEOPLECHOOSETOSURFONTHEINTERNETBYTHEIROWNASAWAYOFENTERTAINMENT,ANDALONGWITHTHEDEVELOPMENTOFTHEINTERNET,COMPUTERAPPLICATIONSAREINCREASINGLYWIDESPREAD,DUETOTHEDEVELOPMENTOFCOMPUTERANDNETWORK,INORDERTOMEETTHENEEDSOFPEOPLEWHOOFTENSURFONTHEINTERNETANDLOVESPORTS,ANDPROMOTEACOMPANYSBRANDANDCORPORATEIMAGEWEDEVELOPEDTHEFOLLOWINGRUNNINGCOMMUNITYWEBSITEBASEDONTHESTRUTSFRAMEWORKTHERUNNINGCOMMUNITYWEBSITEISAWEBAPPLICATIONSOFTWAREWITHDEVELOPMENTTOOLMYECLIPSEANDBACKGROUNDONORACLEDATABASESPORTSENTHUSIASTSASTHEMAINLYUSERS,THEWEBSITEISUSEDFORMANAGINGINFORMATIONOFONLINESPORTSFANSANDPROVIDINGACAMPAIGNPLATFORMFORTHESPORTSLOVERSTOCOMMUNICATETHEPRESENTSYSTEMUSESPOPULARTECHNOLOGYOFJSP,AJAXASYNCHRONOUSJAVASCRIPTANDXMLANDJAVASCRIPT,ANDITCANREALIZETHEFUNCTIONOFRICHCLIENTANDDYNAMICALLYGENERATEDPAGESITALSOUSESTHEMOSTPOPULARSTRUTSANDHIBERNATETECHNOLOGYTOACHIEVETHEMANAGEMENTOFBUSINESSLOGICANDORACLEASTHEBACKGROUNDTODEALWITHALASTINGOPERATIONFORUSERSDATATHESYSTEMCANREALIZEALLTHEFUNCTIONSOFMODULESOFMEMBERINFORMATIONMANAGEMENT,MESSAGEMANAGEMENT,FRIENDMANAGEMENT,MANAGERBACKGROUNDMANAGEMENTTHESYSTEMCANBEAPPLIEDINTHEENVIRONMENTOFWINDOWS2000ANDABOVEANDTHECORRESPONDINGVERSIONOFLINUXTORUNONTHEMANAGEMENTOFSYSTEMHASAFRIENDLYWINDOW,GREATFUNCTIONANDHIGHAUTOMATICDEGREE,WHICHCANBEOPERATEDSIMPLYTHESYSTEMCANBEAR500USERSATONETIME,HASSATISFIEDTHEUSERSDEMANDOFINFORMATIONCOMMUNICATIONKEYWORDSRUNNINGCOMMUNITYMVCMODELSTRUTSFRAMEWORKJSPTECHNOLOGY目录摘要IABSTRACTII1绪论111开发背景112国内外跑步社区发展现状12开发平台、环境及相关技术321开发环境及平台3211MYECLIPSE简介3212ORACLE10G简介322开发语言及相关技术4221JSP语言的简介及其优点4222CSSCASCADINGSTYLESHEETS语言的简介及其优点4223JAVASCRIPT语言的简介及其优点53系统需求分析631可行性研究6311理论可行性分析6312技术可行性分析6313经济可行性分析632性能需求分析7321灵活性7322安全性7323适用性7324完整性733功能需求分析7331用户登录7332会员信息管理7333短信息管理8334好友管理8335后台管理84总体设计941系统模块设计9411总体设计框架9412用户基本信息管理模块设计框架10413短信息管理模块设计框架10414联系人管理模块设计框架11415后台管理模块设计框架1142系统模块关系设计12421ER图12422各实体间的对应关系图1343数据库具体表结构的设计15431存放会员信息15432存放会员个性化信息16433存放会员级别的评判规则16434存放会员获取积分的流水记录17435存放积分动作17436存放短信信息17437存放好友名单18438黑名单18439管理员信息185系统详细设计1951建立目录1952JS子目录20521部分JS编码2053STYLE子目录21531部分CSS编码2254用户登录24541登陆界面24542注册界面24543找回密码界面2555后台管理26551后台查看会员列表界面26552后台查看会员积分动作界面26553后台修改管理员密码界面2756会员管理27561登陆成功界面27562个性空间界面28563查看个人信息界面2957短信息30571发件箱31572收件箱31573查询好友设计32574好友、黑名单列表3358对本社区的说明34581使用本社区的说明346系统测试与维护3561软件测试35611测试介绍35612具体测试35613测试结论3962运行和维护39结论40参考文献41致谢42外文原文43中文翻译501绪论11开发背景近几十年来，计算机技术的发展日新月异，应用领域空前普及，渗透到各行各业，计算机已经成为我们学习和工作的得力助手。目前，计算机的价格十分低廉，性能却有了长足的进步。它已经被应用于许多领域，尤其是在管理领域，它可以简化大量繁琐的工作，提高工作效率，更重要的是能提高保密文件的安全性。随着计算机的发展和普及，它已经成为人们获取信息的一种方便、快捷、有效的手段。现在我国很多管理机构信息的管理水平还停留在纸介质的基础上，这样的机制已经不能适应时代的发展，必然被以计算机为基础的信息管理所取代。跑步社区系统是专门为广大跑步爱好者提供的一个交流的平台，使跑步爱好者不需要进行面对面的交流，只需在网上查看运动爱好者的个人空间，从而了解他人的跑步爱好习惯，如果与自己的爱好相同或相似，就可以加对方为好友，并且能够发送短信息给自己的跑步好友，而且运动爱好者之间可以在运动论坛中交流彼此对运动的看法道出运动爱好者之间的心声，促进跑步爱好者之间的沟通与交流。除此之外本系统管理者还可以通过后台管理对注册的会员信息和积分进行管理。12国内外跑步社区发展现状当前,我国正处于急剧变化的社会转型期,转型带来的社会矛盾凸显、人口流动增强及互联网的迅速崛起,促进了网络论坛、BBS等网络社区的发展。网络社区已成为人们信息发布、观点交流、权益维护、舆论监督的重要平台,在建设和谐社会中的作用渐显。中国社会的急剧转型促使人口流动性加剧,而科技的进步让社会进入互联网时代。以上因素造成传统意义上以地缘为纽带的社区走向网络化,由地域观点出发的“社区”概念也随着时代的前进而改变。有社会学家提出即使人们不住在一个地理区域或相互之间不进行社会交往,社区依然存在。这类社区以网络论坛、BBS、博客、贴吧为代表。它们突破了传统社区的地域性,让生活在不同地理区域的人们能够进行交往。网络社区的出现得益于互联网技术的推动,但让网络社区形成强大社会影响力的,却是其媒体属性和我国的传媒布局。人们越来越热衷于通过网络展现自己的才华，述说自己的爱好，尤其对于跑步爱好者来说，更愿意通过网络来交流自己的跑步经验。这就促使商家来开发这样的跑步社区平台，让更多的人关注运动，让更多的人加入运动行列中。对商家来说，他们可以通过这个平台宣传自己的产品，展现自己的公司形象，更重要的是他们可以通过这个平台及时获取需求，以便对自己的产品做出调整，提高竞争实力。目前国内知名的跑步社区有力为跑步社区、李宁跑步社区等，力求为广大跑步爱好者提供最全面的跑步运动相关的百科知识，最专业的技术指导，最贴近运动的新闻，最快速的赛事资讯。在这些跑步社区当中也可以看到经常有品牌推广活动，在帮助人们交流的同时也宣传了自己的品牌产品。欧洲、美国等发达国家的跑步市场，无论是跑步用品品牌、零售渠道、赛事组织还是相关媒体、评测机构，都已经非常成熟。中国的跑步市场目前还处于萌芽阶段，大量的国际专业跑步品牌尚未进入，本土跑步用品品牌专业度有限，赛事数量少，组织水平与发达国家有较大差距。但近两年时间，国内跑步市场开始呈现出爆发式增长的态势。跑步人群迅速扩大，马拉松、越野跑等赛事活动不断增加，国际知名的专业跑步用品品牌开始关注并尝试进入中国市场，国内的传统户外零售商开始试水专业跑步用品的销售，强势户外品牌开始拓展跑步产品线，这就为国内开发跑步社区提供了更为广阔的市场。我们需要在向发达国家学习的同时提高自身网站的特色，不断打造具有中国特点的跑步社区。2开发平台、环境及相关技术21开发环境及平台211MYECLIPSE简介MYECLIPSE企业级工作平台（MYECLIPSEENTERPRISEWORKBENCH，简称MYECLIPSE）是对ECLIPSEIDE的扩展，利用它我们可以在数据库和JAVAEE的开发、发布以及应用程序服务器的整合方面极大的提高工作效率。它是功能丰富的JAVAEE集成开发环境，包括了完备的编码、调试、测试和发布功能，完整支持HTML,STRUTS,JSP,CSS,JAVASCRIPT,SPRING,SQL,HIBERNATE。运用MYECLIPSE开发工具，该开发工具是ECLIPSE的一个插件。ECLIPSE本身就是一个功能非常强大的开发工具，而MYECLIPSE在功能上与TOMCAT进行了集成，并且能做到自动打包，并将包自动部署到服务器上。这从很大程度上提高了开发的效率，节约了开发的时间。MYECLIPSE提供了对多重平台特性的支持。开发者可以使用他们感觉最舒适、最熟悉的平台，例如WINDOWS、LINUX等。ECLIPSE对每个平台都有其单独的图形工具包，这使得应用程序具有接近本地操作系统的外观和更好的性能。MYECLIPSE为ECLIPSE提供了一个大量私有和开源的JAVA工具的集合，这解决了各种开源工具的不一致和缺点。NITROX是一个繁杂而强大的加速JAVAWEB应用开发的工具，还包含了一个强大且能够编译所有JSP和STRUTSWEB应用的工具APPXRAY。这些工具解析JAVA和XML配置文件。MYECLIPSE的实际价值来自包含的发布包中的大量的工具。如CCS/JS/HTML/XML的编辑器，帮助创建EJB和STRUTS项目的向导并产生项目的所有主要的组件如ACTION/SESSIONBEAN/FORM等。还包含编辑HIBERNATE配置文件和执行SQL语句的工具。212ORACLE10G简介运用ORACLE作为数据库开发工具，ORACLE10G具有强大的数据库支持功能，能够支持现今大多流行的数据库，可以方便的实现与各种数据库的连接,并且ORACLE具有良好的用户操作界面。ORACLE10G可以通过如SQL、HIBERNATE、JDBC等特定技术，方便地存储、检索和处理服务器平台上的关键信息，可以接受多种格式的数据，从而方便了用户在不同系统之间进行数据转换。ORACLE10G数据库关键目标有二1降低管理开销，2提高性能。ORACLE10G的增强有对高可用性的增强、新的FLASHBACK能力、支持回滚更新操作；对安全性的增强，便于管理大量的用户；BI方面的增强,包括改进的SQL能力、分析功能、OLAP、数据挖掘的能力等；对非关系型数据存储的能力得到了改进；XML的能力；对开发能力支持的加强，对生物信息学BIOINFORMATICS的支持。22开发语言及相关技术221JSP语言的简介及其优点JSP（全称JAVASERVERPAGES）是由SUNMICROSYSTEMS公司倡导和许多公司参与共同创建的一种使软件开发者可以响应客户端请求，而动态生成HTML、XML或其他格式文档的WEB网页的技术标准。JSP技术是以JAVA语言作为脚本语言的，JSP网页为整个服务器端的JAVA库单元提供了一个接口来服务于HTTP的应用程序。JSP使JAVA代码和特定的预定义动作可以嵌入到静态页面中。JSP句法增加了被称为JSP动作的XML标签，它们用来调用内建功能。另外，可以创建JSP标签库，然后像使用标准HTML或XML标签一样使用它们。标签库提供了一种和平台无关的扩展服务器性能的方法。1一次编译，多次、多处运行，代码的执行效率高JSP的脚本语言是JAVA语言，因此它具有JAVA语言的一切特性。同时，JSP也支持现在大部分平台。当JSP第一次被请求时，JSP页面转换成SERVLET，然后被编译成CALSS文件，以后（除非页面有改动或WEB服务器被重新启动）再有客户请求该JSP页面时，JSP页面不被重新编译，而是直接执行已编译好的CLASS文件，因此执行效率特别高。2组件的重用性可重用的、跨平台的JAVABEAN和EJB（ENTERPRISEJAVABEANS）组件，为JSP程序的开发提供方便，我们可以将复杂的处理程序（如页面中需要显示的动态内容及对数据库的操作）放到组件中。可以多次使用这些组件，极大的减少了在JSP页面中重写重复的代码。3将内容的生成和显示进行分离使用JSP技术，WEB页面开发人员可以使用HTML或者XML标识来设计和格式化最终页面。使用JSP标识或者脚本来生成页面上的动态内容。生成动态内容的语句一般被封装在JAVABEAN组件、EJB组件或JSP脚本段中。这样，页面的设计人员和页面的编程人员可以同步进行。同时在客户端通过查看源文件，看不到JSP标识的语句，更看不到JAVABEAN和EJB组件，也可以保护源程序的代码。222CSSCASCADINGSTYLESHEETS语言的简介及其优点层叠样式表（英语CASCADINGSTYLESHEETS，简写CSS），又称串样式列表、层次结构式样式表文件，一种用来为结构化文档（如HTML文档或XML应用）添加样式（字体、间距和颜色等）的计算机语言，由W3C定义和维护。目前最新版本是CSS21，为W3C的推荐标准。CSS3现在已被大部分现代浏览器支持，而下一版的CSS4仍在开发过程中。CSS的优势在于1文件的可读性加强。2文件的结构更加灵活。3作者和读者可以自己决定文件的显示。4文件的结构简化了。5在HTML中，一个整个网站或其中一部分网页的显示信息被集中在一个地方，要改变它们很方便。6在HTML中，不同的读者可以有不同的样式，比如有的读者需要字体比较大。7在HTML中，HTML文件本身的范围变小了，它的结构简单了，它不需要包含显示的信息。223JAVASCRIPT语言的简介及其优点JAVASCRIPT，一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JAVASCRIPT引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML网页上使用，用来给HTML网页增加动态功能。然而现在JAVASCRIPT也可被用于网络服务器，如NODEJS。在1995年时，由网景公司的布兰登艾克，在网景导航者浏览器上首次设计实现而成。因为网景公司与升阳公司合作，网景公司管理层次结构希望它外观看起来像JAVA，因此取名为JAVASCRIPT。但实际上它的语法风格与SELF及SCHEME较为接近。为了取得技术优势，微软推出了JSCRIPT，CENVI推出SCRIPTEASE，与JAVASCRIPT同样可在浏览器上运行。为了统一规格，1997年，在ECMA（欧洲计算机制造商协会）的协调下，由NETSCAPE、SUN、微软、BORLAND组成的工作组确定统一标准ECMA262。因为JAVASCRIPT兼容于ECMA标准，因此也称为ECMASCRIPT。JAVASCRIPT的基本特点如下1是一种解释性脚本语言（代码不进行预编译）。2主要用来向HTML页面添加交互行为。3可以直接嵌入HTML页面，但写成单独的JS文件有利于结构和行为的分离。JAVASCRIPT常用来完成以下任务1嵌入动态文本于HTML页面。2对浏览器事件作出响应。3读写HTML元素。4在数据被提交到服务器之前验证数据。5检测访客的浏览器信息。6控制COOKIES，包括创建和修改等。不同于服务器端脚本语言，例如PHP与ASP，JAVASCRIPT主要被作为客户端脚本语言在用户的浏览器上运行，不需要服务器的支持。所以在早期程序员比较青睐于JAVASCRIPT以减少对服务器的负担，而与此同时也带来另一个问题安全性。而随着服务器的强壮，虽然现在的程序员更喜欢运行于服务端的脚本以保证安全，但JAVASCRIPT仍然以其跨平台、容易上手等优势大行其道。同时，有些特殊功能（如AJAX）必须依赖JAVASCRIPT在客户端进行支持。随着引擎如V8和框架如NODEJS的发展，及其事件驱动及异步IO等特性，JAVASCRIPT逐渐被用来编写服务器端程序。归纳起来，网络跑步爱好者社区系统的开发与运行环境如下采用B/S架构；服务器操作系统WINDOWSSERVER；数据库服务器ORACLE10G；WEB服务器TOMCAT；开发工具MYECLIPSE软件开发技术JSP,HTML,JAVASCRIPT,CSS。3系统需求分析31可行性研究311理论可行性分析在近几年里，随着互联网络以及计算机的不断发展和革新，人们已经不再局限于生活中跑步交友，越来越多的人希望通过网络了解更多关于跑步运动的资讯信息，并能通过网络结交更多朋友。随着需求的不断加大，而且目前还没有广为人知的跑步社区，需要我们开发出一个功能完善的网络跑步社区平台。我们力求为广大跑步爱好者提供最全面的跑步运动相关的百科知识、技术指导，新闻与赛事资讯，同时通过线上和线下活动，为跑步爱好者提供一个最真实、最广阔的沟通与交流平台。该系统是网上的一个虚拟平台，能够模拟现实中的交流过程，并且展示个人的风采，满足广大运动爱好者的需求。同时也为商家展示自己的产品，获取用户需求提供了方便。不管对哪个用户群体来说都起到了很好的桥梁作用，一旦推出必将受到商家与个人的追捧。312技术可行性分析运用MYECLIPSE，我们可以在数据库和JAVAEE的开发、发布以及应用程序服务器的整合方面极大的提高工作效率。它是功能丰富的JAVAEE集成开发环境，包括了完备的编码、调试、测试和发布功能，完整支持HTML,STRUTS,JSP,CSS,JAVASCRIPT,SPRING,SQL,HIBERNATE。运用MYECLIPSE开发工具，该开发工具是ECLIPSE的一个插件。ECLIPSE本身就是一个功能非常强大的开发工具，而MYECLIPSE在功能上与TOMCAT进行了集成，并且能做到自动打包，并将包自动部署到服务器上。这从很大程度上提高了开发的效率，节约了开发的时间。313经济可行性分析网上运动社区的创建，降低了商家成本，扩大了客户资源，打破了地域的界限，方便了人们的需要。所以，不论是商家还是客户都是比较喜欢这种方式的。可以判定运动社区还是比较有前景的。可行性分析的目的，就是用最小的代价在尽可能短的时间内确定问题是否能够解决。ORACLE10G具有强大的数据库支持功能，能够支持现今大多流行的数据库，可以方便的实现与各种数据库的连接,并且ORACLE具有良好的用户操作界面。ORACLE10G可以通过如SQL、HIBERNATE、JDBC等特定技术，方便地存储、检索和处理服务器平台上的关键信息，可以接受多种格式的数据，从而方便了用户在不同系统之间进行数据转换。ECLIPSE提供了强大的数据库应用程序开发功能和数据库辅助工具，程序员利用这些工具能够迅速开发出功能强大的数据库应用程序。此系统主要解决跑步爱好者信息管理的一系列问题，如添加、修改、删除、查询等，因为本管理系统有较高的保密性，要求对人员的各种信息妥善管理，方便用户使用，且系统安全、高效、可靠。通过需求阶段对该系统的可行性进行了彻底分析，随着计算机硬件的发展，各项功能日趋完善，使用MYECLIPSE、ORACLE10G开发此系统无论从技术上、经济上、硬件上和操作上都是可行的。32性能需求分析321灵活性对用户的变化和需求具有一定的灵活性，能按照用户的需求和正常的操作流程、思维方式来设计社区平台操作方式；能在某些特殊情况下，对系统进行修改和升级；在设计时，能充分考虑用户的需求，尽可能提供简单清晰的操作页面，能为客户提供尽可能多的选择性。322安全性网络平台交友最重要的就是安全性。首先，在登录网站前，要对用户信息的真实性进行识别；其次，在登录网站过程中要保证用户信息必须保持一致，防止数据被修改破坏，防止信息遭到不必要的泄漏；最后，必须建立有效的责任制度以避免一些不必要的麻烦和损失。323适用性首先是方便清晰的用户界面；然后是网站新闻以及用户操作的信息提示；最后能满足短信息添加和删除等基本的业务需要。324完整性一个跑步社区除了以上的这些要求外，最重要的还是功能的齐全，例如个人信息的查询、修改，好友的查询、添加、删除，短信息的发送与接收以及一个可靠和完善的后台管理员管理系统。33功能需求分析结合“基于STRUTS的跑步社区”的用户信息，切实了解他们对整个系统期望具有的功能，分析他们的信息特点，与其共同决定系统具有以下功能用户登录、会员信息管理、短信息管理、好友管理、后台管理。要求系统的界面能够简洁明了，并且具有美观实用的特点。将功能性与实用性结合在一起，通过对用户的普遍调查，设计出符合用户使用习惯的前台界面。331用户登录已经注册的用户可以直接登录，通过验证用户名和密码后就可以进入主页面；没注册的用户直接点击网站上的注册按钮进行注册，填写真实信息，网站会对这些信息进行审核，如果没有填写或者填写不当，然后会给出相应的提示信息。注册成功后返回登陆界面；在登录过程中，如果忘记了密码，那么可以通过网站的找回密码功能，只需回答几个问题，就能将密码找回。该前台界面要求简洁清晰，功能明确。332会员信息管理用户登录后可以查看自己的信息也可以修改自己的基本信息，并可以创建或修改自己的个性空间。该前台界面要求能够尽可能考虑到用户的需求，尽可能完善用户个人信息，将信息完整的体现在页面内容中，个性空间前台界面要求能够依据用户个性需求，上传头像等，要求页面美观具有特点，简洁清晰，易于用户操作，并能保证用户数据及时返回给后台。333短信息管理用户可以给自己的好友发短信或回复好友的来信，并可以查看自己的发件箱或收件箱，以查看发送给好友或收到好友的短信。该前台界面要求能够直接反映出用户信箱中的收发信状态，并且通过页面之间的切换完成收发信以及对信息的删改。334好友管理包括好友速配，好友名单，黑名单三个子模块。在好友速配时可以随机速配一个好友,也可以根据条件查询好友；在好友名单中，可以把好友移动到黑名单；在黑名单中，可以彻底删除好友，也把黑名单中的好友移动到好友名单中。该前台界面要求能够清楚的显示出搜寻好友的功能以及增加删除好友的功能，通过与数据库的连接完成该功能，要求功能明确，操作简单明显。335后台管理只有管理员可以有权限进入后台，可以查看所有注册会员的信息并删改会员，可以查看所有会员的积分动作，可以修改管理员自己的登录后台的密码。该前台界面要求能够通过导航来切换页面，分别实现查看会员信息、查看会员积分动作和修改管理员后台密码的功能，操作易懂，界面美观。4总体设计41系统模块设计411总体设计框架在前面的系统规划与需求分析的基础上，对该系统进行了总体设计，不仅能满足用户修改个人的基本信息，能够创建和修改自己的个性空间，使更多的跑步爱好者了解自己，能够随机查找一个好友或根据条件查找到多个好友，而且还能够给自己的好友发送短信息，交流各自的跑步心得。总体设计框架如图41所示图41功能模块结构图412用户基本信息管理模块设计框架首先要实现它的基本功能，如用户的注册，登陆，密码的找回，信息的修改等。而这些是需要用户来完成的，也就是说可以定义在用户管理的模块中。为了更好的展示用户的的个人特征，也就是我们平时说的个性化，我们可以加上一个个人空间的管理。于是我们可以定义出用户管理信息的用例图如图42所示管理用户信息注册信息用户检测自动登录基本信息管理找回丢失密码个性空间管理用户登录查看基本信息修改基本信息创建个性空间修改个性空间图42用户基本信息管理用例图413短信息管理模块设计框架用户间的交流系统提供一个收发信息的功能，它包括短信息的创建，对已收信息和已发信息的删除和查看等功能。其用例图如图43所示短信管理新建短信管理已发信息管理已收信息查看已发信息删除已发信息查看已收信息回复已收信息删除已收信息图43短信息管理用例图414联系人管理模块设计框架联系人管理模块主要实现对好友和黑名单的管理，而且要能通过各项条件匹配到符合条件的好友。用例图如图44所示联系人管理好友管理黑名单管理好友速配查看黑名单黑名单加好友随机速配按条件匹配增加好友查看好友删除好友好友移至黑名单删除黑名单图44联系人管理用例图415后台管理模块设计框架为了更好的维护这个系统，我们设计了管理员后台管理模块。主要实现对会员的管理、对积分动作的管理和对管理员自己密码的管理。其用例图如图45所示后台管理会员管理积分动作管理管理员管理查看积分动作修改密码查看好友查看会员信息好友移至黑名单修改积分动作图45后台管理用例图根据系统功能模块结构图和管理流程，以及跑步社区系统的需要总结出如下的数据字典。1系统用户数据包含的数据项有系统用户名，密码，性别，年龄，邮箱，省份，地址，密码提示问题，密码提示答案等。2用户个人空间数据包含的数据项有跑步主张，跑步时间，跑步地点，跑步习惯，电话，上传的图片等。3短信息数据包含的数据项有发送者，接收者，发送时间，标题，内容等。4好友名单数据包含的数据项有自己的名字，好友的名字。5黑名单数据包含的数据项有自己的名字，黑名单的名字。6管理员数据包括管理员的名字，管理员的密码，以及对管理员的描述。7省份数据包括省份的代码，省份的名称，省份的ID值。8积分等级数据最小积分，最大积分，等级名称，对应头像。9积分动作数据积分动作名称，可获积分，动作描述。10积分记录数据用户名称，获得时间等。42系统模块关系设计421ER图在需求分析之后，数据库设计的第一步就是对系统的概念结构进行设计，设计的目标是产生反映整个系统信息需求的整体数据库的概念结构，描述概念结构的工具就是ER图。各实体详细信息的概念描述是第一步工作，各实体属性关系如图46至49所示用户性别电子邮箱购物账户个人空间等级编号所在省份地址推荐人积分电话密码提示答案用户名密码年龄注销状态在线状态上次登录时间密码提示问题注册时间图46用户属性关系图用户主题内容编号发送人接收人发送时间图47短信息属性关系图得分纪录得分描述编号得分时间得分图48得分记录属性关系图个人空间运动习惯编号运动站点用户形象联系方式运动主张运动时间所属用户喜欢的明星图49个人空间属性关系图422各实体间的对应关系图在确认了实体具体信息后，下一步是确认各实体之间的对应关系图，各实体之间的对应关系如图410所示图410各实体间关系图各数据表之间的对应关系，特别是主外键对应关系对数据库的持久化操作有直接影响，涉及到数据表之间的级联操作，虽然在数据表中已经对各表之间的主外键关系进行了描述，但由于表较多，不便于总体了解他们之间的对应关系，对所有表之间的主外键关系如图411所示图411表之间的主外键关系关系图43数据库具体表结构的设计在确定了各实体详细信息后，下一步就是各实体在数据库中的具体实现，依据ER图中实体的具体信息，共设计了9张数据表，各表的字段信息，约束信息和描述如下431存放会员信息表41MEMBERINFO字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号NICKNAMEVARCHAR220NOTNULL用户昵称PASSWORDVARCHAR250NOTNULLMD5加密口令，页面上限制为16字节GENDERVARCHAR21NOTNULL性别，男或女表41（续）字段名字段类型约束或索引描述AGENUMBERNOTNULL年龄EMAILVARCHAR2100NOTNULL电子邮件PASSWORDQUESTIONVARCHAR2200密码提示问题PASSWORDANSWERVARCHAR2200密码提示问题答案PROVINCECITYVARCHAR220所在省市ADDRESSVARCHAR2200地址PHONEVARCHAR250联系电话POINTNUMBERDEFAULT0当前积分RECOMMENDERVARCHAR220推荐人REGISTERDATEDATE注册时间LATESTDATEDATE上次上线时间STATUSNUMBERDEFAULT00正常1注销ISONLINENUMBERDEFAULT00下线1在线GRADEIDNUMBER等级ID外键432存放会员个性化信息表42MEMBERSPACE字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号SPORTPLACEVARCHAR220运动地点SPORTTIMEVARCHAR220运动时间SPROTHABITVARCHAR220运动习惯SPROTSTARVARCHAR220喜欢的运动明星CELLPHONEVARCHAR220正在使用的手机OPINIONVARCHAR2200个人对运动的看法ICONVARCHAR250个人空间头像图片存在的路径MEMBERIDNUMBER会员IDREFERENCEMEMBERINFO433存放会员级别的评判规则表43GRADERECORD字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号表43（续）字段名字段类型约束或索引描述MINPOINTNUMBERNOTNULL积分的上限MAXPOINTNUMBERNOTNULL积分的下限GRADENAMEVARCHAR220NOTNULL级别名称ICONPATHVARCHAR250NOTNULL每个级别分别对应不同的头像434存放会员获取积分的流水记录表44POINTRECORD字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号NICKNAMEVARCHAR220NOTNULL获取积分的会员RECEIVEDATEDATENOTNULL获得积分的日期POINTACTIONIDNUMBERNOTNULL所获积分435存放积分动作表45POINTACTION字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号ACTIONNAMEVARCHAR220标示积分操作名称，比如”REGISTER”表示会员注册。POINTNUMBERNOTNULL可获积分DESCRIPTIONVARCHAR200描述436存放短信信息表46MESSAGERECORD字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号SENDERVARCHAR220NOTNULL发件人登录名RECEIVERVARCHAR220NOTNULL收件人登录名SENDDATEDATEDEFAULT当前时间,NOTNULL发送日期TITLEVARCHAR2NOTNULL短信标题表46（续）字段名字段类型约束或索引描述CONTENTVARCHAR2300NOTNULL短信内容，页面上最多300字STATUSNUMBERDEFAULT00未阅读1已阅读SENDERSTATUSNUMBERDEFAULT00表示未删除1表示已删除（发送者）RECEIVERSTATUSNUMBERDEFAULT00表示未删除1表示已删除（接收者）437存放好友名单表47FRIENDLIST字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号SELFNAMEVARCHAR220NOTNULL会员登录名FRIENDNAMEVARCHAR220NOTNULL好友登录名438黑名单表48BLACKLIST字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号SELFNAMEVARCHAR220NOTNULL会员登录名BLACKNAMEVARCHAR220NOTNULL被加入黑名单者登录名439管理员信息表49MANAGERINFO字段名字段类型约束或索引描述IDNUMBERSEQUENCEPK记录流水号NICKNAMEVARCHAR220NOTNULL管理员登录名PASSWORDVARCHAR220NOTNULL管理员密码5系统详细设计跑步社区平台主要包括前台界面设计和后台管理两个部分，我负责的是前台界面的设计与实现，主要运用到JSP、CSS、JS等技术，完成各个功能模块的界面设计，并为后台提供相应的接口。51建立目录整个目录的框架结构如图51所示图51跑步社区前台界面目录框架根据需求分析建立程序目录，然后在相应的文件夹中设计实现各个模块的JSP页面，本社区大部分界面使用JSP技术，同时引入CSS和JS完成相应的设计和功能等。系统目录如图52所示图52程序目录52JS子目录JS代码就是JAVASCRIPT编写的脚本文件的代码。用单独文件保存，扩展名为JS。JS子目录中主要包括了一些独立的函数代码，分别实现一些具体的功能，在其他文件中也可以直接引用，如图53图53JS目录521部分JS编码COMMONJS中代码该函数的作用是判断用户注册页面中输入框的内容是否选中FUNCTIONISCHECKEDNAMEVARTEMPDOCUMENTGETELEMENTSBYNAMENAMEFORI0I53STYLE子目录STYLE子目录中包括的是网页样式设计的一些CSS代码文件。相对于传统HTML的表现而言，CSS能够对网页中的对象的位置排版进行像素级的精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力，并能够进行初步交互设计，是目前基于文本展示最优秀的表现设计语言。CSS能够根据不同使用者的理解能力，简化或者优化写法，针对各类人群，有较强的易读性。图54STYLE目录531部分CSS编码STYLECSS中代码对于页面整体正文字体、表格样式的设置TABLEFONTSIZE14PXCURSORCURSORHANDTABHEADCOLORWHITEPADDING13PX0018PXFONTWEIGHTBOLDMSGINFOCOLOR000FONTFAMILYARIAL,HELVETICA,SANSSERIFFONTBLUECOLOR00336CFONTREDCOLOREC2500FONTGRAYCOLOR666FONTGREENCOLORGREENFONTORANGECOLORFF7800对超文本链接带下划线、黑色样式的设置ATEXTLINK01LINKFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR043671TEXTDECORATIONNONEATEXTLINK01VISITEDFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR043671TEXTDECORATIONNONEATEXTLINK01HOVERFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR043671TEXTDECORATIONUNDERLINEATEXTLINK01ACTIVEFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR043671TEXTDECORATIONUNDERLINE对超文本链接带下划线样式的设置ATEXTLINK02LINKFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR0000FFTEXTDECORATIONUNDERLINEATEXTLINK02VISITEDFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR0000FFTEXTDECORATIONUNDERLINEATEXTLINK02HOVERFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLORE64100TEXTDECORATIONUNDERLINEATEXTLINK02ACTIVEFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLORE64100TEXTDECORATIONUNDERLINE对于超链接文本的黑色样式设置ATEXTLINK03LINKFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR0000FFTEXTDECORATIONNONEATEXTLINK03VISITEDFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLOR0000FFTEXTDECORATIONNONEATEXTLINK03HOVERFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLORE64100TEXTDECORATIONUNDERLINEATEXTLINK03ACTIVEFONTFAMILYARIAL,HELVETICA,SANSSERIF,“宋体“COLORE64100TEXTDECORATIONUNDERLINE通过在用户登录页面LOGINJSP的HTML代码中引入STYLECSS文件，能直接控制该界面的颜色、字体、排版等显示特性，将文件的内容与显示分隔开来，增强可读性。在用户登陆界面LOGINJSP中引入CSS部分代码LOGINJSP中的引入代码“跑步社区54用户登录541登陆界面该功能通过LOGINJSP实现。该页面主要对用户的登陆名和密码进行验证，如果用户名和密码都正确，则进入用户的主界面；如果是新用户，则先进行注册，然后进入登陆界面；如果是已经注册的用户忘记了密码，则进入找会密码的界面，根据密码提示问题和密码提示答案找回密码，最后进入登陆界面重新进行登陆。用户登录界面如图55所示图55用户登录界面LOGINJSP542注册界面注册页面REGISTERJSP通过LOGINJSP页面的“注册”功能链接打开，提示新用户填写用户名、密码等个人信息，完成新用户的注册，最后进入登陆界面进行登陆。用户注册界面如图56所示图56用户注册界面REGISTERJSP543找回密码界面找回密码页面PASSWD_MISSINGJSP通过LOGINJSP页面的“忘记密码”功能链接打开，如果是已经注册的用户忘记了密码，则进入找回密码的界面，根据密码提示问题和密码提示答案找回密码，最后进入登陆界面重新进行登陆。找回密码界面如图57所示图57找回密码界面PASSWD_MISSINGJSP55后台管理功能进入后台管理页面，可以对会员信息、会员积分动作进行管理以及修改管理员密码等操作。后台管理部分主要使用了FRAME框架结构，分为FRAME_A和FRAME_B两部分，FRAME_A是导航栏，FRAME_B为跳转的相应页面。文件夹目录如图58所示图58后台管理文件夹目录MANAGERFILE551后台查看会员列表界面后台查看会员列表页面MEMBERINFOJSP可实现查看所有会员的信息，包括昵称、性别、邮箱、注册日期、上次登陆时间、用户积分以及删除用户的操作，如图59所示图59后台查看会员信息列表界面MEMBERINFOJSP552后台查看会员积分动作界面后台查看所有会员积分动作页面POINTINFOJSP可实现查看所有用户获得积分的时间和相应的积分动作。如图510所示图510会员积分动作界面POINTINFOJSP553后台修改管理员密码界面后台修改管理员密码界面ALTERPWDJSP可用于修改管理员的密码，如图511所示图511管理员修改密码界面ALTERPWDJSP56会员管理561登陆成功界面用户通过LOGINJSP页面对用户名和密码验证成功后，成功跳转到登陆成功页面ACTIVITYJSP，界面如图512所示图512运动社区首页ACTIVITYJSP562个性空间界面包括页面NOSPACEJSP、CREATESPACEJSP、SPACEJSP功能用户在创建自己的个性空间以后对空间的信息进行更新。用户可以修改自己的个性空间照片、跑步时间、习惯等。创建个性空间页面CREATESPACEJSP如图513所示图513创建个性空间界面CREATESPACEJSP创建完成页面SPACEJSP如图514所示图514创建完成个人空间的界面SPACEJSP563查看个人信息界面包括页面BASICINFOJSP、MODIFYJSP用于查看用户自己的个人信息，以及对个人信息的修改。个人信息页面BASICINFOJS如图515所示图515查看个人信息界面BASICINFOJS修改个人信息页面MODIFYJSP如图516所示图516修改个人信息界面MODIFYJSP57短信息该文件夹主要包括会员的收发件箱、写邮件、匹配添加好友、黑名单列表、好友列表等JSP页面。完成会员的信息模块的功能。包括BLACKLISTJSP、BOXJSP、BUDDYLISTJSP、INBOXJSP、MATCHFRIENDJSP、MEMBERLISTJSP、OUTBOXJSP、SENDINFOJSP、VIEW