个人博客设计报告.docx
《个人博客设计报告.docx》由会员分享，可在线阅读，更多相关《个人博客设计报告.docx（24页珍藏版）》请在冰豆网上搜索。
个人博客设计报告
个人博客设计报告
软件需求说明书
1、引言
a）编写目的
对ASP.NET网页设计有个大概的理解和运用，能掌握一些简单的网页制作方法。
熟悉C#语言。
b）背景
软件名称：
个人博客。
2、正文
该个人博客是一个小型的博客，它的主要功能有：
登录，发表文章，发表评论等。
用户登录博客后，可以查看个人资料；可以查看已经发表过的文章和评价；可以发表新的文章和新的评论；可以修改文章的内容；还可以删除文章和评论。
该博客使用固定的用户名和密码，用户名为：
admin；密码为admin。
该博客除了上述功能外，我们还可以添加其他功能，如：
（1）、添加留言板，更多的和读者交流；
（2）、添加音乐盒，让你在更新你的个人博客的同时聆听音乐；
（3）、添加最近访问人的名单，告诉你最近有几个人访问了你的个人博客；
（4）、为每个文章添加相关文章，方便其他读者进行链接阅读；
（5）、相册，用于存放相片等。
3、任务概要
a）目标
提供用户一个简单的博客，能够实现发布文章、修改文章和删除文章；还有能够实现对文章的评价以及删除评价等功能。
b）约束
对发表文章进行约束，只有登录后才能进行发表文章和查看个人资料；对用户输入的Email进行约束，当用户所输入的Email格式不正确时提醒用户。
c）绑定
将数据信息存入数据库中，在博客上用代码将表格与数据库的信息进行绑定，用以实现数据的显示功能。
4、需求规定
a）功能
该博客的主要功能有：
用户登录、发表文章、修改或删除文章、发表评价、删除评价等。
[1]：
登录个人博客的账号和密码是固定的，其用户名为：
admin，密码为：
admin。
[2]：
只有登录博客后才可以对该博客进行文章的添加和修改。
[3]：
不论是否登录博客，都可以对文章进行评价，但是要删除评价只能登录博客后才能进行。
[4]：
个人信息的显示只有登录博客后才能看到。
b）基本数据
i.文章的主要数据类型
数据库中文章所在表的名称为：
Notes。
文章ID：
NoteID数字类型（自动编号）
文章标题：
Title文本类型
文章内容：
Contents备注类型
张贴时间：
DataTime日期/时间类型
ii.评价的主要数据类型
数据库中评价所在的表的名称为：
Comments。
评价ID：
CommentID数字类型（自动编号）
对应文章ID：
NoteID数字类型
游客名称：
Author文本类型
Email地址：
Email文本类型
评价内容：
Comment备注类型
发布时间：
DataTime日期/时间类型
c）灵活性
该博客的灵活性良好，其基本功能都能在同一个网页上执行，步骤简单。
当用户未登录博客时，能提醒用户登录后可以查看个人资料，还可以进行更多的管理。
当用户输入的Email地址有误时，会提示用户输入正确的Email地址。
d）输出方式
该博客需要在IE6以上的浏览器使用。
5、开发环境规定
个人博客运用MicrosoftVisualStudio2005编写，其数据库使用ACCESS。
使用说明书
1、编辑软件
该博客使用的编辑软件是MicrosoftVisualStudio2005。
2、数据库
该博客使用的数据库是ACCESS。
3、路径
请将文件夹1080417435放在该路径F盘，使文件中数据库的路径为：
F:
\1080417435\Blog\App_Data\Blog.mdb
或则将文件web.config中的DataSource的路径改成数据库所在的位置的路径。
4、密码
使用博客是请打开登录网页Login.aspx，用户名和密码都为：
admin。
概要设计说明书
1、引言
a）编写目的
对ASP.NET网页设计有个大概的理解和运用，能掌握一些简单的网页制作方法。
熟悉C#语言。
b）背景
软件名称：
个人博客。
2、总体设计
a）需求规定
该博客的主要功能有：
用户登录、发表文章、修改或删除文章、发表评价、删除评价等。
[1]：
登录个人博客的账号和密码是固定的，其用户名为：
admin，密码为：
admin。
[2]：
只有登录博客后才可以对该博客进行文章的添加和修改。
[3]：
不论是否登录博客，都可以对文章进行评价，但是要删除评价只能登录博客后才能进行。
[4]：
个人信息的显示只有登录博客后才能看到。
b）运行环境
个人博客运用MicrosoftVisualStudio2005编写，其数据库使用ACCESS。
c）基本设计概念和处理流程
根据其需求规定先建立数据库，在根据数据库和需求规定进行编写网页。
i.登录系统：
判断用户名和密码是否正确。
如不正确，提示用户并让用户重新登录。
如果正确，登录到博客主页面，并提供用户显示个人资料、添加、修改、删除文章和评价等功能。
ii.发表文章
用户只有在登录成功后才可以发表文章。
发表的文章必须输入标题，如果没有输入，则提示用户标题不能为空，让用户重新输入。
iii.修改文章
用户只有在登录成功后才可以对文章进行修改和删除。
在删除文章时，其对应的评价一并删除。
iv.发表评价
发表评价在登录前和登录后都能进行评价，评价是必须输入游客名，如游客名为空，则提示用户游客名不能为空，让用户重新输入。
3、设计和运行结果
a）登录
i.新建一个网页命名为Login.aspx。
在主界面插入一个层，并添加背景图片。
ii.在层内插入4行2列的表格，添加文字和文本使其显示如下图登录界面：
用户名文本ID为：
boxcontent；
密码文本ID为Password，类型为TextMode="Password"；
Cookie标签ID为Persistent，类型CssClass="boxcontent"，其功能为保存用户名。
按钮登录ID为LoginUser，行为OnClick="LoginUser_Click"。
iii.在表格下方添加一个Lable，内容为“用户名或者密码不正确，请重新登录！
”。
文本颜色红色，不可见。
其属性为：
ID="InvalidLogin"、ForeColor="Red"、Visible="False"。
iv.在代码文件Login.aspx.cs中添加代码如下控制登录：
protectedvoidPage_Load（objectsender,EventArgse）{
if（!
IsPostBack）
if（Request.Params["logout"]=="true"）
FormsAuthentication.SignOut（）;
}
protectedvoidLoginUser_Click（objectsender,EventArgse）{
//检查用户名和密码
if（FormsAuthentication.Authenticate（UserName.Text,Password.Text））{
//如果检查通过，保存Cookie
FormsAuthentication.SetAuthCookie（UserName.Text,Persistent.Checked）;
//重定向到Default.aspx
Response.Redirect（"Default.aspx",true）;
}
else
InvalidLogin.Visible=true;//登录失败显示Lable
}
v.登录界面
vi.登录的控制
在web.config文件中可以设置登录的用户名和密码，其代码如下：
在该文件中还需定义数据库的位置，即将DataSource的路径改成数据库所在的位置的路径。
b）主界面
登录成功后则进入主界面。
主界面的设计包括博客标题，个人资料，日历，登录、退出按钮的设计等。
先给主界面添加一个5*3的表格，使其构成一个框架。
i.博客标题
将第一行合并单元格，添加背景图片后，在添加两个文本按钮“登录”和“退出”。
对齐格式为右对齐。
两个文本按钮的代码如下：
HyperLinkID="HyperLink_Login"runat="server"NavigateUrl="~/Login.aspx">登录
HyperLink>
HyperLinkID="HyperLink_Logout"runat="server"NavigateUrl="~/Login.aspx?
logout=true">退出
HyperLink>
在代码文件Default.aspx.cs文件中添加代码控制这两个文本按钮：
protectedvoidSetVisible（boolIsMasterLogined）
{
HyperLink_Login.Visible=!
IsMasterLogined;
HyperLink_Logout.Visible=IsMasterLogined;
}//控制登录按钮在用户未登录是显示，退出按钮在用户登录后显示。
将第二行合成单元格，添加背景图片和文本标题。
其结果为：
ii.个人资料
个人资料与登录、退出文本按钮一样，在用户登录前，显示的是文本提示“登录后可查看个人资料，还可以进行更多管理”，用户登录后显示个人资料，其代码同上在文件Default.aspx.cs的protectedvoidSetVisible（boolIsMasterLogined）中添加：
HyperLink_DngAn.Visible=IsMasterLogined;//个人资料
HyperLink1.Visible=!
IsMasterLogined;//登录前的文本
个人资料在用户登录前和登录后显示如下：
iii.日历
为博客添加如下图所示日历：
其设计代码如下：
CalendarID="Calendar1"runat="server"BackColor="White"BorderColor="#3366CC"BorderWidth="1px"CellPadding="1"DayNameFormat="Shortest"Font-Names="Verdana"Font-Size="8pt"ForeColor="#003399"Height="180px"OnSelectionChanged="Calendar1_SelectionChanged"SelectionMode="DayWeekMonth"Width="180px">
Calendar>
控制代码如下：
protectedvoidCalendar1_SelectionChanged（objectsender,EventArgse）
{
Session["FromDate"]=Calendar1.SelectedDates[0];
Session["ToDate"]=Calendar1.SelectedDates[Calendar1.SelectedDates.Count-1].AddDays
（1）;
DataBind（）;
}
c）文章列表
文章列表使用的是工具箱中数据栏里的GridView，将GridView拖至表格第三行的左边单元格内，然后添加数据库内的数据，过程如下图步骤：
1．在选择数据源下拉列表中选择新建数据源，发开窗口如下：
2．选择Access数据库，点击确定，出现如下窗口：
3．选择浏览，找到我们的数据库后单击确定：
4．在指定来自表或试图的列中选择数据库表Notes中的数据Title，点击下一步即可完成。
则主界面的总体显示如下图：
d）文章显示、添加文章和文章的管理
i.文章的显示
文章的显示方法与文章列表相同，使用的是工具箱中数据栏的DetailsView，用同样的方法绑定数据库，在数据库表Notes中选择Title、Contents、DateTime。
在显示的同时，给用户提供对文章的管理，即修改、删除和发表评论。
其设计代码如下：
LinkButtonID="LinkButton_Modify_Note"runat="server"OnClick="LinkButton_Modify_Note_Click"Visible="<%#User.Identity.IsAuthenticated%>">修改
LinkButton>
LinkButtonID="LinkButton_Delete_Note"runat="server"OnClick="LinkButton_Delete_Note_Click"Visible="<%#User.Identity.IsAuthenticated%>">删除
LinkButton>
LinkButtonID="LinkButton_Post_Comment"runat="server"OnClick="LinkButton_Post_Comment_Click">发表评论
LinkButton>
ii.添加文章界面
新建一个移动WEB用户控件命名为：
NoteEditor.ascx。
在界面添加文字、文本框、按钮和隐藏属性。
并在NoteEditor.ascx.cs文件中定义它们的属性。
我们添加文章时，我们的标题应不能为空，这在按钮提交是先判断标题是否为空，代码如下：
protectedvoidButton1_Click（objectsender,EventArgse）{
stringa;
a=TextBox1.Text;
if（a==""）
Label2.Text="用户名不能为空";
elseif（Submit_Note!
=null）
Submit_Note（sender,e）;
}
添加界面如下：
如果标题不为空，则允许添加文章，添加代码如下：
publicvoidSetInsert（）{
Title="";
Contents="";
IsModify=false;
Button_Text="提交新消息";
}
将设计好的界面拉至主界面的正中间，在其上面添加一个文字按钮：
发表文章，其在用户登录前不显示。
iii.文章管理
文章管理就是对文章的修改和删除的管理，设计代码如上显示，其控制代码如下：
protectedvoidLinkButton_Modify_Note_Click（objectsender,EventArgse）{
Stringstr_Title=String.Empty,str_Contens=String.Empty,str_DateTime=String.Empty;
intint_NoteID=Convert.ToInt32（GridView1.SelectedValue）;
myBlog.GetNoteData（int_NoteID,refstr_Title,refstr_Contens,refstr_DateTime）;
NoteEditor1.SetModify（str_Title,str_Contens,int_NoteID）;
NoteEditor1.Visible=true;
CommentEditor1.Visible=false;
}
protectedvoidLinkButton_Delete_Note_Click（objectsender,EventArgse）{
intint_NoteID=Convert.ToInt32（GridView1.SelectedValue）;
myBlog.DeleteNote（int_NoteID）;
DataBind（）;
NoteEditor1.Visible=false;
CommentEditor1.Visible=false;
}
e）添加评价和评价的管理
i.添加评价界面
添加评价界面的方法同添加发表文章界面的方法，即新建一个移动WEB用户控件文件命名为：
CommentEditor.ascx。
ii.评价的显示和管理
评价的显示是在主界面中使用工具箱中数据栏下的Repearter，其设计代码如下：
RepeaterID="Repeater1"runat="server"OnItemCommand=Repeater1_ItemCommand">
LabelID="CommentAuthor"runat="server"Text='<%#Eval（"Author"）%>'>
Label>发表于：
LiteralID="literal_CommentTime"runat="server"Text='<%#Eval（"DateTime","{0:
yyyy-MM-dd,hh:
mm:
ss}"）%>'>
Literal>
Email:
"+Eval（"Email"）%>'><%#Eval（"Email"）%>
评论：
LinkButtonID="DeleteComment"runat="server"CommandArgument='<%#Eval（"CommentID"）%>'CommandName="Delete"Text="删除"Visible="<%#User.Identity.IsAuthenticated%>">
LinkButton>
Panelrunat="server"BorderColor="BurlyWood"BorderStyle="Solid"BorderWidth="1px"Width="400px">
LabelID="CommentContents"runat="server"Text='<%#Eval（"Comment"）%>'>
Label>
Panel>
Repeater>
4、数据库内容的读取和各个按钮的动作
新建一个文件夹命名为APP_Code，在文件夹内新建一个脚本文件Blog.cs，在其中添加连接数据库和按钮动作的代码：
publicclassBlog{
privateOleDbConnectionm_Connection;
privateStringm_brChar="\n";
publicBlog（）{
m_Connection=newOleDbConnection（ConfigurationManager.AppSettings["ConnString"]）;;
}
privatevoidExecuteCommand（OleDbCommandcmd）{
cmd.Connection=m_Connection;
try{
m_Connection.Open（）;
cmd.ExecuteNonQuery（）;
}
finally{
m_Connection.Close（）;
}
}
publicDataSetGetNotes（DateTimefromDate,DateTimetoDate）
{
DataSetds=newDataSet（）;
//查询特定时间段内张贴的文章，填入DataSet的MyNotes表中
OleDbDataAdapterda=newOleDbDataAdapter（"SELECT*FROMNotesWHEREDateTimeBETWEEN?
AND?
ORDERBYDateTimeDESC",m_Connection）;
da.SelectCommand.Parameters.Add（"FromDate",OleDbType.Date）.Value=fromDate;
da.SelectCommand.Parameters.Add（"ToDate",OleDbType.Date）.Value=toDate.AddDays
（1）;
m_Connection.Open（）;
da.Fill（ds,"MyNotes"）;
//关闭数据库连接
m_Conn
升级会员 