第九章Dreamweaver编辑动态⽹页
第九章编辑动态⽹页
§9.1 安装 Web 服务器和设置站点
9.1.1 了解动态⽹页
在Dreamweaver 8.0中，整合了原属于Macromedia家族中Dreamweaver UltraDEV的功能，使其具有了可以编辑动态页⾯的强⼤功能。
我们在浏览⽹页的时候，仅仅从页⾯的内容来看，⼀般很难区分哪个是动态页⾯，哪个是静态页⾯。但实际上，动态页⾯和静态页⾯是有很⼤区别的，主要可以从以下⼏⽅⾯来说明。
⾸先，源⽂件不同。静态页⾯的源⽂件是浏览器可以直接显⽰的HTML代码，扩展名是.html 或者.htm；⽽动态页⾯的源⽂件中除了有HTML代码外，还嵌⼊了⼀些其他编程语⾔（称为HTML 嵌⼊式编程语⾔）编写的代码。根据所采⽤编程语⾔的不同，扩展名也相应不同（例如，嵌⼊了java语⾔的源⽂件扩展名为.jsp，嵌⼊了VBScript 或JavaScript语⾔的扩展名
为.asp……），也正是这个原因导致了浏览器⼀般是⽆法直接正常显⽰动态⽹页的。在Dreamweaver 8.0
中，可以⾮常直观地对动态页⾯进⾏编辑和测试，完全不懂那些编程语⾔的⼈也完全可以制作出具有专业⽔准的动态页⾯。
其次，对Web服务器的要求不同。当访问者向Web服务器请求⼀个静态页⾯时，只要求Web服务器将静态页⾯的HTML源代码传送给访问者的Web浏览器就可以了（访问静态页⾯甚⾄不需要Web服务器的⽀持，有些⽹页下载下来后在客户端能够脱机浏览就是很好的说明）；可是如果访问者访问的页⾯是⼀个动态页⾯的时候，要求Web服务器必须具有应⽤程序服务器这⼀服务功能，应⽤程序服务器可以根据访问者的需求不同（例如，⽤户按下页⾯中不同的按钮或链接）将动态页⾯先进⾏“处理”，“处理”之后再由Web服务器传送给访问者的Web 浏览器，以正常显⽰出来⽽不出错。需要说明的是，想营造这种Web服务器环境也不是难事，有微软的IIS（Internet Information Server）就可以。
另外，它们的功能不同。可以这样说，动态页⾯可以实现静态页⾯的⼀切功能，⽽动态页⾯的有些功能静态页⾯是⽆法实现的，即动态页⾯可实现的功能要⽐静态页⾯强⼤得多。
总的说来，动态页⾯的⽤途包括以下⼏个⽅⾯。
（1）使⽤户可以快速⽅便地在⼀个内容丰富的 Web 站点上查信息。
（2）使⽤户能够搜索、组织和浏览所需的内容。
（3）能够收集、保存和分析⽤户提供的数据。
（4）对内容不断变化的 Web 站点进⾏动态更新。
还要说明的是，动态页⾯强⼤功能的实现往往是与数据库有着紧密联系的，也就是说通过动态页⾯可以操作数据库或将数据库的内容按照需求显⽰给希望访问数据库的⽤户。动态页⾯与数据库进⾏联系需要有适当的数据库驱动程序，根据联系的数据库的不同需要的驱动程序也是不同的。如果数据规模不⼤，可以使⽤⽂件类型的数据库，例如⽤ Microsoft Access 创建的数据库；如果数据库的规模较⼤并且需要有良好的稳定性，则可以使⽤基于服务器的数据库，例如⽤Microsoft SQL Server、Oracle 9i 或 MySQL 创建的数据库。
9.1.2 在 Windows 中安装 Web 服务器
要开发和测试动态 Web 页，⽤户需要⼀个正常⼯作的Web服务器。本章介绍在Windows 环境下安装配置Web服务器。Windows9x的⽤户可以使⽤Microsoft Personal Web Server （PWS），⽽Windows2000 /XP/2003的⽤户可以使⽤Internet Information Server (IIS)（PWS 的全功能版本）。还可以在联⽹的Windows计算机上安装Web服务器以供⼯作组中的其他开发⼈员共同使⽤。这⾥介绍在WindowsXP环境下配置Internet Information Server（IIS），它
直接⽀持ASP服务器技术。以后所进⾏的操作相当于在Web服务器上来进⾏。
在Windows2000环境下安装IIS以及相关的配置：
a.安装IIS
若操作系统中还未安装IIS服务器，可打开“控制⾯板”，然后单击启动“添加/删除程序”，在弹出的对话框中选择“添加/删除Windows组件”，在Windows组件向导对话框中选中“Internet信息服务（IIS）”，然后单击“下⼀步”，按向导指⽰，完成对IIS的安
装。
b.启动Internet信息服务（IIS）
Internet信息服务简称为IIS，单击控制⾯板---管理⼯具---Internet信息服务（IIS）管理器，即可启动“Internet信息服务”管理⼯具（如图3）
Internet信息服务（IIS）管理器
c.配置IIS
IIS安装后，系统⾃动创建了⼀个默认的Web站点，该站点的主⽬录默认为
C:\\Inetpub\\。
⽤⿏标右键单击“默认Web站点”，在弹出的快捷菜单中选择“属性”，此时就可以打开站点属性设置对话框，（如图4）在该对话框中，可完成对站点的全部配置。
此主题相关图⽚如下：
默认Web站点属性
d.设置主⽬录
单击“主⽬录”标签，切换到主⽬录设置页⾯，（如图5）该页⾯可实现对主⽬录的更改或设置。
默认Web站点主⽬录设置
e．设置主页⽂档
单击“⽂档”标签，可切换到对主页⽂档的设置页⾯，主页⽂档是在浏览器中键⼊⽹站域名，⽽未制定所要访问的⽹页⽂件时，系统默认访问的页⾯⽂件。常见的主页⽂件名有index.htm、index.html、index.asp、index.php、index.jap、default.htm、default.html、default.asp等
IIS 默认的主页⽂档只有default.htm 和default.asp ，根据需要，利⽤“添加”和“删除”按钮，可为站点设置所能解析的主页⽂档。
f.启动与停⽌IIS 服务
在Internet 信息服务的⼯具栏中提供有启动与停⽌服务的功能。单击可启动IIS 服务器；单击则停⽌IIS 服务器。
需要注意的是，在“⽂档”标签中，应当添加“index.asp ”这个⽂档名，这就是动态⽹站中的主页了。Web 站点和FTP 站点都设置完成之后，再设置Dreamweaver 站点。
9.1.3 在Dreamweaver 2004中设置站点
1．“本地信息”设置
在Dreamweaver 8.0中新建站点。“本地信息”项中设置如下。
（1）“站点名称”⽂本框输⼊“mysite ”。实际上这⾥起中英⽂名称都是可以的。
（2）“本地根⽂件夹”：“D:\localWeb\”，这个⽂件夹是预先建⽴的。
（3）“默认图像⽂件夹”：如果没有专门放置图像的⽂件夹，在这⾥不填写也可以。
（4）“http 地址”：这⾥设置为“localhost/”即可。
dw制作个人网站代码
2．“远程信息”设置
“远程信息”项中设置。“访问”列表框中选择“FTP ”。“FTP 主机”⽂本框中输⼊“localhost ”，“登陆”和“密码”要使⽤IIS 中针对ftp 站点安全帐户所设置的⽤户和密码。设置完成后，单击“测试”按钮，应当出现⼀个成功连接到服务器的提⽰框，就说明设置正
确。
3．“测试服务器”设置
8-1-2 本地信息的设置图8-1-3 远程信息的设置
图8-1-4 设置测试服务
Dreamweaver 8.0 需要测试服务器的服务以在⽤户⼯作时⽣成和显⽰动态内容。“测试服务器”项中的设置:
（1）“服务器模型”：选择ASP服务器技术所⽀持的脚本语⾔（IIS⽀持ASP），这⾥选择了“ASP VBScript”。
（2）“访问”：选择“FTP”，实际上这⾥的设置要求同“远程信息”中的⼀样就可以。
（3）“FTP主机”：输⼊“localhost”即可。“登陆”和“密码”和“远程信息”中的设置⼀样。
完成后，同样要单击“测试”按钮，看看连接服务器是否成功。⾄此设置站点⼯作已完成。
4．完整地测试
为了测试Web站点和FTP站点⼯作是否正常以及Dreamweaver 8.0中设置站点是否正确，我们建⽴⾸页，然后上进⾏传浏览测试。具体操作如下。
（1）在本地根⽬录下建⽴⼀个名为“index.asp”的⽂件，这便是我们⽹站的⾸页了。
（2）打开“index.asp”后简单编辑，然后保存。展开“站点”视图，确保左窗格中为“远端站点”，然后，单击“连接到远端主机”按钮。
（3）选择本地⽂件（这⾥只有“index.asp”），单击上传按钮，上传⾄远端站点。
（4）在浏览器窗⼝中输⼊“locahost/”回车，便可看到主页。⾄此，说明Web 站点和FTP站点⼯作是正常
的，Dreamweaver 8.0中站点相关设置也是正确的。
图8-1-5 连接到远端站点图8-1-6 上传本地⽂件⾄远端站点
§9.2 操作数据库
动态 Web 站点需要⼀个内容源，在将数据显⽰在⽹页上之前，动态 Web 站点需要从该内容源提取这些数据。在Dreamweaver 8.0中，这些内容源可以是数据库、请求变量、服务器变量、表单变量或预存过程。对于采⽤数据库作为内容源，这⾥介绍使⽤基于⽂件的Microsoft Access创建的数据库，其特点是操作相对简单、实现容易。为下⾯的操作做准备，请⽤Microsoft Access建⽴⼀个只有⼀个表的数据库⽂件，命名为txl.mdb，将其存放在服务的任何位置都可以，这⾥存放在c盘根⽬录下。
图8-2-1 Access数据库表格
9.2.1 建⽴数据库连接
如果没有建⽴数据库与应⽤服务器的连接，Dreamweaver 8.0将⽆法到数据库或不知道怎样与数据库联系，也就⽆法使⽤采⽤数据库的内容源。对于ASP 应⽤程序来说，必须通过开放式数据库连接 (ODBC) 驱动程序（或对象链接）和嵌⼊式数据库(OLE DB) 提供程序连接到数据库。在Dreamweaver 8.0中可以建⽴DSN（数据源名称）连接和定义连接字符串来连接数据库。这⾥只介绍相对简单的建⽴DSN连接。请按照如下步骤进⾏操作。
1. 建⽴DSN（数据源名称）连接
（1）在Dreamweaver 8.0中打开任何⼀个 ASP 页（如先前建⽴的index.asp），然后单击“窗⼝”→“数据库”菜单命令，打开“数据库”⾯板。
（2）单击该⾯板上的加号 (+) 按钮，然后从弹出式菜单中选择“数据源名称 (DSN)”。
（3）出现“数据源名称 (DSN)”对话框。⾸先，“连接名称”必须给出，名称只能是英⽂字母和数字组成，⽽且第⼀位必须为字
母；其次，我们选择“使⽤本地 DSN”选项；然后数据源名称（DSN）列表中也许会有“GlobalCar”（这是安装Dreamweaver 8.0时安装的⼀个范例数据源，我们需要建⽴⾃⼰的数据源），单击其右边的“定义”按钮。
（4）在随后出现的“ODBC 数据源管理”对话框中选择“系统DSN ”选项卡，在对话框中单击“添加”按钮，弹出“创建数据源”对话框，选择Microsoft Access Driver(*.mdb)项，单击“完成”按钮，随后出现“ODBC Microsoft Access 安装”对话框。
先在“数据源名”后的输⼊框中输⼊数据源名称（这⾥命名没有什么限制），然后再单击“选择”按钮，选择先前建⽴的数据库⽂件后，确定即可。
（5）这时“数据源名称（DSN ）”下拉列表中会出现我们建⽴的数据源名称，选择后，在“连接名称”输⼊框中输⼊连接名称（注意：只能取以英⽂字母开头且不含汉字的名称）。
（6）单击“测试”按钮，如果提⽰成功创建连接脚本，说明⼀个数据库连接建⽴起来了。确定后，在“数据库”⾯板中便会出现相应的数据库连接。
重复上述步骤可以建⽴多个数据库连接，这样在我们的站点中就可以使⽤多个数据库了。还要说明的是，每建⽴⼀个数据库连接，实际上都会在本地站点的“Connections ”⽂件夹⾥添加⼀个与连接名称相同的asp ⽂档，正是它在起着真正的连接作⽤。
2. 定义连接字符串来连接数据库
在硬盘上创建⼀个新的⽂本⽂件, 将⽂件的扩展名由 .txt 更改为 .udl , 然后打开 .udl ⽂件（如m.udl ）。该⽂件可以打开“数据链接属性”对话框。
（1）在“提供程序”项⽬中选择你希望连接的数据，例如：ACCESS 数据库⼀班选择“Microsoft Jet 4.0 OLE DB Provider ”；
在“链接”项⽬中，选择⽹站的后台数据库（如：D:\web\asp\data\blog.mdb ），并“测试连接”。
图8-2-2 建⽴DSN 图8-2-3 添加系统DSN
（2）⽤记事本打开m.udl，就会看到相应的链接字符串。如图所⽰：
（3）在Dreamweaver 8.0中打开任何⼀个 ASP 页（如先前建⽴的index.asp），然后单击“窗⼝”→“数据库”菜单命令，打开“数据库”⾯板。单击该⾯板上的加号 (+) 按钮，然后从弹出式菜单中选择“⾃定义连接字符串”，打开“⾃定义连接字符串”对话框，将以上
的连接字符串（选中的部分）复制到“连接字符串”⽂本框中，设置连接名称并测试，完成。
（4）注意：在连接字符串中，其中的“D:\web\asp\data\blog.mdb”为数据库在本地的绝对路径，为了得
到服务器的绝对路径往往结合Server.MapPath()使⽤：
“Provider=Microsoft.Jet.OLEDB.4.0;Data Source=”&Server.MapPath("data\blog.mdb ") & “;Persist Security Info=False”
9.2.2 定义“记录集”
数将数据库⽤作动态⽹页的内容源时，必须⾸先创建⼀个要在其中存储检索数据的记录集。记录集在存储内容的数据库和⽣成⽹页的应⽤程序服务器之间起⼀种桥梁作⽤。记录集由数据库查询返回的数据组成，并且临时存储在应⽤程序服务器的内存中，以便进⾏快速数据检索。当服务器不再需要记录集时，就会将其丢弃。
记录集本⾝是从指定数据库中检索到的数据的集合。它可以包括完整的数据库表格，也可以包括表格的⾏和列的⼦集。这些⾏和列通过在记录集中定义的数据库查询进⾏检索。数据库查询是⽤结构化查询语⾔(SQL)编写的。使⽤ Dreamweaver 8.0 MX 附带的 SQL 创建器，⽤户可以在不了解 SQL 的情况下创建简单查询。不过，如果想创建复杂的 SQL 查询，则需要学习SQL 并⼿动编写输⼊到 Dreamweaver 8.0中的SQL语句。
按照如下的操作来建⽴“记录集”。
（1）打开需要使⽤记录集的ASP⽹页。
（2）单击“窗⼝”→“绑定”菜单命令，在打开的“绑定”⾯板中单击(+) 按钮，然后从弹出式菜单中选择“记录集(查询)”命令。
（3）弹出“记录集”对话框。⾸先为记录集命名，默认情况下系统会命名为“Recordset+数字”，如要更改，在“名称”后的输⼊框中重新输⼊即可；其次要在“连接”后的下拉列表中选择已经创建的数据库连接；然后在“表格”下拉列表中选择要对数据库中的哪个表进⾏查询；然后再选择要查询表中的那些列，如果选择“全部”单选框，则表⽰要对表格中所有列进⾏查询，如果选择“选定的”单选框，则可以结合Ctrl键选择所需要查询的列；最后还可以对查询进⾏筛选和排序。
（4）对于“记录集”最后的查询效果，可以随时单击“记录集”对话框上的“测试”按钮来进⾏预览。如果预览的效果与所预期的不⼀致，可再更改，直到满意为⽌。
测试记录集
（5）以上仅仅是利⽤Dreamweaver 8.0 附带的 SQL 创建器，⽤户可以在不了解 SQL 的情况下创建简单查询。如果你想创建复杂的 SQL 查询，则需要学习 SQL 并⼿动编写输⼊到Dreamweaver 8.0中的 SQL 语句。单击“记录集”对话框上的“⾼级…”按钮，则可以切换到⾼级SQL创建器对话框中，在“SQL”后的⽂本框中可以⼿动编写复杂的SQL语句。
（6）确定后，可以看到“绑定”⾯板中出现了定义的“记录集”。该“记录集”只能使⽤在当前打开的页⾯中，重复上述步骤可以为当前动态⽹页建⽴多个“记录集”。
单击“⾼级…”按钮可以切换到⾼级SQL创建器
9.2.3 显⽰数据库中的数据
“记录集”建⽴好之后，就可以在⽹页中添加动态内容了。⾸先介绍怎样在动态页中显⽰数据库中的数据。
（1）打开要编辑的⽹页，在绑定⾯板中如没有定义“记录集”，则按照前⾯所述进⾏添加。
（2）在页⾯上建⽴⼀个两⾏四列的表格，在第⼀⾏分别填上：“姓名”、“⽣⽇”、“所在城市”和“电⼦邮件”，这些是在页⾯上显⽰的数据库字段名称。
（3）选择在⾯板中展开的字段，我们先选择“姓名”字段，然后在表格的第⼆⾏第⼀列点击⿏标，使光标在其中闪动，然后回到“绑定”⾯板，点击插⼊按钮。还有个更为简单的⽅法，就是你可以拖动字段到要放置的地⽅，效果是⼀样的。
（4）重复上步操作，依次将⽣⽇，所在城市和电⼦邮件字段都放置在对应的单元格中。将现在这个⽹页保存上传后在浏览器中浏览，会发现数据库中的内容已经出现了，但是只有⼀条记录，需要添加服务器⾏为来显⽰其它的记录。
图8-2-9 创建表格图8-2-10 插⼊动态⽂本
（5）单击“窗⼝”→“服务器⾏为”菜单命令，会弹出“服务器⾏为”⾯板。我们的⽬标是将更多或者是所有的记录都显⽰在页⾯中，⽤服务器⾏为可以实现。
（6）选择页⾯中表格的第⼆⾏，再单击“服务器⾏为”⾯板中的（+）按钮，在下拉菜单中选择“重复区域”，在随后弹出的“重复区域”对话框中选择“所有记录”单选按钮，如果你不想在页⾯中将所有记录全部显⽰也可以选择上⾯的单选按钮，在⽂本框中输⼊希望显⽰的数量。按“确定”按钮返回。在“服务器⾏为”
标签中⼜多出现了⼀个⾏为，必要时可以双击该⾏为名称，重新打
开“重复区域”对话框，进⾏修改。这样就实现了多条记录在页⾯中的显⽰。
（7）如果数据库表中记录很多，可以在页⾯中加⼊导航条并显⽰导航状态，以⽅便浏览数据。使光标的位置处于先前建⽴的表格下⽅，然后单击“插⼊”⾯板左端的下拉箭头，选择“应⽤程序”项，再单击“记录集分页”按钮，选择“记录集导航条”。
类似的，我们可以在页⾯中显⽰出导航状态来。单击“应⽤程序”⾯板中的“记录集导航状态”按钮，可以弹出对话框，确认后可看到页⾯的效果。
此时，在“服务器⾏为”⾯板中添加了多个服务器⾏为，双击相应的⾏为，可以进⾏必要的修改。
⾄此，⼀个相对完整的数据库显⽰的动态页⾯制作完成了。还可以采⽤修饰静态⽹页的⽅法，将这个动态页修饰得更漂亮⼀些。
9.2.4 向数据库中添加数据

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。