《网页制作技术教程》课件第三章 动态网页设计.ppt

1、第第3 3章章 动态网页设计动态网页设计 本 章 教 学 目 的(1)掌握动态网页基础知识(2)掌握ASP的工作平台(3)掌握ASP中的数据库操作 目 录第一讲 动态网页的基础知识及ASP中的数 据库操作第一讲动态网页的基础知识及ASP中的数据库操作教学内容教学内容3.1.1 动态网页基础知识动态网页基础知识3.1.2 ASP环境的配置和IIS的安装及配置3.1.3 动态站点的管理 3.1.4 创建ASP页3.2.1 创建数据库 3.2.2 连接数据库3.2.3 定义记录集、绑定数据和添加记录集导航条3.2.4 使用服务器行为教学重点和难点教学重点和难点动态网页的概念、Asp工作平台创建、As

2、p数据库的创建、连接及定义记录集、绑定数据和添加记录集导航条 1动态网页的概念一个真正的动态页面应该具备有交互性、自动更新性、因时因人而变 2动态网页和静态网页的区别（1）动态网页中的某些脚本只能在Web服务器上运行，而静态网页中的任何脚本都不能在Web服务器上运行（2）动态网页与静态网页文件扩展名不同（静态网页文件扩展名为.htm或.html，动态网页扩展名是.asp等）3ASP的概念 ASP是Active Server Pages的简称，是服务器端脚本编写环境，使用它可以创建和运行动态、交互的Web服务器应用程序 3.1.1 动态网页基础知识动态网页基础知识3.1.2 ASP环境的配置和I

3、IS的安装及配置 要使用ASP创建动态网页，要从硬件和软件方面配置好ASP的运行环境。在硬件方面，必须在计算机上安装网卡，至少要安装一个虚拟网卡；在软件方面应当在计算机上安装服务器软件PWS或IIS，这两种服务器软件共有一个特点，即它们同时兼有Web服务器和ASP应用程序服务器的功能。在Windows 95/98平台上安装PWS作为服务器软件；在Windows NT 4.0 Server平台上安装IIS 4.0作为服务器软件；在Windows 2000平台上安装IIS 5.0作为服务器软件；在Windows XP平台上安装IIS 5.1作为服务器软件 【任务3-1-1】配置ASP环境【操作要求

4、】安装IIS软件【操作步骤】（1）选择“开始”“设置”“控制面板”命令。（2）在“控制面板”窗口中，双击“添加或删除程序”图标。（3）在如图3-2所示的“添加/删除程序”窗口中，单击“添加/删除Windows组件”。图3-2 “添加或删除程序”窗口4）在如图3-3所示的“Windows组件向导”对话框中，选择“Internet信息服务”组件，然后单击“下一步”按钮。图3-3 “Windows组件向导”对话框 图3-4 在IE浏览器中测试IIS 5.13.1.3动态站点的管理1、设置站点配置【任务3-1-2】设置站点配置【操作要求】设置“默认Web站点”的配置。【操作步骤】（1）站点IP地址和端

5、口号的设置（2）站点的主目录设置，如图3-6所示。（3）默认文档设置2设置虚拟目录虚拟目录就是在URL地址中使用的目录名称，有时也称为URL映射。创建虚拟目录有两种方法：（1）通过Internet信息服务设置（2）通过文件夹的属性设置【任务3-1-3】设置虚拟目录【操作要求】在D:盘中创建一个名为root的文件夹，并设置为站点虚拟目录。【操作步骤】（1）确认Web服务已经启动。（2）在D:盘中，创建一个名为root的一级文件夹。（3）单击root文件夹，再单击“文件”“共享和安全”命令。（4）在文件夹属性对话框中，单击“Web共享”选项卡，然后选取“共享文件夹”复选项。（5）在如图3-8所示的

6、“编辑别名”对话框中，为要创建的虚拟目录指定一个别名，然后在“访问权限”区域中选中“读取”复选项，在“应用程序权限”区域中单击“脚本”单选按钮。（6）单击“确定”按钮，再次单击“确定”按钮。图3-8 指定虚拟目录的别名 【任务3-1-4】创建ASP页【操作要求】在Dreamweaver 8中新建页面，页面名称为default.asp，保存在D:rootunit3y3-01文件夹中。将D:素材第3章y3-01文件夹下的Y3-01A.asp、Y3-01B.asp、Y3-01C.asp、Y3-01D.asp拷贝到D:rootunit3y3-01文件夹中【操作步骤】（1）先在Dreamweaver 8

7、中创建站点root（D:root），选择“站点”“新建站点”命令（2）在Dreamweaver 8中创建default.asp页面，选择“文件”“新建”命令，弹出如图3-10所示的对话框。按步骤操作完毕，default.asp页面就建立好了（3）将D:素材第3章Y3-01文件夹下的Y3-01A.asp、Y3-01B.asp、Y3-01C.asp、Y3-01D.asp拷贝到D:rootunit3y3-01文件夹中 3.2 ASP中的数据库操作 1、创建数据库【任务3-2-1】创建数据库 【操作要求】通过Access 2003创建osta数据库 【操作步骤】（1）启动Access 2003数据库后

8、，单击Access窗口左上角数据库工具栏中的“新建”按钮，会在窗口右侧出现“新建文件”任务窗格。（2）在打开的“新建文件”任务窗格的“新建”选项组中选择“空数据库”选项（3）在“文件名”文本框中给新建的数据库文件取名osta，并把它存储在D:rootunit3y3-01文件夹中，单击“创建”按钮将新建的数据库文件保存下来（4）此时会出现表设计器窗口。在“数据库”窗口中，双击“使用设计器创建表”选项（5）单击“文件”“保存”命令，在弹出的“另存为”对话框中输入表名tAdmin（6）单击“确定”按钮，会弹出“尚未定义主键”对话框，我们在这里暂时不定义主键，单击“否”按钮（7）在表设计器窗口中双击t

