个人博客网站的设计与实现

个人博客网站的设计与实现

0911070419 宋雨

第一章引言

博客，又译为网络日志、部落格或部落阁等，是一种通常由个人管理、不定期张贴新的文章的网站。博客上的文章通常根据张贴时间，以倒序方式由新到旧排列。许多博客专注在特定的课题上提供评论或新闻，其他则被作为比较个人的日记。一个典型的博客结合了文字、图像、其他博客或网站的链接、及其它与主题相关的媒体。能够让读者以互动的方式留下意见，是许多博客的重要要素。大部分的博客内容以文字为主，仍有一些博客专注在艺术、摄影、视频、音乐、播客等各种主题。博客是社会媒体网络的一部分。

博客秉承了个人网站的自由精神，但是综合了激发创造的新模式，使其更具开放和建设性。它作为一种新表达的方式，它的传播不仅情绪，包括大量的智慧、意见和思想。某种意义上说，它也是一种新的文化现象，博客的出现和繁荣，真正凸现网络的知识价值，标志着互联网发展开始步入更高的阶段。

第二章系统分析

博客网站系统的总目标是：在计算机网络，数据库和先进的开发平台上，利用现有的软件，配置一定的硬件，开发一个具有开放体系结构的、易扩充的、易维护的、具有良好人机交互界面的个人博客网站，为网络用户提供进行在线交流的网络平台。

通过个人博客网站可以结交更多的朋友，表达更多的想法，它随时可以发布文章。

具体的要求如下：

1).博主可以简单的添加和删除文章；

2).独立于具体的数据库平台。对于与数据库交互的部分充分考虑兼容性；

3).容易在原先基础上进行二次开发；

4).中间基础平台的无型性。尽量采用开放的标准技术，达到跨平台运行的效果；

为了达到以上的开发目的，个人博客网站应遵循一定的设计和开发与原则：

1).模块接口定义清晰；

2).基础类库和接口设计合理，尽量建立叮扩展的接口和抽象类；

3).数据库操作使用标准SQL语句，如果一定要使用有差别的SQL语句，则尽量集中在

一起，以减少将来维护和移植的难度；

4).采用开放的标准和工具等；

第三章总体设计

3.1项目规划

博客系统通常提供三类服务:

1).信息服务，它可分为：博文显示，评论显示，分类显示

2).留言服务：游客可以对博文发表看法意见

3).管理服务：博主可以对自己的博客进行各种管理

在此，我参考现有的几大博客网站如QQ空间，新浪博客等，采用Browser/Server结构，将个人博客网站划分为两个子系统：前台，后台。

下面分析各个子系统的功能需求。

3.1.1 前台

在前台的功能实现上，可以分为以下几个部分：

1).博文主页：

游客可以浏览博客的首页，首页包括博文的摘要及分类。

2).博文浏览：

游客可以浏览博客中感兴趣的博文。。

3).博文评论：

游客可以在浏览博文的同时进行对博文的评论。

3.1.2后台

通过计算机网络将前台与后台的数据库相连，网站管理员将从前台得到的信息进行处理，实现文章管理，公告管理，投票管理，个人相册管理，朋友圈，用户设置及博主设置等子系统。

1).博主登陆：

博客主人用帐号，密码登录到网站。网站检测用户的帐号，密码并给予管理员权限对网站进行操作

2).博文发布：

发布博文，包括博文标题，内容及分类。

3).博文管理：

对博客中的文章进行删除，更新等操作。

4).添加分类：

对博文的分类进行添加，包括分类名称及显示级别。

5).分类管理：

对博客中的分类进行删除，更新等操作。

6).评论管理：

对博客中的评论进行删除，更新等操作。

7).修改密码：

修改博主账号的密码。

3.2系统功能结构图

前台:

后台:

第四章系统设计

4.1设计目标

1. 博客文章显示管理

本模块用于帮助用户快速定位到自己关注的博客页面及对应的文章信息中。

2. 博客登录管理

本模块实现用户登录功能。登录时会对博客输入的信息进行提示，如用户名、密码错误。

3. 发表文章管理

