网站开发实习

网站开发实习 俱乐部论坛系统开发

姓 名： 院 系： 班 级： 学 号： 指导老师： 2011年11月1号 —— 2011年12月1号

1. 实习目标

通过网站的开发，熟悉掌握XHTML + CSS、ASP.NET 、SQL Server相关知识与技能的综合应用，经历一个实际项目的分析、开发与测试。

2. 实习项目

实习项目要求利用ASP.NET （Visual Studio 2008）完成一个俱乐部网站的开发。本俱乐部网站可以使用户注册、登录，登录用户可以对文章进行评论。俱乐部工作人员可以在后台进行文章的发布、编辑并对用户评论进行管理。

沃克俱乐部（Walker Club）要求能够有一个论坛，使俱乐部成员通过网站进行有关健走活动、户外旅游等加强交流与沟通，同时也通过俱乐部网站扩大自己的影响力，以吸引更多的人参加俱乐部，培养健康的生活方式。

俱乐部对论坛的要求是： ● 论坛内容对所有人开放；

● 只有俱乐部会员可以发帖及发评论；

● 俱乐部有专门维护人员，可以对论坛的帖子进行管理；

3. 设计说明书：

3.1 XHTML + CSS 进行网页界面布局

在动态网站的开发中，手工进行XHTML 代码编写的情况是很少见的，但利用XHTML + CSS进行网页布局与展示，是网站设计必须的基本功之一。由于CSS 的应用，网页布局现在不再使用表格的方式对网页进行布局，而是利用CSS 中的盒模型和XHTML 中的DIV 标签，对网页进行布局，这种网页的布局办法也被称为DIV + CSS。

3.1.1 盒模型（B OX M ODEL ）

网页设计中的每个元素都是一个矩形盒。在CSS 中，进行设计和布局时，会用到盒模型。CSS 盒模型从本质上来说是环绕在XHTML 元素周围的方框，它由外边距、边框、内边距和实际内容组成。

盒模型允许放置元素周围的边框及周围相关元素。图1阐释了盒模型：

图1 CSS 盒模型

为了能在所有的浏览器中正确地设置元素的宽（width ）和高（height ），需要了解盒模型的工作原理。当一个元素的宽和高被CSS 定义后，它设置的仅仅是内容区域的宽度和高度。元素（盒）的总宽度还包括内边距（padding ）、边框（border ）和外边距（margin ），如下例子中元素的总宽度为300px

.element1 {

width:250px; padding:10px;

border:5px solid gray; margin:10px; }

计算过程如下：

250px （宽度）+ 20px（左右内边距）+ 10px（左右边框）+ 20px（左右外边距）= 300px 元素（盒模型）的总宽度与总高度应当这样计算：

盒的总宽度 = width + padding-left + padding-right + border-left + border-right + margin-left + margin-right

盒的总高度 = height + padding-top + padding-bottom + border-top + border-bottom + margin-top + margin-bottom

3.1.2 F LOAT 属性

XHTML 的div 元素所形成的盒子（box ），默认情况下，是垂直分布的，即水平方向只能有一个盒子，另外一个盒子只能排列在前一个盒子的下方，在CSS 术语中，这种元素叫做块级元素（Block Elements），h1、p 这些元素都是块级元素；默认情况下可以在水平方向分布的元素，被称作行内元素（Inline Elements），如span 、a 都是行内元素。如例1。 例1 块级元素与行内元素

第一个块级元素

第二个块级元素，出现在第一个块级元素下方

超链是行内元素，这是第一个行内元素

第二个行内元素，水平方向位于前一个行内元素右边

网页布局中，为使水平方向可以并行出现两个或者两个以上的例子，需要使用CSS 的float 属性，能够使盒子在水平方向上浮动。将例1中的div 元素加入float 属性，如例2

例2 利用CSS float属性

第一个块级元素

第二个块级元素，加

入float 属性后出现在第一个块级元素右边

超链是行内元素，这是第一个行内元素

第二个行内元素，水平方向位于前一个行内元素右边

3.1.3 两栏布局页面

