动态网页制作实验

动态网页制作实验

一、 实验目的

1. 熟悉 VS 2010 开发环境，学会使用 VS 构建网站基本结构
2. 熟悉 HTML 服务器控件，特别是 FORM 表单服务器控件的设置
3. 掌握表单处理方法
4. 掌握服务器内置对象：Request、Response、Session等内置对象的使用
5. 掌握ASP.NET日期时间类
6. 掌握在 MSSQL 2008 创建数据库、数据表,并能使用 SQL 语句进行表操作熟悉 HTML 服务器控件，特别是 FORM 表单服务器控件的设置（SELECT、INSERT、UPDATE、DELETE)
7. 掌握 ADO.NET 提供的连接式数据访问方式,了解非连接式数据访问方式

二、实验环境

Windows OS/VS 2010(C#)、SQL SERVER 2008

三、 实验内容

动态网页实验（一）

1、 通过 VS2010创建空ASP.NET网站。添加2个WEB窗体：login.aspx,myhome.aspx

2、 添加新项Visual C# Web窗体：login.aspx。
1） 设置窗体Title为：登录页
2） 在login.aspx中，使用工具箱->标准：添加3个Labl、2个TextBox、2个Button控件
3） 设置控件属性

a) ID：Label1、Label2、Label3、txtUserName、txtPwd、btnLogin、btnReset
b) 设置Label标签的Text属性分别为：用户名、密码、请输入用户名
c) 设置Button按钮的Text属性分别为：登录、重写

图1.1 login窗体效果图

上图即login页面的效果图：添加了 3 个 Label、2 个 TextBox、2 个Button 控件，分别为用户名、密码、提示输入的文字，和两个Button按钮控件，分别用来是现登录重定向到下面的myhome窗体功能和将输入的信息清除的功能。

2.4设置Button控件Click时间响应函数
BtnLogin的Click事件：
获取TextBox控件txtUserName、txtPwd的输入值（可通过对象的属性或者Request.form集合获取相应的变量与变量值）
检查txtUserName、txtPwd的值是否为合法用户，如：用户名为“张三”，密码为“1234”，如果是的话，则创建Session变量保存当前的登录用户名与密码，再重定向至myhome.aspx；否则的话，将Label3的Text属性设置为：请输入正确的用户名与密码！

图1.2 用户名和密码正确重定位到myhome窗体

图1.3 检查用户名或者密码不正确返回提示

上两个图是利用当前的登录用户名与密码进行判断，若正确,重定向至 myhome.aspx;否则的话,将 Label3 的 Text 属性设置为:请输入正确的用户名与密码!
BtnReset的Click事件：将TextBox控件txtUserName、txtPwd清空。
添加新项Visual C# Web窗体：myhome.aspx。
1、 设置窗体Title为：我的空间
2、 在myhome.aspx中，使用工具箱->标准：添加3个Label，1个Button。
3、设置控件属性：
ID：Label1、Label2、Label3,btnLogout
设置 3 个 Label 标签的 Text 属性分别为:欢迎您来到您的空间!
设置 Button 的 Text 属性为:退出。

图1.4 密码的属性设置为不回显

4、在myhome.aspx.cs的Page_Load响应函数中:
通过 Session 变量,验证当前用户是否已登录,如未登录则重定向至login.aspx。
设置 Label2.Text 值为:当前用户名和密码,即 Session 中保存的用户名和密码
设置 Label3.Text 值为:输出当前系统时间。

图1.5 显示用户名、密码和时间

5、设置btnLogout的Click响应函数
退出当前 Session;
重定向到 login.aspx 窗体。

动态网页实验（二）

使用实验二.pdf 文档,通过 VS2010 创建简单的用户名/密码验证页面。(此处不赘
述)。

2、SQL Server2008 库/表。
1）启动 SQL Server2008 的 SQL Server Management Stuido,附加 NetSchool 数据库
(NetSchool_Data.MDF/NetSchool_Log.LDF),查看其中的 STUDENT/STUDENT_CLAS 表。
请通过查询,尝试相关 SQL 语句(Select、Insert、Update、Delete)并掌握。

图2.1 SQL语句的使用

2）创建数据库连接字符串,通过在 VS2010 中的服务器资源管理器中,添加数据库连接,
得到该数据库连接的 ConnectionString。【其中 SQL Server 身份认证为:sa/123456】

图2.2 SQL数据库链接

由于是在自己的计算机上做的，所以参数有些不同。

SqlConnection conn;
        conn = new SqlConnection("Data Source=（local）;Initial Catalog=NetSchool;Integrated Security=True");