9、Admin数据表，在“tAdmin：表”中按照表的格式输入需要的数据 同理，建立名为tGuestBook的数据表 2、连接数据库 ODBC（Open Database Connectivity），即开放数据库互连。ODBC基于SQL并把它作为访问数据库的标准。这个接口提供了最大限度的相互可操作性：一个应用程序可以通过一组通用的代码访问不同的数据库管理系统。对Access数据库创建ODBC连接【任务3-2-2】连接数据库【操作要求】建立Dreamweaver 8数据库连接，连接名称为Connosta3jk，数据源名称为dsOSTA，使用本地DSN【操作步骤】（1）选择“控制面板”“管理工具”“数

10、据（ODBC）”命令，在弹出的对话框中选择“系统DSN”选项卡（2）单击“添加”按钮在“名称”列表框中选“Microsoft Access Driver(*.mdb)”选项 （3）单击“完成”按钮在“数据源名”文本框中输入dsOSTA，单击“选择”按钮选择数据库D:rootunit3y3-01osta.mdb，单击“确定”按钮，dsOSTA数据源就建立好了 （5）选择“窗口”“数据库”命令，打开数据库面板，如图3-20所示。单击窗口中的按钮，选择“数据源名称（DSN）”，弹出如图3-21所示的对话框。在“连接名称”文本框中输入Connosta3jk，在“数据源名称”下拉列表框中选择dsOSTA

11、。至此，数据库连接建立完毕 3、定义记录集、绑定数据和添加记录集导航条【任务3-2-3】创建记录集【操作要求】打开D:rootunit3y3-01Y3-01B.asp页面，将该记录集命名为Rsosta31，选择Connosta3jk为连接，使用tGuestBook表中的所有列，按fID降序排列【操作步骤】（1）打开3-01B.asp页面，在工具条中选择“应用程序”工具条 记录集（2）单击“记录集”按钮在“名称”文本框中输入Rsosta31，在“连接”下拉列表框中选择connosta3jk，在“表格”下拉列表框中选择tguestbook，在“列”区域中选择“全部”单选项，在“排序”下拉列表框中选

12、择fID和“降序”【任务3-2-4】绑定数据【操作要求】（1）打开D:rootunit3y3-01Y3-01B.asp页面和记录集（Rsosta31），绑定数据到页面（2）将记录集（Rsosta31）中的fName字段绑定到Y3-01B.asp页面中文本“姓名”右边的单元格中，将fE_Mail字段绑定到E_mail右边的单元格中，将fOIcq字段绑定到OICQ右边的单元格中，将fHomePage字段绑定到“我的主页”右边的单元格中，将fContent字段绑定到“留言”右边的单元格中【操作步骤】（1）打开“绑定”面板（2）打开页面Y3-01B.asp，将3-24“绑定”面板中相应的字段拖到Y3-

13、01B.asp页面中的相应位置【任务3-2-5】添加记录集导航条【操作要求】添加信息导航：打开D:rootunit3y3-01 Y3-01B.asp页面，在相应的单元格中插入“记录集导航条”和“记录集导航条状态”【操作步骤】（1）打开D:rootunit3y3-01Y3-01B.asp页面，将光标定位到要插入记录集导航条状态的位置，单击“应用程序”工具条中的“记录集导航条状态”按钮，确定后在窗口中相应的位置输入其中的汉字 使用服务器行为 Dreamweaver 8提供了一组内置的服务器行为，使用户能够方便地向站点添加动态功能，常用的内置服务器行为有：插入记录、删除记录、更新记录、用户身份验证、

14、限制对页的访问、记录集分页等【任务3-2-6】使用服务器行为【操作要求】（1）插入记录：把D:rootunit3y3-01Y3-01C.asp页面制作成插入页面，将form1表单中的记录插入到以connosta3jk为连接的tGuestBook表格中，其中form1表单对象中的fname获取的内容插入fName字段中；form1表单对象中的foicq获取的内容插入fOIcq字段中；form1表单对象中的fe_mail获取的内容插入fE_Mail字段中；form1表单对象中的fhomepage获取的内容插入fHomePage字段中；form1表单对象中的fcontent获取的内容插入“fCont

15、ent”字段中；要求完成插入后转到Y3-01B.asp页面。（2）使用“登录用户验证”服务器行为：在D:rootunit3y3-01Y3-01A.asp页面中使用“登录用户验证”服务器行为，使用form2表单中的admin和password表单对象所获取的信息，与以connosta3jk为连接的tAdmin表格中的fAdministrator和fPassword字段作比较；通过验证转到Y3-01C.asp页面，否则进入Y3-01D.asp页面（3）使用“限制对页的访问”服务器行为：打开Y3-01C.asp页面，在Y3-01C.asp页面中使用限制对页的访问服务器行为，如果访问被拒绝则转到Y3-

16、01A.asp页面【操作步骤】（1）打开Y3-01C.asp页面，选择“应用程序”工具条中的“插入记录”“插入记录”命令，按操作要求设置好参数（2）打开Y3-01A.asp页面，选择“应用程序”工具条中的“用户身份验证”“登录用户”命令，按操作要求设置好参数（3）打开Y3-01C.asp页面，选择“应用程序”工具条中的“用户身份验证”“限制对页的访问”命令，按操作要求设置好参数 本讲小结1 动态网页基础知识动态网页基础知识2 ASP中的数据库操作中的数据库操作 上机作业1、【实战训练一】ASP中的数据库操作 2、【拓展实战一】搭建ASP工作平台 3、【拓展实战二】创建Access 2003数据库