该模块实现了博主发表新文章的功能。博主发表文章时，可以选择文章所属类别，此外只有是博主才能发表文章，对此进行了严格的身份验证。

4. 发表及显示评论管理

该模块实现了与文章相关的评论管理。游客及管理员都可对文章进行发表评论。

4.2开发及运行环境

4.2.1 JSP的基础——Servlet 技术

Java Servlet是JSP技术的基础，JSP本身就是预先被编译成Servlet，然后再运行的，而且大型的Web应用程序的开发需要Java Servlet和JSP配合才能完成，Servlet这个名称大概源于Applet，现在国内的翻译方式很多，本文为了避免误会，本文直接采用Servlet 这个名称而不做任何翻译，读者如果愿意，可以称之为“小服务程序”。Servlet其实和传统的CGI程序和ISAPI、NSAPI等Web程序开发工具的作用是相同的，在使用Java Servlet 以后，用户不必再使用效率低下的CGI方式，也不必使用只能在某个固定Web服务器平台运行的API方式来动态生成Web页面。许多Web服务器都支持Servlet，即使不直接支持Servlet 的Web服务器也可以通过附加的应用服务器和模块来支持Servlet。得益于Java的跨平台的特性，Servlet也是平台无关的，实际上，只要符合Java Servlet规范，Servlet是完全平台无关且是Web服务器无关的。由于Java Servlet内部是以线程方式提供服务，不必对于每个请求都启动一个进程，并且利用多线程机制可以同时为多个请求服务，因此Java Servlet效率非常高。但Java Servlet也不是没有缺点，和传统的CGI、ISAPI、NSAPI方式相同，Java Servlet是利用输出HTML语句来实现动态网页的，如果用Java Servlet来开发整个网站，动态部分和静态页面的整合过程简直就是一场噩梦。这就是为什么SUN还要推出Java Server Pages的原因。

4.2.2 JavaBean原理和机制

JSP的一大特点就是与JavaBeans的结合,而JSP与JavaBeans结合的一个突出的优点是页面显示和业务逻辑的分离。这可以使团队协作的更好，开发出更高质量的站点。

JavaBean是一种可以重用的Java组件，它类似于COM，在JSP程序中常用来封装事物逻辑、数据库操作等，可以很好的实现业务逻辑和前台程序的分离，使得系统具有更好的健壮性和灵活性。

事件处理是JavaBeans体系结构的核心之一。通过事件处理机智，可以让一些组件作为事件源，发出可被描述环境或其他组件接受的事件。这样，不同的组件就可在构造工具内组合在一起，组件之间通过事件的传递进行通信，构成一个应用。从概念上讲，事件是一种在“源对象”和“监听对象”之间、某种状态发生变化的传递机智。事件有许多不同的用途，如：鼠标事件、窗口边界改变事件、键盘事件等。在Java和JavaBeans中则是定义了一个一般的、可扩充的事件机制，它能够：

1).对事件类型和传递模型的定义和扩充提供一个公共框架，并适合于广泛的应用。

2).与Java语言和环境有较高的集成度。

事件能描述环境捕获和被激发。能使其他构造工具采取某种技术在设计时直接控制事件，遗迹控制事件源和事件监听者之间的联系。事件本身不依赖于复杂的开发工具。

特别的，事件机制还应当：

1).能够发现制定的对象类可以生成的事件。

2).能够发现制定的对象类可以观察监听到的事件。

3).提供一个常规的注册机制，允许动态操纵事件源与事件监听者之间的关系。

4).不需要其他的虚拟机和语言即可实现。

5).事件源与监听者之间可进行高效的事件传递。

6).能完成JavaBean事件模型与相关的其他组件体系结构事件模型的中立映射。

JSP和https://www.360docs.net/doc/904557463.html,同样是网站开发中常用的开发工具。但是，ASP是微软的产品，其应用只能是在Windows平台上，移植性差，而且以源代码的形式存放在服务器端，安全性差。每次由服务器解释运行，运行效率不高。Jsp页面文件执行时被编译成字节代码，由客户端流览的Java虚拟机解释执行，不再是源代码，因此执行效率和安全性高。将数据库连接的重要信息存放在JavaBean文件后，可以编译成虚拟机才能解释的字节代码，确保了数据库的安全。