下面举例说明DIV 与CSS 结合制作一个两栏页面，通过这个页面进行扩充，可以制作出三栏页面，并在相应位置放入图片、Flash 、文字、数据列表等等。这种页面布局可以应用到ASP.NET 开发网站时母版页中。例子中有具体的代码说明。 例3 两栏布局XHTML 文档

两栏页面结构举例

这里放头部图片或者是Flash 文件

页面左栏内容

页面右栏内容

这里是网页下部

例4 两栏布局CSS 文件（文件名：2Columns.css ） /*两列页面设计要点 author:wusir 1 width=960px

2 header height(include navigation): */ body { }

#wrapper {

width: 960px; margin: 0 auto; padding: 0;

font-family: 宋体,Arial, Helvetica, sans-serif; font-size: 12px; color: #000000; margin: 0; padding: 0;

#header { }

/* Page */

#page { /*page只设定宽度，不设定高度，说明宽度固定而高度灵活，由这个容器内的内容决定高度 */ }

/* Content */

#content { /*左栏使用float 设定*/ }

#sidebar{

float: left; width: 658px; height:500px; padding: 8px;

border:1px solid green; width: 960px; margin: 8px auto; padding: 0; width: 958px; height: 120px; margin: 0 auto; padding: 0px;

border: 1px solid red;

}

width:258px; height:500px; padding:8px;

border: 1px solid blue;

/* Footer */ #footer { }

width: 958px; height: 70px; margin:8px auto;

border: 1px solid orange;

项目开发计划：

3.2 ASP.NET 动态网站开发

在ASP.NET 之前，微软的动态Web 编程技术称为Active Server Pages（ASP ，动态服务器页面），ASP 是微软公司开发的代替CGI 脚本程序的一种应用, 它可以与数据库和其它程序进行交互，是一种简单、方便的编程工具。尽管ASP 对于创建动态网站在当时是一种流行的选择，但是它缺乏其它编程技术中的一些重要功能（比如ASP 不支持对面向对象技术），微软推出ASP.NET 以弥补ASP 的缺点。ASP.NET 1.0版本于2002年1月发布，到2005年，ASP.NET 2.0版本发布，成为动态网站开发的主流选择，2007年底，随同Visual Studio 2008一起，微软发布了ASP.NET 3.5，将AJAX 技术结合为ASP.NET 的标准配置，使得开发动态网站变得前所未有的简单与高效。

3.2.1 母版页

母版页就像是PPT 文件中的模板，使用母版页后，所有的页面都有统一的风格，如页头与页尾。

母版页不限于只有一个，比如主页为一个母版页，栏目为一个母版页，具体内容页面为另外一个母版页，可以使用DIV + CSS制作好的页面布局，导入母版页。具体操作办法参见实习步骤。

3.2.2 访问数据库

动态网站区分于静态网站，就是动态网站可以访问数据库。ASP.NET 访问数据库有多种办法，其中SQL 语句是最基本的要求。

ASP.NET 提供有数据源控件和数据绑定控件（在【工具箱】的【数据】选项卡内），可以对数据库进行快捷的访问，本实习部分采用这种办法。

为了分层开发架构的开发，本实习还采用ADO.NET 技术，结合数据库存储过程完成分层架构的开发。

3.2.3 数据验证

ASP.NET 提供了简单易用的数据验证办法，在用户没有输入应该输入的数据或者格式出现错误时，系统可以发出提示信息，指导用户输入正确格式的数据。

3.2.4 注册登录功能

ASP.NET 3.5集成的安全功能，可以迅速完成用户注册页面、登录页面及用户修改口令等功能，具体操作见操作步骤。

3.3 SQL S ERVER

SQL Server是微软公司出品的数据库管理系统，可以与VS2008完美结合。本实习采用SQL Server数据库，在本应用中，SQL Server 2000以上的版本都可以完成工作。

VS2008的集成开发环境（IDE ）可以在其内部就完成数据库的创建与操作。本实习主要完成数据库、数据表的创建与修改，存储过程的创建与修改。

3.4 分层开发架构

开发复杂软件或网站时，经常采用分层架构的方式，将复杂的问题简化，同时也为团队协作和今后的软件维护打下良好的基础。

