基于jsp的个人博客系统设计与实现毕业论文

《基于jsp的个人博客系统设计与实现毕业论文》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

基于JSP的个人博客系统设计与实现毕业论文目录摘要IIIAbstract.IV1引言11.1系统开发的背景11.2开发的目的和意义11.3开发环境及工具和技术的选用21.3.1开发环境21.3.2开发工具及技术介绍22系统分析52.1任务概述52.2功能需求分析52.2.1前台52.2.2后台62.3性能需求分析62.4系统数据需求72.4.1系统的数据需求72.4.2系统的数据字典83系统概要设计93.1系统体系结构93.2主要功能设计93.2.1主要功能模块93.2.2系统流程图104数据库设计124.1数据库概念设计124.2数据库逻辑结构设计154.2.1数据库详细设计154.2.2数据表关系设计185系统详细设计195.1登陆和注册界面设计195.2前台页面设计215.2.1前台首页概述215.2.2前台首页技术分析225.2.3前台首页的面局235.3后台界面设计245.3.1后台首页概述245.3.2后台首页技术分析255.3.3后台首页的布局255.4系统重难点代码分析255.4.1系统配置255.4.2分类显示文章信息27I 5.4.3相册上传的实现296系统测试326.1测试方法326.2测试内容336.2.1登录测试336.2.2发表文章测试347结论与展望37致谢38参考文献39I 基于JSP的个人博客系统计算机科学与技术(职教师资)李姜伟指导教师陈梁摘要：博客，是一种互联网平台上的个人信息交流中心。看上去平淡无奇，毫无可炫耀之处，但它可以让每个人零成本、零维护地创建自己的网络媒体，每个人都可以随时把自己的思想火花和灵感更新到博客站点上。本系统页面采用Html语言和Css样式以及JavaScript脚本来设计，系统的相关功能由Java语句来实现，使用Sql2000数据库作为后台，采用Jsp+Servlet+JavaBean模式来完成系统的相关功能。主要分为游客和博主两种角色。游客可以注册、查看日志、照片、博主的资料和发表评论。博主则完成写日志、修改日志、上传照片、管理照片、更改个人信息、添加公告、退出系统等功能。关键词：博客；个人博客；JSP；Sql2000III PersonalblogsystembasedonJSPComputerScienceandTechnologyVocationalEducationfacultyUndergraduateClassoneAuthor:LiJiangweiSupervisor:ChenLiangAbstract:BlogisakindofInternetplatformofinformationexchangecenter.Lookboring,areinnowaytoshowoff,butitallowseveryonetozerocost,zeromaintenancetocreateyourownnetworkmedia,everyonecanupdatetheirideassparkandinspirationtotheblogsite.ThesystempageusingHtmlandCss,andJavaScriptscriptdesign,systemrelatedfunctionisimplementedbyJavastatements,usingSql2000databaseasthebackground,usingtheJsp+Servlet+JavaBeanmodeltocompletetherelatedfunctionsofthesystem.Mainlydividedintotworolestouristsandblogger.Visitorscanregisterandviewtheloginformation,photos,bloggerandcomment.Bloggersarewritinglog,modifylogs,uploadphotos,photo,changethepersonalinformationmanagement,addannouncements,exitsystems,etc.Keywords：Blog；Personalblog；JSP；Sql2000；III 1引言1.1系统开发的背景信息时代的今天，网络已经成为人们工作、学习的一部分，不断充实和改变着人们的生活。在网络中，构建一个个性化的个人博客，可以充分地表达自己的思想，通过发表文章展示个人才能，抒发个人情感。网友则可以根据主题发表个人意见，表达自己的想法，与博主进行思想交流，乐在其中。博客之所以以用户的欢迎，首先在于它具有无与伦比的“越分享越多”的魅力精髓。对于博文本人，对于阅读博客的人；对于自己，对于他人，对于社会；对于工作，对于生活，“越分享越多”的博客精髓注定了博客的发展势不可挡。博客可以美化一个人的生活！而所谓的新媒体革命，所谓的人际交往和知识传播的革命，都是第二层次的。通过分享，美化每一个博客，美化每一个人的生活，自然美化整个社会。分享可以是沟通，可以是人际关系，可以是文章，可以是音乐和声音，可以是图片和视频，可以是阅读和推荐……“博客网，让你随心所欲”，这个随心所欲主要就是在超越时空的虚拟世界中，可以随心所欲地分享你愿意分享的一切。1.2开发的目的和意义目的：许多博客专注在特定的课题上提供评论或新闻，其他则被作为比较个人的日记。一个典型的博客结合了文字、图像、其他博客或网站的链接、及其它与主题相关的媒体。能够让读者以互动的方式留下意见，是许多博客的重要要素。大部分的博客内容以文字为主，仍有一些博客专注在艺术、摄影、视频、音乐、播客等各种主题。博客的功能主要有以下四点：（1）个人自由表达和出版，用户可以自由发表文章，但是是有前提的，例如谣言、色情等不合法的内容是不允许发表的；（2）知识过滤和积累，用户可以将自己生活、工作中的一些心得记录下来与他人分享；（3）深度交流沟通，博客可以促进交流可以与他人交流自己记录下的一些心得或者国内外新闻等，但是用户应该以辩证的方式去评论；（4）博客营销。作用还有很多，总之博客在现如今这个飞速发展的网络时代已经成为人们不可或缺的一部分。所以我选择了这个课题作为我的毕业设计。39 意义：在网络技术逐渐渗入社会生活各个层面的今天，传统的交流方式也面临着变革，而网络博客则是一个很重要的方向。博客是以网络为载体，简易迅速便捷地发布自己的心得，及时有效轻松地与他人分享，再集丰富多彩的个性化展示于一体的统合性平台。基于Web技术的博客系统可以借助于遍布全球的Internet进行，因此交流既可以是本地进行，也可以是异地进行，大大拓展了沟通与交流的灵活性。记录个人生活点滴：如同日记一般，可将自己每日生活中发生的事情记录下来，并且跟朋友或网友们分享。1.3开发环境及工具和技术的选用1.3.1开发环境（1）硬件平台CPU：AMD3200+1.81GHz内存：2G显示器：18.5英寸LCD（2）软件平台操作系统：WindowsXP数据库：SQLServer2000开发工具：MacromediaDreamweave,MyEclipse,开发语言：Java语言服务器：Tomcat浏览器：IE6.0分辨率：1366*7681.3.2开发工具及技术介绍（1）JSP技术JSP（全称JavaServerPages）是由SunMicrosystems公司倡导和许多公司参与共同创建的一种使软件开发者可以响应客户端请求，而动态生成HTML、XML或其他格式文档的Web网页的技术标准。JSP技术是以Java语言作为脚本语言的，JSP网页为整个服务器端的Java库单元提供了一个接口来服务于HTTP的应用程序。当客户端请求一个JSP网页时，JSPEngine会检查所请求的JSP网页是否已经处于被载入执行的状态，如果没有，它会先读取JSP程序文件，将它换成Servlet程序代码编译载入，然后才执行请求的服务。也是就说，只有当客户端第一次请求JSP网页时，才需要被转换、编译和载入，做到了一次执行，处处执行。JSP的ServletClass是JSPEngine自动帮我们编译产生的，不像Servlet需要手动编译，另外，在JSP程序中建立新的对象和JavaBean非常方便容易。（2）JSP的基础——Servlet技术Java39 Servlet是JSP技术的基础，JSP本身就是预先被编译成Servlet，然后再运行的，而且大型的Web应用程序的开发需要JavaServlet和JSP配合才能完成，Servlet这个名称大概源于Applet，现在国内的翻译方式很多，本文为了避免误会，本文直接采用Servlet这个名称而不做任何翻译，读者如果愿意，可以称之为“小服务程序”。Servlet是使用JavaServlet应用程序设计接口及相关类和方法的Java程序。它在Web服务器上或应用服务器上运行并扩展了该服务器的能力。JavaServlet对于Web服务器就好像JavaApplet对于Web浏览器。Applet装入Web浏览器并在Web浏览器内执行，而Servlet则是装入Web服务器并在Web服务器内执行。JavaServletAPI定义了Servlet和服务器之间的一个标准接口，这使得Servlet具有跨服务器平台的特性。Servlet通过创建一个框架扩展服务器的能力，采用请求-响应模式提供Web服务。当客户机发送请求至服务器时，服务器将请求信息发送给Servlet，Servlet生成响应内容并将其传给Server，然后再由Server将响应返回给客户端。（3）JavaBeanJavaBean是一种JAVA语言写成的可重用组件。为写成JavaBean，类必须是具体的和公共的，并且具有无参数的构造器。JavaBean通过提供符合一致性设计模式的公共方法将内部域暴露成员属性。众所周知，属性名称符合这种模式，其他Java类可以通过自身机制发现和操作这些JavaBean属性。（4）开发平台：MyEclipse+dreamweaverMyEclipse是一个十分优秀的用于开发Java,J2EE的Eclipse插件集合，MyEclipse的功能非常强大，支持也十分广泛，尤其是对各种开源产品的支持十分不错。MyEclipse目前支持JavaServlet,AJAX,JSP,JSF,Struts,Spring,Hibernate,EJB3,JDBC数据库链接工具等多项功能。可以说MyEclipse几乎囊括了目前所有主流开源产品的专属eclipse开发工具。Dreamweaver是美国Macromedia公司开发的集网页制作和网站管理于一身的所见即所得式网页编辑器，是针对专业网页设计师而设计的视觉化网页开发工具，它可以让设计师轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。Dreamweaver与Flash、Fireworks一度被称为网页三剑客。[6]（5）数据库：SQLServer2000SQLServer2000作为Microsoft家庭的重要成员，是基于客户机/服务器的大型关系数据库系统。SQL　Server2000这种关系型数据库系统能够满足各种类型的企业客户和独立软件供应商构建商业应用程序的需求，根据客户的反映和需求，是大规模联机事务处理（OLTP）、数据仓库和电子商务应用程序的优秀数据库平台。SQLServer2000具有以下特点：1．强大可伸缩性；39 2．支持大型Web站点或企业信息处理系统；3．客户机/服务器体系结构；而数据源包含了数据库位置和数据库类型等信息，实际上是一种数据连接的抽象。各部件之间的关系如图1.1所示：应用程序ODBC管理器ODBCAPIsql驱动程序管理器数据源名（DSN）ODBC驱动程序数据源ODBC层数据层应用层图1.1数据关系图（6）Tomcat服务器Tomcat服务器是一个免费的开放源代码的Web应用服务器。它是Apache基金会的Jakarta项目中的一个核心项目，由Apache，Sun和其它一些公司及个人共同开发而成。39 2系统分析2.1任务概述博客网站系统的总目标是：在计算机网络，数据库和先进的开发平台上，利用现有的软件，配置一定的硬件，开发一个具有开放体系结构的、易扩充的、易维护的、具有良好人机交互界面的个人博客网站，为网络用户提供进行在线交流的网络平台。通过个人博客网站可以结交更多的朋友，表达更多的想法，它随时可以发布文章。具体的要求如下：（1）博主可以简单的添加和删除文章；（2）独立于具体的数据库平台。对于与数据库交互的部分充分考虑兼容性；（3）容易在原先基础上进行二次开发；（4）中间基础平台的无型性。尽量采用开放的标准技术，达到跨平台运行的效果；为了达到以上的开发目的，个人博客网站应遵循一定的设计和开发与原则；（5）模块接口定义清晰；（6）基础类库和接口设计合理，尽量建立叮扩展的接口和抽象类；（7）数据库操作使用标准SQL语句，如果一定要使用有差别的SQL语句，则尽量集中在一起，以减少将来维护和移植的难度；（8）采用开放的标准和工具等。2.2功能需求分析博客系统通常提供三类服务:（1）信息服务，它可分为：文章显示，热点文章推荐，博主风采；（2）查询服务：可以根据文章内容，文章标题，留言内容，留言标题等进行模糊查询；本系统采用Browser/Server结构，将个人博客网站划分为两个子系统：前台，后台。下面分析各个子系统的功能需求。2.2.1前台在前台的功能实现上，可以分为以下几个部分：（1）用户登录：网站用户用个人注册的帐号和密码登录到博客系统。系统检测用户的帐号和密码是否错误和判断用户是博主还是普通用户并给予其相应的权限对系统进行操作。（2）用户注册：39 由于只有注册用户才能进入系统，所以游客必须先注册，将个人的信息存储到博客网站的数据库中，以成为本博客的正式用户。（3）用户修改个人信息：在一个单独的页面显示注册用户的信息，用户可以修改个人的基本信息。（4）文章查询和评论：用户可以浏览博客中的文章同时评论感兴趣的文章，也可以查看其他评论。（5）公告信息查询：用户可以浏览博客网站中发布的公告信息，了解博客的一些情况。（6）相片查询：用户可以浏览博主上传的相片。2.2.2后台系统后台只有博主才能进入，博主可以对博客系统中的数据信息进行更新，主要有以下模块。（1）文章管理：管理员对网站中已有的文章进行删除，更新等操作。（2）公告管理：发布，删除，更改公告。（3）投票管理：发起投票，统计投票等。（4）个人相册管理：对博客相册中的图片进行删除，更新等操作。（5）用户设置：更新普通用户对博客的操作的权限。（6）博主设置：对博主的信息等进行操作。2.3性能需求分析博客网站系统需要具备以下几个主要特性：（1）多样性:博客网站在设计时必须遵循的一个重要原则，就是以用户为系统设计的中心。网络的发展大大降低了信息咨询的成本，用户面临更多的选择，所以，博客网站除了降低成本以外，还必须在皮肤，功能的多样性上下工夫，才能够得到用户的认可。具体来说，应用系统应能实现用户特定的需求，操作界面友好、方便，功能设置符合用户的习惯和要求。39 （2）易维护:管理员能够简单方便地管理系统，定义新的应用，并对系统进行日常维护;随着博客网站信息的变更或增加、数据规模的增大，系统升级、维护应易于操作;各子系统、功能模块的设计应具有良好的灵活性，保证在博客网站系统建设过程中后期系统功能的实现不影响前期已投入使用的系统功能。（3）安全性:系统应充分考虑信息、设备、运行和管理的安全性，建立完善的多层次的安全保障体系，保证用户的个人信息等资料的数据安全。（4）可扩展:博客网站的用户从事着各种行业，他们的需求各不相同，系统在设计时应充分考虑到用户需求不断变化的需要，降低系统在扩展新的业务功能时的复杂度。2.4系统数据需求2.4.1系统的数据需求（1）数据录入和处理的准确性和实时性数据的输入是否准确是数据处理的前提，错误的输入会导致系统输出的不正确和不可用，从而使系统的工作失去意义。数据的输入来源是用户的手工输入。手工输入要通过系统界面上的安排系统具有容错性，并且对用户操作进行实时的跟踪和错误提示。在系统中，数据的输入往往是大量的，因此系统要有一定的处理能力，以保证迅速的处理数据。（2）数据的一致性与完整性由于网站的数据是共享的，所以如何保证这些数据的一致性，是网站必须解决的问题。要解决这一问题，要有一定的人员维护数据的一致性，在数据录入处控制数据的去向，并且要求对数据库的数据完整性进行严格的约束。对于输入的数据，要为其定义完整性规则，如果不能符合完整性约束，网站应该拒绝该数据。（3）数据的共享与独立性整个博客网站的数据是共享的。然而，从网站开发的角度上看，共享会给设计和调试带来困。因此，应该提供灵活的配置，使各个分系统能够独立运行，而通过人工干预的手段进行系统数据的交换。这样，也能提供系统的强壮性。39 2.4.2系统的数据字典网站中的数据元素：名字：用户信息描述：用户的个人信息，用于对用户的确认和更新。定义：用户信息=帐号+密码+姓名+性别+工作单位+QQ号码+邮箱号码位置：输入到用户浏览器（前台）名字：管理员信息描述：管理员的个人信息，用于对管理员的确认和更新。定义：管理员信息=帐号+密码位置：输入到管理员浏览器（后台）名字：评论信息描述：对已有文章进行评论。定义：评论信息=评论题目+评论内容+评论日期位置：输入到用户浏览器（前台）名字：朋友圈信息描述：用户的个人信息，用于对用户的确认和更新。定义：朋友信息=姓名+QQ号码+说明位置：输入到用户浏览器（前台）名字：文章类型信息描述：用于对文章进行分类。定义：用户信息=类型名称+分类说明位置：输入到用户浏览器（前台）名字：用户信息描述：用户的个人信息，用于对用户的确认和更新。定义：用户信息=帐号+密码+姓名+性别+工作单位+QQ号码+邮箱号码位置：输入到用户浏览器（前台）名字：照片信息描述：用户上传的照片，图片等。定义：照片信息=照片位置+照片说明+日期位置：输入到用户浏览器（前台）名字：投票信息描述：博主添加的投票信息与每一项的票数。定义：投票信息=投票分类+投票数量位置：输入到用户浏览器（前台）39 3系统设计博客网站系统的总目标是：在计算机网络，数据库和先进的开发平台上，利用现有的软件，配置一定的硬件，开发一个具有开放体系结构的、易扩充的、易维护的、具有良好人机交互界面的博客网站，以达到个人推荐、展现自我的一个平台，为交流提供综合的网络环境，同时也为个人的宣传，发展，提供了一个平台。3.1系统体系结构基于B/S结构的个人博客网站系统，应由终端（用户主机/浏览器）、WEB服务器、数据服务器构成。个人博客网站的核心是中间的接入服务器和应用服务器部分。个人博客网站的总体结构图如图3.1所示：WEB服务器(webServer)数据用服务器PC图3.1博客网站总体结构3.2主要功能设计3.2.1主要功能模块博客网站分为前台和后台。其中，根据博客前台的特点，可以将其分为博主信息、网络日历、文章查询、公告查询及相册查询等13个部分，其中各个部分及其包括的具体功能模块如图3.2所示。39 查看博主信息查看网站说明网络日历邮箱联系朋友查询友情链接相册查询用户投票文章查询文章详细查询公告详细查询公告查询文章留言博客网前台图3.2博客系统前台功能结构根据博客网后台的特点，可以将其分为用户设置、公告管理、个人相册管理、博客文章管理、投票管理、朋友信息管理及博主信息修改7部分，其中各个部分及其包括的具体功能模块如图3.3如示。博客网后台公告管理个人相册管理博客文章管理朋友信息管理投票管理用户设置公告添加公告设置相册添加相册设置发表博客文章博客文章设置文章分类设置内容添加投票内容设置朋友信息添加朋友信息设置博主信息修改图3.3博客网站后台功能结构3.2.2系统流程图为了更加清晰地表达系统的业务功能模块，下面给出博客网的系统流程图。对于不同的角色，其所承担的任务也各自不同，流程图也不一样，包括面向用户的客户端流程图和面向系统管理员的流程图，如图3.4和图3.5所示。39 用户注册开始用户登录用户登录判断博客网站首页投票结果查看朋友查看邮件联系博客说明查看相册查看投票文章分类文章查看文章详细查看文章回复公告信息详细查看公告信息查看博主信息查看图3.4面向用户（前台）的客户端流程图用户登录用户登录判断（是否为系统管理员）博客网后台页面博客网前台页面博客文章管理公告管理个人相册管理投票管理朋友信息管理博主个人信息修改用户管理开始图3.5面向系统管理员（后台）的流程图39 4数据库设计一个设计良好的数据库，可以使系统的实现变得非常的简单。同时，也可以使系统的执行速度变得很快。反之，一个设计混乱的数据库，不仅增加了吸引的管理实现过程，同时在系统的执行过程中，使得检索变得很慢，降低效率。所以数据库的设计是一个系统设计很重要的步骤。数据库的设计通常是以一个已经存在的数据库管理系统为基础的，常用的数据库管理系统有Access、SQLServer、Oracle、MySQL等。根据用户需求和系统分析，本系统采用SQLServer2000数据库管理系统。在SQLServer2000数据库管理系统中建立名称为博客的数据库。4.1数据库概念设计根据以上对系统所做的需求分析和系统设计，规划出本系统中使用的数据库实体分别为用户信息实体、公告信息实体、个人相册信息实体、朋友信息实体、投票信息实体、博客文章信息实体及文章回复实体。系统各实体关系E-R图如图4.1所示。注册用户博主朋友投票文章公告文章类型照片文章评论添加阅读发表上传查看发表从属管理发表阅读参与参与查看查看图4.1实体关系E-R图39 下面介绍各实体的E-R图。（1）用户信息实体用户信息实体包括用户名、密码、姓名、性别、QQ号码、主页、兴趣、E-mail地址、管理级别属性。用户信息实体的E-R图如图4.2所示：用户信息用户名管理级别QQ号码性别兴趣密码主页E-mail地址姓名图4.2用户信息实体属性E-R图（2）博客文章信息实体博客文章信息实体包括文章题目、文章内容、文章发布时间及文章访问次数属性。博客文章信息实体的E-R图如图4.3所示：文章信息文章题目文章内容文章访问次数文章发布时间图4.3博客文章信息实体属性E-R图（3）文章类型信息实体文章类型信息实体包括类型名和类型描述属性。文章类型信息实体的E-R图如图4.4所示：39 文章类型信息类型名类型描述图4.4文章类型信息实体属性E-R图（4）公告信息实体公告信息实体包括公告标题、公告内容和公告时间属性。公告信息实体的E-R图如图4.5所示：公告信息公告标题公告内容公告属性图4.5公告信息实体属性E-R图（5）朋友信息实体朋友信息实体包括朋友名、朋友QQ号码和朋友描述属性。朋友信息实体的E-R图如图4.6所示：朋友信息朋友名朋友描述朋友QQ号码图4.6朋友信息实体属性E-R图（6）照片信息实体照片信息实体包括照片路径、照片描述和照片上传时间属性。照片信息实体的E-R图如图4.7所示：39 照片信息照片路径上传时间照片描述图4.7照片信息实体属性E-R图（7）文章评论信息实体文章评论信息实体包括文章ID号、回复号、回复主题和回复内容属性。文章评论信息实体的E-R图如图4.8所示：文章评论信息文章ID回复主题回复内容回复号图4.8文章评论信息实体属性E-R图（8）投票信息实体投票信息实体包括投票信息名称和票数属性。投票信息实体的E-R图如图4.9所示：投票属性投票信息名票数图4.9投票信息实体属性E-R图4.2数据库逻辑结构设计4.2.1数据库详细设计本系统包含8个数据库。39 tb_consumer（用户信息表），主要用来保存用户基本信息。表结构如表4.1所示：表4.1表tb_consumer的结构字段名称数据类型字段长度是否为空idint4Noaccountvarchar10Yespasswordvarchar10Yesnamevarchar50YessexChar5YesQQNumberInt4YesmainPagevarchar50Yesinterestvarchar50YeseMailvarchar50YesmanageLevelvarchar10Yestb_article（文章信息表），主要用来保存文章信息。表结构如表4.2所示。表4.2表tb_article的结构字段名称数据类型字段长度是否为空idint4NotypeIDint4Notitlevarchar30Yescontentvarchar2000YesphTimevarchar30Yesnumberint4Yestb_articleType（文章类型信息表），用来保存文章类型名和文章类型描述。表结构如表4.3所示。表4.3表tb_articleType的结构字段名称数据类型字段长度是否为空idint4NotypeNamevarchar50Yesdescriptionvarchar50Yestb_discuss（公告信息表），用来保存博主发表的公告信息。表结构如表4.4所示。表4.4表tb_discuss的结构字段名称数据类型字段长度是否为空iddiscussTitleintNodiscussTitlevarchar30Yes39 disscussContentvarchar1000YesdiscussTimevarchar50Yestb_friend（朋友信息表），主要用来保存博主的朋友的基本信息。表结构如表4.5所示。表4.5表tb_friend的结构字段名称数据类型字段长度是否为空idint4Nonamevarchar20YesQQNumbervarchar20Yesdescriptionvarchar50Yestb_photo（照片信息表），用来保存博主上传的照片的基本信息。表结构如表4.6所示。表4.6表tb_photo的结构字段名称数据类型字段长度是否为空idint4NophotoAddressvarchar50YesphotoDescriptionvarchar50YesphotoTimevarchar30Yestb_restore（文章评论信息表），用来保存访客对博文发表的文章评论的基本信息。表结构如表4.7所示。表4.7表tb_restore的结构字段名称数据类型字段长度是否为空idint4NoarticleIdint4YesreAccountvarchar50YesreTitlevarchar50YesreContentntext16Yestb_vote（投票信息表），用来保存投票项的名称和票数。表结构如表4.8所示。表4.8表tb_vote的结构字段名称数据类型字段长度是否为空idint4NovoteNamevarchar20YesvoteNumberint4Yes39 4.2.2数据表关系设计数据库表之间的关系设计，如图4.9所示。图4.9数据表之间的关系39 5系统详细设计整个系统设计主要分为用户登陆和注册模块设计、前台设计和后台设计。用户通过注册访问博客系统的前台首页，前台首页提供博主信息、博主发表的日志、系统说明、公告、相册、网络日历等展示。后台管理系统只有管理才能访问，主要是对博客文章、博客公告、投票内容、个人相册和博主朋友信息等进行管理。由于本系统是个人博客系统，通过注册模块注册的用户都是游客身份而非管理员身份，如果想要设置多个管理员，就需要到数据表里面手动添加管理员帐户。5.1登陆和注册界面设计（1）用户登录模块具有用户登录功能。博客网运行的第一个页面便是用户登录页面，用户登录后，可以查看博主所发表的文章。在用户登录页面中，在“用户名”和“密码”文本框中输入用户名和密码后，单击“登录”按钮，系统验证成功后，用户将以会员的身份进入博客网首页，之后在网站中可以随意查看博主发布的文章。如果登录的用户就是博主本人，在博主信息显示区域中，则出现“进入后台”超链接，博主可以直接单击此超链接，进入博客网的后台进行管理。用户登录模块的框架如图5.1所示，用户登录界面如图5.2所示。开始用户登录是否通过验证显示“进入后台”超链接及其他相关信息不显示“进入后台”超链接及其他相关信息图5.1用户登录模块的框架图39 图5.2登录界面（2）用户注册模块实现新用户注册功能。用户注册的时候对用户输入的信息进行有效性验证，包括基本数据格式的有效性，以及逻辑有效性，例如：给出提示、QQ号码必须为数字、E-mail地址的正确格式等。用户注册成功后，以游客的身份自动登录到博客网前台首页面，由于是游客身份，所以在首页面上不显示“进入后台”超链接，即只能访问博客。用户注册模块的框架如图5.3所示，用户注册界面如图5.4所示。开始用户注册验证用户输入数据的有效性以游客身份自动登录博客系统，不显示“进入后台”超链接和其他相关信息图5.3用户注册模块的框架图39 图5.4用户注册界面5.2前台页面设计5.2.1前台首页概述在博客网的前台首页设计中，首先将管理员发布的最新文章展现给用户，然后提供文章的分类、显示博客的信息、显示最新公告及博客网导航区功能等功能。博客网前台首页的运行结果如图5.5所示。39 图5.5博客系统前台首页的运行结果5.2.2前台首页技术分析39 在如图5.5所示首页中的显示博主的基本信息、显示登录用户信息、显示博客的主要功能、显示博主的朋友圈及版权信息等功能，并不是仅存在于首页中，其他功能模块的子页面也需要包括这些部分。因此，可以将这几个部分分别保存在单独的文件中，这样在需要放置相应功能时只需包含这些文件即可，如图5.6所示。head_top.jsphead_right.jsphead_Consumer.jsphead_main.jsphead_down.jsp图5.6前台首页的布局在JSP页面中包含文件有两种方法：一种是应用<%@include%>指令实现，另一种是应用动作元素实现。本系统使用的是动作元素，该动作元素用于向当前页面中包含其他的文件，这个文件可以是动态文件也可以是静态文件。5.2.3前台首页的面局应用动作元素包含文件的方法进行前台首页布局的部分代码如下：<%@pagecontentType="text/html;charset=gb2312"language="java"import="java.sql.*"errorPage=""%>//应用动作元素包含head_top.jsp文件，该文件用于显示博主的基本信息。//应用动作元素包含head_right.jsp文件，该文件用于显示博客的主要功能。……//应用动作元素包含head_Consumer.jsp文件，该文件用于显示登录用户信息（如果登录用户为博主，则不显示用户信息） 39 ……//应用动作元素包含head_down.jsp文件，该文件用于显示版权信息及博主的朋友圈。5.3后台界面设计5.3.1后台首页概述在博客网的后台首页设计中，首先将管理员常用的功能显示在网页的操作区域中，然后将后台的主要功能显示在网站的左侧区域。博客网后台首页的运行如图5.7所示。图5.7博客网后台首页的运行效果39 5.3.2后台首页技术分析如图5.7所示的后台首页中的显示后台页面旗帜、左侧功能区及版权信息等功能，并不是仅存在于首页中，其他功能模块的了页面中也需要包括这些部分。因此可以将这几个部分分别保存在单独的文件中，这样在需要放置相应功能时只需包含这些文件即可，如图5.8所示。back_top.jspback_left.jspbackMainPage.jspback_down.jsp图5.8后台首页的布局5.3.3后台首页的布局应用动作元素包含文件的方法进行后台首页布局的代码如下：<%@pagecontentType="text/html;charset=gb2312"language="java"import="java.sql.*"errorPage=""%>//应用动作元素包含back_Top.jsp文件，该文件用于显示网站的旗帜。//应用动作元素包含back_Left.jsp文件，该文件用于显示后台全部功能。……//应用动作元素包含back_Down.jsp文件，该文件用于显示网站的版权信息。5.4系统重难点代码分析5.4.1系统配置39 本网站是采用Servlet和JavaBean结合技术开发的。JavaBean技术实现对数据库的操作不需要在XML文件中进行任何的配置，而正常运行Servlet程序还需要进行适当的配置，配置文件为web.xml。关键代码如下：ThisisthedescriptionofmyJ2EEcomponentThisisthedisplaynameofmyJ2EEcomponentConsumerServletcom.wy.webiter.ConsumerServletThisisthedescriptionofmyJ2EEcomponentThisisthedisplaynameofmyJ2EEcomponentFriendServletcom.wy.webiter.FriendServlet…-->ConsumerServlet/ConsumerServletFriendServlet/FriendServlet39 …-->index.jsp5.4.2分类显示文章信息当用户登录后，在博客网的首页左侧操作区中单击“文章”超链接，网页会自动弹出一个URL，即head_ArticleList.jsp，将分类显示文章的信息，如图5.9所示。图5.9前台分类显示文章信息39 在该页面中，首先通过JavaBean定义分类操作的类（MyPagination），之后调用ArticleDao类中的queryArticle()方法查询所有的文章信息，最后将查询的结果显示在页面中。分类显示文章信息的关键代码如下：<%IntegertypeId=null;//设置文章类型ID对象if(request.getParameter("typeId")!=null){typeId=Integer.valueOf(request.getParameter("typeId"));//如果获取的文章类型ID对象不为null，则赋值}Stringstr=(String)request.getParameter("Page");//获取当前页码intPage=1;//初始化Page对象ListarticleList=null;//设置List集合对象if(str==null){articleList=articleDao.queryArticle(typeId);//根据文章类型ID去查询所有文章信息intpagesize=5;//指定每页显示的记录数articleList=pagination.getInitPage(articleList,Page,pagesize);//初始化分页信息}else{Page=pagination.getPage(str);//将获取的当前页码数进行赋值articleList=pagination.getAppointPage(Page);//获取指定页的数据}%>for(intarticleI=0;articleI150){//当文章内容的文字控制在100个字符以内articleContent=articleContent.substring(0,150)+"......";}%><%=articleForm.getTitle()%><%=articleContent%>"class="head-02">阅读全文>>