string str1 = @"SELECT * FROM [NetSchool].[dbo].[STUDENT] where USERID='" + strU + @"' and PASSWORD ='" + strP + "'";
        cmd = new SqlCommand(str1, conn);

3）请根据第七章的 ADO.NET 中的面向连接访问方式,在 login.aspx 的 btnLogin 的 Click
事件中修改代码,使得原先的静态用户名/密码验证为,数据库 Netschool 中 Student 表
中已有的用户才能够登录。

3.1 静态用户名/密码验证代码(此次实验需要重新修改):

3.2 动态验证。支持当前 STUDENT 表中的所有用户能够登录当前系统。
图 2 连接式访问数据库程序框架

3.2.1 添加数据库托管程序支持:using System.Data.SqlClient;

3.2.2 根据图2 所示步骤,重写撰写 protected void btnLogin_Click(object
sender, EventArgs e) { }响应函数。

3.2.3 其中判定是否有该登录用户名/密码,可利用 DataReader 对象的 READ 方法
或者 HasRows 属性,作为判断依据。

4.在 myhome.aspx 页面中添加 ListBox 控件、Button 控件。

4.1 修改 Button 控件:ID 为:btnSeachMyclass。Text 属性:查询

4.2 修改 ListBox 控件:ID 为:ListBMyClass。在 Page_Load 中,通过程序对其初
始化,添加一个 Item 项目“我所选修的课程”。

4.3 在对应的 btnSeachMyclass_Click(){ }函数中进行 Code,是的点击该按钮
后,将当前登录用户的所有选修课程的 ClassID 以 Item 的方式显示在 ListBox 控件中。
注意:login.aspx 中用户名输入,请输入 STUDENT 表中的 USERID 值。

图2.3 myhome页框展示

图2.4 所选修的课程显示

四、原理实验步骤

原理：
1、通过服务器控件获取用户输入后，合法用户则创建相应的Session变量，并进行合适的网页重定向。同时熟悉DateTime类。
2、通过服务器控件获取用户输入后,合法用户则创建相应的 Session 变量,并进行合适的网页重定向,并在 myHome.aspx 网页中显示相应的个人相关记录。其中:合法用户的判断规则:未使用数据库/表时,启用静态用户名/口令验证原则: 未使用数据库/表时,启用静态用户名/口令验证原则:否则,通过查询 MySite 数据库中 Users 表中是否有该用户/密码,为准。

实验步骤：见实验内容。

五、关键问题及解决方法

1、对于用户名和密码的显示需要跨页面传递数据，解决办法是利用Session进行跨页面的数据传递进行记录，

Session["S_uname"] = txtUserName.Text;
            Session["S_upwd"] = txtPwd.Text;
Label2.Text = "当前用户为：" + Session["S_uname"].ToString() + "密码为：" + Session["S_upwd"].ToString();
Label3.Text = "当前时间为：" + System.DateTime.Now.ToString();

2、控件的操作很繁琐
解决办法是为每个空间配置相应的属性如ID和动作如Clicked等都很繁琐，还好VS的集成性很好，可以利用拆分的双视图进行编辑。
3、数据库的操作很繁琐
解决办法是可以在视图界面进行配置，包括控件的各种属性也是如此。在操作数据库的过程中，出现了很多的问题，由于对SQL SERVE数据库不熟悉，所以在处理解决问题上很费力，但还是没有很好的方法解决，通过查阅资料，向同学了解之后才能勉强做。

六、实验结果

最终我按照要求，利用VS，编写出了一个简单的动态网页，包括两个2 个 WEB 窗体:login.aspx,myhome.aspx。利用各种控件，实现了登录页面的验证与重定向，对于信息的记录显示与时间的展示以及退出函数的实现。还使用数据库进行了用户合法性的判断，还读取数据库中的数据到ListBox中显示给用户查询，效果如前面各个图片。

七、实验体会

通过本次实验，使得我对于网络程序设计有了更深的认识，也印证了我们在课堂上学习的内容，熟悉 了HTML 服务器控件,特别是 FORM 表单服务器控件的设置。印证了我们在课堂上学习的关于数据库的内容，熟悉了对于数据库的连接和对其中数据库数据的操作，熟悉了ListBox控件,通过对数据库数据来动态验证用户的合法性，更具有实用性。本次实验还使我对于VS的使用也有了很大的进步。
通过这次实验，我懂得了理论与实际相结合是很重要的，只有理论是远远不够的，只有把所学的理论知识与实践相结合起来，从理论知识与实践相结合，从理论中得出结论，才是真正的知识，才能提高自己的事迹动手能力和独立思考的能力。