常用的分层架构为三层架构，三层架构为：展示层（PL ）、业务逻辑层（BLL ）和数据访问层（DAL ）。结合网站的情况，展示层为用户可见的网页，主要是.aspx 和.aspx.cs 文件，业务逻辑层是具体的操作，如数据的修改、添加、删除、查询等；数据访问层是与具体数据库的连接、打开、关闭。

ASP.NET 既可以完成分层开发架构的开发，也可以使用简单的不分层（一层方式）完成开发。本实习步骤中，涉及到这方面的问题，会有提示。

4. 需求分析：

4.1 需求设计

根据沃克俱乐部所提出的要求，分析该论坛的技术层次需要如下： ● 网站应该能够支持用户账户；

● 所有用户，无论登录或者未登录，都可以浏览网站上的帖子及评论； ● 只有通过认证的用户才可以发帖子或评论；

● 通过认证的用户发帖子时，必须提供帖子标题、内容并选择版块； ● 通过认证的用户发评论时，必须是针对某一个帖子进行发表；

● 每个论坛版块都有至少1个版主，版主可以对本版块的帖子进行管理，如置顶、

删除操作

● 需要有一个特别的认证账户（网站管理员）可以对所有的用户进行管理，能够

更换版主，同时可以对网站上所有帖子、评论进行管理

4.2 数据库架构设计

当把ASP.NET 设置为基于窗体的身份验证类型之后，系统会自动创建一个ASPNETDB.MDF 数据库，并且定义了一系列的数据库表，创建用户账户。

现在需要做的是，根据上一小节的分析定义除系统数据库表之外其它的表结构。根据分析，需要三个需要手工创建的表：

Columns ：版块表，用来定义俱乐部论坛不同的版块，如健走活动、骑行联盟等。 Posts ：帖子表，会员发布的帖子将被保存在本数据库表中作为一条记录，包括标题、内容、发布时间等。

Comments ：评论表，会员根据某个具体的帖子发布的评论将在本表中被保存为一条记录，包括内容、评论时间等。

2. 数据库表结构

表1 版块表（表名Columns ）结构

表2 帖子表（表名Posts ）结构

表3 评论表（表名Comments ）结构

说明 UserId 的数据类型是uniqueidentifier ，与ASPNETDB 数据库中aspnet_Users的主键UserId

数据类型一致。这是一个确保全球唯一的极大的数，用于唯一识别用户账户。

4.3 界面设计

用户界面是应用的前端部分，用户通过用户界面与系统交互。对于Web 网站应用系统来说，用户界面是网站的一系列网页。

用户对网站质量的判断，大多是来自于对网页可用性、快捷性的评价，所以确保网页用户界面的直观及方便非常重要。

论坛网站需要如下网页：

● 主页：在该网页中，匿名用户会看到一个“登录”和“注册”链接，而已登录

用户则可以进行发新帖与发评论的操作，如果已认证用户为管理员或版主，则可以进行帖子与评论管理。

● 版块页：版块页将列出本版块全部允许显示的帖子，包括帖子标题、作者及发

布日期。

● 发新帖页：该网页只能被已认证用户打开访问，用户可以在该网页中发新帖，

包括标题、内容与版块，用户名及发布时间则根据当前用户及当前时间自动由系统提交。

● 帖子详细内容页：该网页显示帖子详细内容及对于该帖的评论，匿名用户只能

浏览该网页，已认证用户可以添加新评论。

● 管理页：网站管理员、版主可以对帖子及评论进行管理，网站管理员还可以对

用户进行管理，比如屏蔽用户及调整版主。

虽然一个动态网站可能由几十个、几百个甚至上千个网页组成，但其实质只有几个网页，通过参数传递的方式，显示众多的网页。比如帖子详细内容页，即使有几千条帖子，但查看帖子详细内容时，都是通过调用数据库中不同的记录，在帖子详细内容页这一个页面中显示出来。

4.4 网站具体制作与代码编写

4.4.1 创建数据库

1、创建用户与数据库

(1)打开VS2008，选择菜单【文件】【新建网站】|，将网站位置选择为“文件系统”，目录命名为“ClubForum ”，语言选择为“Visual C#”；选择菜单【网站】|【ASP.NET 配置】，出现【ASP.NET 网站管理工具】欢迎页面；

