个人博客网站课程设计说明书.docx
- 文档编号:3940770
- 上传时间:2022-11-26
- 格式:DOCX
- 页数:16
- 大小:719.20KB
个人博客网站课程设计说明书.docx
《个人博客网站课程设计说明书.docx》由会员分享,可在线阅读,更多相关《个人博客网站课程设计说明书.docx(16页珍藏版)》请在冰豆网上搜索。
个人博客网站课程设计说明书
1课题描述
本次课题是要完成一个集日志发表、后台管理为一体的个人博客管理系统。
在前台游客可以查看相册、博文、等并可在留言板中添加评论。
后台管理可以实现的功能有:
博文的添加、修改和删除;照片的添加、删除以及分类;查询删除留言等。
界面直观、操作简单,内容布局条理清楚,版面协调、统一,能够实现方便快捷的管理与维护。
开发工具:
Dreamweavercs5、SQLserver2008
2设计过程
该博客网站包括前台浏览和后台管理两部分功能。
实现过程包括三部分:
前台功能设计,后台设计,数据库设计。
2.1需求分析
本系统的用户包括:
普通游客、博客主人。
(1)普通游客进入网站后可以浏览博客文章和博客相册,并在浏览博客后进行评论。
(2)博客主人通过前台登录后,可对自己的博客空间进行管理,包括发布自己的网络日志,
收藏个人照片,相关人员进行交流和沟通以及删除访问者发表的评论等。
(3)在博客管理界面,博主可以对自己的博客类型进行管理。
包括:
添加、编辑和删除博客类型。
(4)博主可以暂时不发布博客,而是将文章先放到草稿箱等以后要发布时,再从草稿箱中提出,还能够将回收站中的博客还原或者将博客从回收站中彻底删除。
(5)博主还可以上传图片文件,同时进行管理,包括浏览和删除操作。
(6)博主能够对游客的评论进行管理,包括查询和删除操作。
2.2系统流程图
后台业务流程:
(博主操作流程)见下图:
图2.1后台业务流程图
前台业务流程:
(游客操作流程)见下图:
图2.2前台业务流程
2.3功能结构分析
此系统主要包含两个方面,一为前台信息显示系统即普通游客空间、二为后台信息管理系统即管理员管理空间。
前者是面向公众的一个窗口,通过前台信息显示系统方便普通游客浏览日志、评论和留言。
后台信息管理系统在管理员登录后,管理员可以发表日志;回复评论和留言;管理日志、评论、留言及个人信息等。
系统的基本功能结构图如图2.1所示。
图2.3功能结构图
普通游客模块:
主要是为了让访问本博客的游客对博客有一个基本的了解。
通过游客的评论和留言了解游客对本博客博主博文的评价,以便于同博主更好的互动和交流。
博客主人管理员模块:
主要实现对所发表的博文、评论及留言信息进行管理,对博客各个方面的管理与维护以便网站更好的运行。
其个管理模块的功能有:
文章管理:
管理员可以对博文进行分类管理、添加分类、添加博文等操作。
相册管理:
管理员可以对照片进行分类管理、添加分类、添加或删除照片等操作。
留言管理:
管理员可以回复或者删除游客留言。
我主要负责浏览日志和文章管理两块。
2.4数据库设计
本系统采用SQLServer2005作为开发工具。
根据系统需求分析和保证数据统一、完整和高效的原则,需要对数据库进行合理的设计。
首先先在SQLServer2005中建立一个名为“blog”的数据库来存放本系统所必须的数据表。
本系统数据库中主要的数据表分别为用户注册表(Register),博客类别表(Class),博客文章表(News),图片文件表(Photo),博客留言表(Message)。
如表2-1—2-5所示:
表2-1用户注册表
表2-2博客类别表
表2-3博客文章表
表2-4图片文件表
表2-5博客留言表
2.5前台页面设计
2.5.1母版页设计
利用母版页可以将前台的几个页面创建一致的布局。
单个母版页可以为应用程序中的所有页(或一组页)定义所需的外观和标准行为。
然后可以创建包含要显示的内容的各个内容页。
当用户请求内容页时,这些内容页与母版页合并以将母版页的布局与内容页的内容组合在一起输出。
如下图2.4为site2.master的设计图。
图2.4母版页设计图
2.5.2首页设计
首页作为内容页面被包含在母版页site2.master的占位符控件显示最新文章、友情链接、相册以及留言。
如图2.5所示。
图2.5主页面
主要具体代码如下:
ContentID=""ContentPlaceHolderID="Left"runat="server"> LeftListID="LeftList1"runat="server"/>
Content>
ContentID=""ContentPlaceHolderID="Right"runat="server"> RepeaterID="Repeater1"runat="server"> id={0}")%>'target="_blank"><%#Eval("Title")%>
浏览|评论
Repeater>
2.5.3留言板设计
留言板主要是把访客的留言显示出来,是一个博主与游客谈心交流的地方,在留言板中可以畅所欲言,就感兴趣的话题展开讨论与大家进行交流和沟通。
留言模板页面如图2.6所示。
图2.6留言板
主要代码如下:
liuyanID="liuyan1"runat="server"/>
huifuID="huifu1"runat="server"/>
2.6后台页面设计
2.6.1后台页面布局设计
后台页面使用框架iframe来搭建页面。
iframe元素会创建包含另外一个文档的内联框架。
如下图2.7
图2.7后台页面设计图
主要代码如下:
后文中用target属性来设置页面
2.6.2文章管理设计
博主登录后单击导航栏“添加文章”即可进入添加文章页面。
点击“文章管理”可以进行文章的编辑删除操作。
添加文章和文章管理页面分别如图2.8和图2.9所示。
图2.8添加文章
图2.9文章管理图
添加文章的主要代码:
protectedvoidbtnAdd_Click(objectsender,EventArgse)
{stringtext=InputText(Editor1.Text);
if(bdc.pro_AddNew(txtTitle.Text.Trim(),text,DateTime.Now,0,0,TType.SelectedValue,false,false)>0)
{ClientScriptManagerscript=this.ClientScript;
script.RegisterStartupScript(this.GetType(),"123","alert('添加文章失败')",true);
}
else
{ClientScriptManagerscript=this.ClientScript;
script.RegisterStartupScript(this.GetType(),"123","");
}
}
添加至草稿箱的主要代码:
protectedvoidbtndraft_Click(objectsender,EventArgse)
{if((bdc.pro_AddNew(txtTitle.Text.Trim(),Editor1.Text.Trim(),DateTime.Now,0,0,TType.SelectedValue,true,false)>0))
ClientScriptManagerscr=this.ClientScript;
scr.RegisterStartupScript(this.GetType(),"34","alert('未能添加到草稿箱')",true);}
else{Response.Write("");
Response.Redirect("~/CuteSoft_Client/NewSave2.aspx");}
}
2.6.2留言管理
留言管理模块可以通过查找关键字或开始结束日期来获得相应留言记录,进行删除操作。
留言模板页面如图2.10所示。
图2.10留言板页面
主要实现代码如下:
QueryExtenderID="QueryExtender1"runat="server"TargetControlID="LinqDataSource1"> SearchExpressionDataFields="body"SearchType="StartsWith"> ControlParameterControlID="TextBox1"/> SearchExpression> RangeExpressionDataField="date"MaxType="Inclusive"MinType="Inclusive"> ControlParameterControlID="TextBox2"DbType="DateTime"/> ControlParameterControlID="TextBox3"DbType="DateTime"/> RangeExpression> QueryExtender> 2.6.3相册管理 通过相册管理模块可以进行上传照片,插看和删除图片。 如下2.11图。 图2.11相册管理图 查看相册修改代码: protectedvoidbutsubmit_Click(objectsender,EventArgse) {stringtitle="",info=""; intid=Convert.ToInt32(Request.QueryString["id"]); for(inti=0;i info=((TextBox)dlphotoinfo.Controls[i].FindControl("txtinfo")).Text; } if(bdc.pro_UpdatePhoto(id,title,info)<=0) {ClientScriptManagerscript=this.ClientScript; script.RegisterStartupScript(this.GetType(),"123",""); } else {ClientScriptManagerscript=this.ClientScript; script.RegisterStartupScript(this.GetType(),"12","alert('修改图片失败! ')",true); } } 3测试 3.1后台管理登陆 在后台管理中需要有一个登陆的页面,只有进行登录并通过身份验证的用户,才可以在个人博客页面发表日志,并借助个人设置实现对个人博客相关信息的管理维护。 对于没有经过身份验证的网络用户不允许在博客页面中发表日志,更不允许对博客页面信息进行管理维护。 其登陆页面如图3.1所示。 图3.1后台管理登陆页面 登陆页面具体代码如下: protectedvoidbtnlogin_Click(objectsender,EventArgse) {stringuid=txtuid.Text.Trim().ToString(); stringpwd=txtpwd.Text.Trim().ToString(); if(uid! =""&&pwd! ="") {varresult=fromninbdc.Register wheren.user_id==Int32.Parse(uid)&&n.user_name==pwd selectn; if(result! =null) {Session["username"]=uid; Response.Redirect("../Manage/Hou.aspx",true);} else {ClientScriptManagerclient=this.ClientScript;client.RegisterStartupScript(this.GetType(),"55",""); return; }} } 3.2博客管理 3.2.1添加文章验证 进入后台添加文章后界面如图3.2所示。 图3.2管理菜单首页 3.3.2删除文章验证 图3.3日志管理页面 3.3.3修改文章验证 在点击“编辑”之后会出现博文的具体信息,进行修改,“保存修改”即把修改后的内容添加到数据库中去如图3.4所示。 图3.4文章编辑页面 3.3留言管理 普通游客在浏览网页时,可以进行留言操作。 如图: 姓名为“li”的人进行留言。 如图3.5。 图3.5留言验证图 3.4相册管理 3.4.1修改照片信息验证 查看图片后,可以对其相关信息进行修改如下图3.6。 图3.6修改照片图 3.4.2上传照片验证 点击“添加图片”,可以上传图片。 如下图3.7。 图3.7上传图片验证 总结 通过这次课程设计,我了解了一个网站形成的基本过程和基本纲领构架,加深了我对动态网站的认识,相信这些知识都将对我的学习带来很大的帮助。 这次设计个人博客网站,对我来说是一个将所学知识从书本运用到实际操作的宝贵次体验。 在设计过程中我学会了很多,也感到自身知识的贫乏,同时也认识到了理论与实践间存在的巨大差距,有些看上去很简单的问题,在动手去实践时却未必会顺利。 一味的啃书并非是好的。 只有理论与实践相结合,才能更快的进步,学到更多的知识。 希望在今后的努力中能做出更完善的设计。 同时,通过这次课程设计,我们对一个动态网站从设计到功能的实现有了一个更全面的理解。 同时老师和同学的相互讨论促使我们对课本上的知识理解得更加全面,并且将其运用到实践中。 培养了我们的团队协作解决问题的能力。 在这次课设中遇到好多书上没有提到的问题,通过运用书上的知识,并且将其加以现实化,解决了这些问题,提高了我们独立思考解决问题的能力。 这一切,都将成为我以后工作中的一笔很大的财富,也为以后走上工作岗位打下了基础。 参考文献 [1]张强等编著.网页制作与开发教程.北京: 人民邮电出版社,2008 [2]何东健,朱俊平等编著.网页设计与Web编程.西安: 西安交通大学出版社,2007 [3]张正礼,王坚宁.ASP.Net4.0从入门到精通.北京: 清华大学出版社,2011 [4]俞传正.基于博客的个人知识管理平台研究.天津: 天津师范大学,2006