在ASP技术里，通过Web页面要实现一些特定的功能比较困难，比如基于网页的报表，打印实现起来就比较麻烦。ASP提供的解决方案是自己开发组件，通过在服务器端注册组件，成为独立的可以重复利用的模块供读者调用。因此要求读者需要掌握比较复杂的变成语言的开发技术。在JSP开发技术里，可以通过开发JavaBean文件实现同样的功能，JavaBean不需要注册，只要放置在相应的目录下就可以运行。可以实现ASP的COM组件同样的功能。此外JSP推出主要就是考虑到平台的无关性。JSP代码可以在APACHE、IIS等服务器上执行，支持大部分操作系统。JSP继承JAVA技术的优点：一次运行，处处运行。

鉴于此,本系统决定使用JSP做为开发工具。下面简单介绍一下相关的其他工具：

4.2.3 开发平台：Eclipse+dreamweaver

Eclipse是一个开放源代码的软件开发项目，专注于为高度集成的工具开发提供一个全功能的、具有商业品质的工业平台。它主要由Eclipse项目、Eclipse工具项目和Eclipse 技术项目三个项目组成，具体包括四个部分组成——Eclipse Platform、JDT、CDT和PDE.JDT 支持Java开发、CDT支持C开发、PDE用来支持插件开发，Eclipse Platform则是一个开放的可扩展IDE，提供了一个通用的开发平台。它提供建造块和构造并运行集成软件开发工具的基础。Eclipse Platform允许工具建造者独立开发与他人工具无缝集成的工具从而无须分辨一个工具功能在哪里结束，而另一个工具功能在哪里开始。

Dreamweaver MX 是一款专业的 HTML 编辑器，用于对 Web 站点、Web 页和 Web 应用程序进行设计、编码和开发。无论您喜欢直接编写 HTML 代码的驾驭感还是偏爱在可视化编辑环境中工作，Dreamweaver 都会为您提供帮助良多的工具，丰富您的 Web 创作体验。

利用 Dreamweaver 中的可视化编辑功能，您可以快速地创建页面而无需编写任何代码。不过，如果您更喜欢用手工直接编码，Dreamweaver 还包括许多与编码相关的工具和功能。并且，借助 Dreamweaver，您还可以使用服务器语言（例如 ASP、https://www.360docs.net/doc/904557463.html,、ColdFusion 标记语言（CFML）、JSP 和 PHP）生成支持动态数据库的 Web 应用程序。

4.2.4 数据库：MySQL

MySQL是一个小型关系型数据库管理系统，开发者为瑞典MySQL AB公司。在2008年1月16号被Sun公司收购。而2009年,SUN又被Oracal收购.对于Mysql 的前途,没有任何人抱乐观的态度.目前MySQL被广泛地应用在Internet上的中小型网站中。由于其体积小、速度快、总体拥有成本低，尤其是开放源码这一特点，许多中小型网站为了降低网站总体拥有成本而选择了MySQL作为网站数据库。

4.3数据库设计

根据系统功能设计要求和模块划分，本站的数据库主要有Blog表，Category表，Comment 表和Users表

1 Blog表

保存所有博文的内容。包括博文id、主题、内容、时间和所属类别的id值。

2 Category表

保存所有博文的分类，id、分类的名称。

3 Comment表

保存对博文的评论，id，评论人、评论的内容，所评论的博文的id值。

Users表

保存博主的id、用户名和密码。

第五章程序介绍

1：博客主页，游客可浏览近期的博客摘要及分类查询

主要代码如下：

main.jsp:

<%@page language="java"contentType="text/html; charset=UTF-8"%>

<%@page import="java.util.List"%>

<%@page import="java.text.SimpleDateFormat"%>

<%@page import="https://www.360docs.net/doc/904557463.html,.jobedu.blog.*"%>

"https://www.360docs.net/doc/904557463.html,/TR/xhtml1/DTD/xhtml1-transitional.dtd">

宋雨的blog

管理博客

<%List list=(List)request.getAttribute("blogs");