(2)单击页面上部的【安全】选项卡（或中部的【安全】链接），此时可以进行创建用户、创建角色及身份验证类型设置；

(3)单击界面左下角【选择身份验证类型】链接，默认设置是【通过本地网络】单选钮，即Windows 身份验证，单击【通过Internet 】单选钮，将其设置为基于窗体的安全，单击【完成】按钮返回；

(4)在返回的界面中，【用户】窗格由于身份验证类型已经改为基于窗体的安全，因此现在可以创建用户及管理用户，

(5)单击【创建用户】链接，提示进行用户名、密码等的输入，在输入时，注意保证左下角的【活动用户】复选框为选中状态（默认为选中），否则用户将无法登录网站。用户账户内容的输入会进行验证检查，比如保证用户名为唯一，密码满足特定强度（默认至少为七个字符长，并至少包含一个非字母数据字符），电子邮件符合正确格式等，如果输入无效数据，将显示验证错误消息，禁止创建新用户。

如果没有错误，单击【创建用户】按钮，有创建用户完成的信息提示，用户创建完成。

在【ASP.NET 网站管理工具】页面内，创建一个用户名Admin ，再创建几个普通用户，用户名自己设定，注意记录下密码，供以后使用（数据表中的密码已经被加密，无法看出明文密码）。同时创建一个Administrator 用户角色，将用户名Admin 加入这个角色。

在设置基于窗体的安全之后，系统会自动创建一个名为ASPNETDB 的数据库。关闭ASP.NET 管理工具，进入ClubForum 网站，在解决方案资源管理器中，单击上方的【刷新】按钮，再单击App_Data文件夹前边的“+”号，可以看到该文件夹中存在一个系统新建的数据库ASPNETDB.MDF 。进入数据库资源管理器，观察ASPNETDB 数据库的表，其中有11个系统表。

有两个表与账户密切相关，它们是aspnet_Users和aspnet_Membership，这两个表存储用户的账户信息，对网站的每个注册用户，这两个表中将有一条对应的记录。aspnet_Users表包含标识用户的基本列，特别是用户名。aspnet_Membership表包含注册用户所提供的信息，如电子邮件地址、密码、账户创建时间、安全问题与答案、用户是否为活动状态等。

ASPNETDB 数据库，尤其是aspnet_Users和aspnet_Membership数据库表，将在实际的网站开发中有极大的用处。

2、在【服务器资源管理器】界面，单击“ASPNETDB.MDF ”前面的“+”号，右击【表】，单击【添加新表】，将4.2讨论的数据表结构创建三个新表。并在Columns 表中添加两到三条记录，如健走、骑行、游泳等，作为实验数据供开发使用。

3、连接数据库

数据库的连接方式在web.config 文件中设置。通过在appSetting 元素中添加一个数据库连接字符串ConnectionString 来实现，代码如下：

Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\ASPNETDB.MDF;Integrated Security=True;User Instance=True" />

其中的value 值为连接字符串，可以在第2步中右击“ASPNETDB.MDF ”文件，选择【属性】，查找其“连接字符串”属性，将其属性值复制粘贴即可。

4.4.2 创建母版页

在【解决方案资源管理器】右击，单击【添加新项】，在对话框中选择【母版页】，使用默认文件名，MasterPage.master ，在【源】视图，可以把部分的

元素删除，只保留部分的元素，将已经制作好的网页布局的页头部分HTML 代码放入部分的

上部，将页脚部分放入其下部，将正文部分放入其中间，这样的结果，以后所有以这个母版页为母版的页面，都有相同的页头与页脚。

删除创建网站时默认建立的Default.aspx 页面，重新创建一个主页名为Index.aspx ，注意在【添加新项】对话框，保证【选择母版页】选项被选中，这时就可以选择已经制作好的母版页。

以后的页面都要选定这个母版页，保证整个网站的页面是统一风格。如果要设定主页、栏目页及帖子详细内容页的正文部分有不同的布局，可以在具体的页面内进行调整。