附录：源代码（仅仅附上核心代码）

1.1网页login.aspx.cs或其他

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;

public partial class login : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }

    protected void btnLogin_Click(object sender, EventArgs e)
    {
        string strU = txtUserName.Text;
        string strP = txtPwd.Text;


        SqlConnection conn;//定义一个连接对象
        SqlCommand cmd;//定义一个命令对象
        SqlDataReader rd;//定义一个读取数据对象

        conn = new SqlConnection("Data Source=(local);Initial Catalog=NetSchool;Integrated Security=True");
        conn.Open();
        string str1 = @"SELECT *
  FROM [NetSchool].[dbo].[STUDENT]
  where
  USERID='" + strU + @"'
  and
 PASSWORD ='" + strP + "'";//此为SQL操作字符串


        cmd = new SqlCommand(str1, conn);
        rd = cmd.ExecuteReader();//执行查询操作

        if (rd.HasRows)
        {
            Session["S_uname"] = txtUserName.Text;
            Session["S_upwd"] = txtPwd.Text;
            rd.Close();
            conn.Close();
           Response.Redirect("myhome.aspx");
        }
        else
        {
            Label3.Text = "请输入正确用户名和密码";
        }
    }

    protected void btnReset_Click(object sender, EventArgs e)
    {
        txtUserName.Text = null;
        txtPwd.Text = null;
    }
}

2.1网页myhome.aspx.cs或其他

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;

public partial class myhome : System.Web.UI.Page
{

    protected void Page_Load(object sender, EventArgs e)
    {
        if (Session["S_uname"] == null)//防止直接进入myhome窗体
        {
            Response.Redirect("login.aspx");
        }
        Label2.Text = "当前用户为：" + Session["S_uname"].ToString() + "密码为：" + Session["S_upwd"].ToString();
        Label3.Text = "当前时间为：" + System.DateTime.Now.ToString();

        ListBMyClass.Items.Clear();
        ListBMyClass.Items.Add("我所需选修的课程");//在下拉列表中新增一项
    }
    protected void btnSeachMyclass_Click(object sender, EventArgs e)
    {
        SqlConnection conn;
        SqlCommand cmd;
        SqlDataReader rd;

        conn = new SqlConnection("Data Source=(local);Initial Catalog=NetSchool;Integrated Security=True");
        conn.Open();
        string str1 = @"SELECT *
                    FROM STUDENT_CLASS
                    where
                    USERID='" + Session["s_name"].ToString() + "'";
        cmd = new SqlCommand(str1, conn);
        rd = cmd.ExecuteReader();
        while (rd.Read())//常见的使用方法：循环调用SqlDataReader对象的read方法来遍历所有行
        {
             ListBMyClass.Items.Add(rd["CLASSID"].ToString());
           // ListBMyClass.Items.Add(new ListItem(rd["CLASSID"].ToString(), rd["CLASSID"].ToString()));
        }
        rd.Close();
        conn.Close();

    }

    protected void Button1_Click(object sender, EventArgs e)
    {

    }

    protected void ListBox1_SelectedIndexChanged(object sender, EventArgs e)
    {

    }

    protected void btnLogout_Click(object sender, EventArgs e)
    {
        Response.Redirect("myhome.aspx");
    }
}

2.3 数据库生成SQL语句[包括建库、建表语句；记录不需要]

Login.窗体中：

SqlConnection conn;//定义一个连接对象
        SqlCommand cmd;//定义一个命令对象
        SqlDataReader rd;//定义一个读取数据对象

        conn = new SqlConnection("Data Source=(local);Initial Catalog=NetSchool;Integrated Security=True");
        conn.Open();
        string str1 = @"SELECT *
  FROM [NetSchool].[dbo].[STUDENT]
  where
  USERID='" + strU + @"'
  and
 PASSWORD ='" + strP + "'";//此为SQL操作字符串


        cmd = new SqlCommand(str1, conn);
        rd = cmd.ExecuteReader();//执行查询操作

myhome窗体中：
SqlConnection conn;
        SqlCommand cmd;
        SqlDataReader rd;

        conn = new SqlConnection("Data Source=(local);Initial Catalog=NetSchool;Integrated Security=True");
        conn.Open();
        string str1 = @"SELECT *
                    FROM STUDENT_CLASS
                    where
                    USERID='" + Session["s_name"].ToString() + "'";
        cmd = new SqlCommand(str1, conn);
        rd = cmd.ExecuteReader();