for(int i=0;i

Blog blog=(Blog)list.get(i);

SimpleDateFormat sdf=new SimpleDateFormat("yyyy年MM月dd日");

String date=sdf.format(blog.getCreatedTime());

sdf=new SimpleDateFormat("HH:mm:ss");

String time=sdf.format(blog.getCreatedTime());

%>

<%=date%>

href="/blog/servlet/HomeServlet?method=get&id=<%=blog.getId()%>" target="_blank"><%=blog.getTitle()%>

<%

String source=blog.getContent();

int length=200;

if(source.length()<200){

length=source.length();

}

String newString=source.substring(0,length);

out.print(newString+"......");

%>

<%=time %>

href="<%=request.getContextPath()%>/servlet/HomeServlet?cid=<%=blog.g etCategoryId()%>"><%=blog.getCategory()%>| 评论

<%} %>

  1/2  >>

分类

• 全部

<% List categorys=(List)request.getAttribute("categorys");

for(int i=0;i

Category category=(Category)categorys.get(i);

%>

• href="<%=request.getContextPath()%>/servlet/HomeServlet?cid=<%=catego ry.getId()%>"><%=category.getName()%>

<%} %>

最近的主题

<%List recentBlogs=(List)request.getAttribute("blogs");

for(int i=0;i

Blog blog=(Blog)recentBlogs.get(i);

%>

• href="<%=request.getContextPath()%>/servlet/HomeServlet?method=get&id =<%=blog.getId()%>" target="_blank"><%=blog.getTitle()%>

<%}%>

最近的评论

<% List comments=(List)request.getAttribute("comments");

for(int i=0;i

Comment c=(Comment)comments.get(i);

%>

• href="<%=request.getContextPath()%>/servlet/HomeServlet?method=get&id =<%=c.getBlogId()%>" target="_blank"><%=c.getContent()%>

<%} %>

2：在主页点击博文名称连接后，可浏览相应博文，查看其评论及发表评论

主要代码如下：

displayBlog.jsp:

<%@ page language ="java" contentType ="text/html; charset=UTF-8"%> <%@ page import ="java.util.List" %>

<%@ page import ="java.text.SimpleDateFormat" %>

<%@ page import ="https://www.360docs.net/doc/904557463.html,.jobedu.blog.*"%>

宋雨的blog

<% Blog blog=(Blog)request.getAttribute("blog");

List list=(List)request.getAttribute("commentList");

%>

<%=blog.getTitle()%>

<%=blog.getContent()%>

<%=blog.getCreatedTime()%>

<% if(list!=null){ for(int i=0;i Comment comment=(Comment)list.get(i); %> <%=comment.getUsername()%>的评论 <%=comment.getContent()%> <%=comment.getCreatedTime()%> <%} } %>

method="post"> 评论人： 内容： <p>id="content">

分类

• 全部

<% List categorys=(List)request.getAttribute("categorys");

for(int i=0;i

Category category=(Category)categorys.get(i);

%>

• href="<%=request.getContextPath()%>/servlet/HomeServlet?cid=<%=catego ry.getId()%>"><%=category.getName()%>

<%} %>

最近的主题

<%List recentBlogs=(List)request.getAttribute("blogs");

for(int i=0;i

Blog blog2=(Blog)recentBlogs.get(i);

%>

• href="<%=request.getContextPath()%>/servlet/HomeServlet?method=get&id =<%=blog2.getId()%>" target="_blank"><%=blog2.getTitle()%>

<%}%>

最近的评论

<% List comments=(List)request.getAttribute("comments");

for(int i=0;i

Comment c=(Comment)comments.get(i);

%>

• href="<%=request.getContextPath()%>/servlet/HomeServlet?method=get&id =<%=c.getBlogId()%>" target="_blank"><%=c.getContent()%>

<%} %>

3：在主页点击分类，可分别显示不同分类文章

4：点击主页管理博客，进入博主登陆页面

5：登陆成功后进入博客管理页面

6：点击发博文，填写相应内容后即可发表

7：点击管理博文，可对博文进行修改，删除操作

8：点击添加分类，填写分类名称及显示顺序后可增加一分类

9：点击分类管理后，可对分类进行修改及删除操作