在主页Index.aspx 的元素内，将前述网页布局（例3）正文部分内容放入，在【设计】视图检查效果。

4.4.3 创建登录页与注册页

登录页命名为Login.aspx ，注册页命名为Register.aspx ，注意这两个网页的母版页仍然选择MasterPage.master ，将【工具箱】中【登录】内的控件Login 和

CreateUserWizard 分别拖放到这两个网页上，即完成了登录页面与注册页面的制作。

如果想把用户登录功能做到主页上并提供更好的用户体验界面，可以调整Login 控件，并结合【登录】选项卡内的其它控件如LoginView 、LoginName 等，制作到主页上。

4.4.4 制作发新帖页

创建一个发新帖的页面，命名为NewPost.aspx 。已登录用户可以使用这个页面发新帖，实际对应于在数据表Posts 中加入一条新记录。

要加入一条新记录，需要提供这条记录需要的所有字段的值。注意这些字段的值，需要用户提供只有三个，标题（Title ）、内容（Post ）和栏目（ColumnId ），其它字段的值由数据表自动生成（如PostId ）或系统提供（如UserId ）。

由于需要用户提供的信息只有栏目、标题与内容，所以在NewPost.aspx 页面添加三个控件，对应这三个信息由用户选择或输入，具体控件的布局由自己完成。

DropDownList 控件的数据绑定

首先拖放一个DropDownList 控件到页面，将其命名为ddlColumn ，这个下拉框为用户提供可选栏目，其工作原理为：用户在下拉框中按栏目名称进行选择（从Columns 表中提取的ColumnName 信息），相应存入到Posts 数据表中的数据是栏目名称对应的ColumnId 值而不是ColumnName 值。具体操作办法如下：

单击DropDownList 的智能标签，【选择数据源】|【新建数据源…】，选择【数据库】，在下拉列表框中选择ASPNETDB.MDF ，在数据库中选择Columns 数据表，选择该数据表的所有字段（ColumnId 与ColumnName ），单击【下一步】|【完成】，在【数据源配置向导】内，将显示的数据字段选择为ColumnName ，将值数据字段选择为ColumnId ，如图2所示，本工作完成了下拉列表框显示给用户为一个值（ColumnName ），绑定到数据表时为另外一个值（ColumnId ）。

图2 配置DrowDownList 控件

页面制作

本页面实现分为两层，一是用户表示层（PL ），前述的.aspx 页面文件及.aspx.cs 代码隐藏文件均属于这一层，主要负责处理用户的各种操作，处理各种控件的事件响应。

另外一层是数据访问层（DAL ），对数据库服务器的所有调用都是通过数据访问层进行。一个设计良好的数据访问层可以使业务逻辑层的实现快速简洁，同时封装了对底层数据库的访问而使得整个系统层次分明、易于扩展。这一层由ClubForumDBO 数据库访问公共类实现。

拖放一个TextBox 控件到上述控件下面，命名为txtTitle ，再拖放一个TextBox 控件到txtTitle 下面，将其命名为txtPost ，将其TextMode 属性设置为MultiLine 。适当调整控件大小，使页面美观。

在页面最下方，添加两个Button 控件，分别命名为btnSubmit 和btnCancel ，显示文字分别为“发布”和“清空”。

“清空”按钮的工作很简单，就是将标题和帖子内容清空，双击“清空”按钮，进行代码编辑，键入如下代码（加粗部分）：

protected void btnCancel_Click(object sender, EventArgs e)

{

txtTitle.Text = ""; txtPost.Text = "";

}

进入NewPost.aspx.cs 代码文件中，在Page_Load事件内键入如下代码（加粗部分）：

protected void Page_Load(object sender, EventArgs e) {

if (!User.Identity.IsAuthenticated) Response.Redirect("Index.aspx");

}

说明 User.Identity.IsAuthenticated 是一个布尔值，如果用户通过身份验证，该值为True ，否则

为False ；Response.Redirect()为页面重定向方法。粗体代码首先判断用户是否为通过验证用户，如果没有通过身份验证，则将页面重定向到网站主页Index.aspx ；如果用户通过身份验证（成功登录），则不执行重定向方法，进入NewPost.aspx 页面。

双击NewPost.aspx 页面上的“发布”按钮，键入如下代码（加粗部分）：

protected void btnSubmit_Click(object sender, EventArgs e)

{

//获取当前登录用户的UserId

string userid = Membership.GetUser().ProviderUserKey.ToString(); //从ddlColumn 获取被选定项的值，并转换为int 类型

//注意不能用(int)的办法强制转换，因为它只是类型转换，用下面的两种办法之一都做到了内容转换

int columnid = Int32.Parse(ddlColumn.SelectedValue); //int columnid=Convert.ToInt32(ddlColumn.SelectedValue); string title = txtTitle.Text; string post = txtPost.Text;

//调用数据库访问类，并调用NewPost()方法发布新帖 ClubForumDBO newpost = new ClubForumDBO(); newpost.NewPost(userid,columnid,title,post); }

在上一步骤的C#代码中（NewPost.aspx.cs 文件），需要加入命名空间

System.Web.Security ，亦即把下面代码（粗体部分）加入到代码最上面部分，这样才可以保证Membership 正常工作：

using System.Web.Security;

2、数据访问层

发新帖子由ClubForumDBO 类的NewPost()方法完成，其代码包含在公共类ClubForumDBO.cs 中

ClubForumDBO.cs 创建办法：在【解决方案资源管理器】中，右击解决方案名，选择【添加ASP.NET 文件夹】|【App_Code】，然后在【App_Code】文件夹上右击，选择【添加新项】|【类】，命名为“ClubForumDBO.cs ”，【确定】。双击文件名“ClubForumDBO.cs ”即可对其进行编辑。

//可以指明SQL 命令操作类型的命名空间 using System.Data;

//可以使用配置文件web.config 中的配置命名空间 using System.Configuration; //可以使用SQL 命令命名空间

using System.Data.SqlClient;

public bool NewPost(string UserId,int ColumnId,string Title,string Post) {

//创建数据库连接和命令对象，AddPost 为存储过程 SqlConnection conn =

new SqlConnection(ConfigurationManager.AppSettings["ConnectionString"]); SqlCommand comm = new SqlCommand("AddPost",conn); //指明Sql 命令的操作类型是使用存储过程

//这部分如果智能感知不起作用，注意使用using System.Data.SqlClient

comm.CommandType = CommandType.StoredProcedure; //为存储过程添加参数

SqlParameter pUserId =

new SqlParameter("@UserId",SqlDbType.VarChar,36); pUserId.Value = UserId; comm.Parameters.Add(pUserId); SqlParameter pColumnId =

new SqlParameter("@ColumnId",SqlDbType.Int,4); pColumnId.Value = ColumnId; comm.Parameters.Add(pColumnId); SqlParameter pTitle =

new SqlParameter("@Title",SqlDbType.NVarChar,40); pTitle.Value = Title;

comm.Parameters.Add(pTitle); SqlParameter pPost = new

SqlParameter("@Post",SqlDbType.Nvarchar,4000); pPost.Value = Post;

comm.Parameters.Add(pPost); //打开数据库连接并执行Sql 命令 try {

//open DB connection conn.Open();

//Execute DB Sql command comm.ExecuteNonQuery();

//Succeed in executing Sql command return true;

} catch {

//fail to execute SQL command return false; } finally {

//close DB connection conn.Close(); } }

AddPost 是存储过程名称。为保证系统具备良好的可扩展性，业务规则可以以存储过程方式存放在数据库服务器上。利用存储过程，数据库操作可以封装在单个命令中，为获取最佳性能而进行优化并通过附加的安全性得到增强。建议网站开发中，大量使用高效简洁的存储过程简化编程。

创建存储过程的办法是：进入【服务器资源管理器】窗口，在“ASPNETDB.MDF ”下【存储过程】右击，单击选择【添加新存储过程】，一个新的存储过程建立在工作区，修改为如下代码：

CREATE PROCEDURE dbo.AddPost (

@UserId uniqueidentifier, @ColumnId int, @Title nvarchar(40), @Post nvarchar(4000) )

AS

INSERT INTO Posts

(

)

VALUES

(

)

RETURN @UserId, @ColumnId, @Title, @Post, getdate(), 'true', 0, 0 UserId, ColumnId, Title, Post, SubmitDate, ShowFlag, VisitNum, ReplyNum

测试NewPost.aspx 页面：

在【解决方案资源管理器】，右击“NewPost.aspx ”，选择【在浏览器中查看】，运行出来的页面不是NewPost.aspx 页面，而是Index.aspx 页面！这是由于不是登录用户，所以被代码（Page_Load中）定向到主页。可以使用Register.aspx 页面注册一个用户，使用这个注册用户到 Login.aspx 页面登录，登录后，再到NewPost.aspx 页面选择栏目，输入标题及帖子内容，单击【发布】按钮。

测试分析报告

1、仔细体味本页面的制作方式，其它页面的制作也是类似本页面的办法完成。首先制作用户界面，即.aspx 及.aspx.cs 文件；然后根据与数据库的互动要求，完成公共类代码的制作及存储过程的制作。

2、完成后，对页面进行调试与测试，尽量测试各种可能性，使每一部分代码都可能运行到。

3、本页面可以做一些完善。比如制作本页面与主页、主页与本页面等相关的链接，用户单击【发布】按钮后，弹出一个信息框，告诉用户新帖子发布成功与否（提示：注意代码中，发布成功返回值为true ，发布失败则为false ）

4、本页面可以做另外一种完善：用户单击【发布】按钮后，如果发布成功，直接显示已经发布的新帖子。完成这种做法的提示：需要改动存储过程，让其返回这个新加帖子的PostId ，并使用Response.Redirect()方法转至帖子详细内容显示页面（可以起名为Post.aspx ），要精确转到这个新帖子，需要QueryString 的参数传递，见4.4.6内容。

4.4.5 实现文本框验证

NewPost.aspx 页面中，帖子标题和内容是不允许为空的。因此，需要对标题和内容这两个文本框进行验证。

可以使用【工具箱】|【验证】中的RequiredFieldValidator 控件，对它们完成验证。 拖放一个RequiredFieldValidator 控件到txtTitle 后面，设置为ControlToValidate 属性为txtTitle ，ErrorMessage 属性为“标题不能为空”；类似地，再拖放一个RequiredFieldValidator 控件到txtPost 后面设置。

在数据表设计中，Posts 表中的Title 字段设置为nvarchar(40)，指定这个字段最多可容纳40个字（双字节，可以是汉字，也可以是英文字母，包括空格），所以可以在前台设置txtTitle 最多只可以输入40个字，设置办法是将txtTitle 的MaxLength 属性设定为40。从经验上来说，这个MaxLength 最好是比相应字段的最大字数少一两个字，比如字段最多允许40个汉字，MaxLength 设置为38、39较合适。如果想让标题容纳字数更多，把字段定义改动即可，如改成nvarchar(100)。

4.4.6 使用Q UERY S TRING 进行页面间参数传递

QueryString 是一种常见的页面间参数传递使用的方法。比如你在中查询“ASP.NET 开发”，搜索后，浏览器地址栏的内容类似于

“www.bing.com/search?q=ASP.NET开发”（当然汉字及空格之类可能使用Unicode 的格式显示）样式，其中问号后面的内容，即被称为QueryString 。它是表单的Get 方法，亦即默认方法。

要做好页面间参数传递，至少要做两个网页，一个网页传递参数，一个网页接收参数。

现在制作两个网页，一个是Index.aspx ，即主页，另外一个是Post.aspx ，用这个页面显示帖子及评论的详细内容。

完成QueryString 传递有多种办法，比较简单的办法是直接利用【工具箱】|【数据】中的数据源控件与数据绑定控件完成，不写一行代码即可完成，具体办法可参考以下链接：

这种办法适合于轻量级开发，就是说数据库、业务逻辑没有大的变化，网站属于中小型网站，可以使用这种办法。如果是比较大的项目，或者数据库、业务逻辑变化较多，可以采用前面所述的分层架构来完成，办法提示：使用【数据】选项卡中的数据绑定控件或普通控件，数据源不使用【数据】选项卡中的数据源控件，而是利用存储过程完成记录的提取，页面将QueryString 传来的参数捕获，以捕获的这个参数做为存储过程的输入参数，做为存储过程的WHERE 子句中的查询条件，存储过程返回的结果（可以考虑使用输出参数）与相应的数据绑定控件或者普通控件绑定显示，即可以完成任务。

4.4.7 创建管理页面

论坛版主可以屏蔽帖子，网站管理员可以管理用户与版主，这些功能是普通用户不具备的。因此，需要一个专门的管理页面，仅供版主和网站管理员使用。

创建Moderator （版主）和Admin （管理员）两个角色。Moderator 内包括所有的版主账号（如果管理员账号也有版主功能，可将管理员账号也放入Moderator 角色），Admin 包括管理员账号。

判断登录用户是否为某个角色，使用

User.IsInRole(“Rolename”)

来判断。比如：

if (User.IsInRole(“Admin”))

{

//是管理员角色，执行管理员角色任务

}

else

{

//不是管理员角色，执行其它任务

}

创建一个管理页面，在其page_load事件中，使用前述的办法区分出普通用户、版主、网站管理员，普通用户不能进入该网页，版主可以看到版主功能的页面（如屏蔽帖子），网站管理员可以看到并使用管理用户与角色的功能。

4.4.8 错误处理页面

一个精心制作的网站，应该把出现错误或者异常的可能性降到最低。但一个网站却不可能百分之百地避免错误的出现，比如：用户在查看帖子内容时，手工在浏览器地址栏中输入了Post1.aspx （假如正确的应该是Post.aspx ），结果出现如图3所示的页面：

图3 错误的网页地址导致“无法找到资源”错误

类似这种错误不可预知也无法避免，但显示出来的错误信息的确令用户困惑。网站实际应用中，通常定制错误处理页面，把所有无法避免的错误重定向到一个或数个定制的错误处理页面，给用户以提示并提供返回网站主页或联系网站管理员的方式。

作为存储ASP.NET 网站应用配置信息的文件，web.config 文件包含了错误处理的配置办法。web.config 文件位于网站项目根目录下，该文件在创建网站时自动生成，它是XML 格式文件。

双击打开web.config 文件，进入节，可以看到如下被注释的代码：

注意语句，其中有两个属性：

● mode ：打开或者关闭应用程序自定义错误页面，该属性取 On | Off |

RemoteOnly 三个值之一，On 是打开，Off 是关闭，RemoteOnly 是只在远程打开，在本地开发时为关闭。

● defaultRedirect ：应用程序出现的任何错误，都将显示该属性值所指定的页面。 由于本段代码在web.config 文件中是被注释的（在中间），实际使用时，需要去除注释语句。

实际制作时，需要一个专门的错误提示页面，提示用户出现错误，在这个错误页面中应该有链接可以返回到主页。通过对web.config 相应语句的修改，用户出现的任何错误，都可以导向这个专门的错误提示页面，给用户一个良好的体验（一切皆在掌控之中的体验）。

4.4.9 加入导航

网站的下行链接已经通过4.4.6小节完成，即主页到栏目页、栏目页到内容页。但上行链接，即从内容页返回到栏目页或者主页，使用面包屑导航条是一个很好的办法。

面包屑导航使用相对简单，首先添加网站地图到网站根目录，注意保持其默认文件名web.sitemap 不变，打开这个文件，文件是XML 格式，按照网页的嵌套关系手工键入内容，保存文件。拖放SiteMapPath 控件（在【导航】选项卡内）到母版页，即自动生成了面包屑导航

4.5测试计划：

网站应该有主页、栏目页（分类显示帖子）、帖子内容页（可以发布回复）、发布帖子页、登录页、注册用户页、错误提示页、后台管理页。

根据4.1的需求设计，对网站的功能进行相应测试，比如不能有空链接，发布帖子页只有已登录用户可以进入并发布新帖，帖子内容页所有人可以看到，但只有已登录用户可以发布回复，后台管理页只有管理员角色的用户可以进入，普通登录用户不能进入，用户操作错误时有相应提示或者进入错误显示页面。

5. 测试分析报告：

6．实验心得：