学习导读
通过第3章，我们生成了新的页面，浏览之后，是不是感觉很满意，如果感觉不错，那就说明页面处理过程已经掌握，但还不是高兴的时候，因为生成的页面部分，只是网站建设的开端，真正的建站历程还很漫长，分别要实现用户的注册、登录、文章的管理、留言板的制作、BBS的生成及购物页的生成等。这些功能的实现是要在代码视图下完成的。书写代码、编写程序，贵在思路清晰，如果思维混乱，就会出现错误，特别是当错误找不出来时，那种痛苦是很煎熬的。
那么这一部分是不是很难？确切地说，只要掌握了方法，问题并不是很难，但切记要跟着本书一步一步来做，并及时进行反思总结。经过几段代码的书写，你会迅速进入代码创作中，一旦这种思维形成后，这部分内容就会变得轻松起来，网站建设就会提升到一个新的高度。
掌握新知：Dreamweaver的使用和ASP语法要点；
操作重点：注册表单的构成、数据库的结构、登录设计及验证码的显示设计等；
难点把握：验证码功能的实现、数据库的连接及不同登录情况下功能的实现。
大音希声，大象无形，还是赶快行动吧……
静态页面生成后，就要为页面添加各种功能，比如网站的登录、注册、文章的搜索、显示文章和上传图片等，同时还要对网站的内容添加管理功能并能实现网上购物、BBS论坛和留言板等，这些功能的实现都需要一定的代码来完成。本书是基于ASP技术来完成上述功能的。从这一章起将分别向大家介绍这些功能是怎样实现的，静态页面又是怎样动起来的。
注册页面构成（1注册页面所要实现的效果如图4-10所示。
图4-10
1．<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%> |
代码释义：
第7~19行，为定义的样式，分别对表单内的文字颜色、表单域背景进行设置。
第22行和第52行，分别引用了网页的页头和页脚两个独立的网页。
第23~51行，在表格内写进了表单，分别包含了用户账号、密码、密码确认、电子邮件、个人主页及个人简介等。对表单各项一定要命好名，这是下面提交后变量获得的值，而这个值是要写入数据库的。这里要引起大家注意的是，由于在网页页头与页脚中是由切割生成的网页，它的列数都是固定的，我们在加入新的表格时，为了使所加的内容正好居中，可以采用在两侧分别定义空的列并定义其宽度，然后在中间的列中嵌套一个表格的方法，而使其对齐到中间，如第25、26及51行；
第44~48行，嵌套了一个表格，用来使【提交】与【重置】按钮对齐到网页中间。
一点通 嵌套表格中要注意的
嵌套表格是制作网页必不可少的内容，大家在使用嵌套表格时，一定要思路清晰，最好有个草稿，这样在具体制作过程中，就不会显得混乱。另外在分析表格时，也要先在浏览器中观看效果，然后再回过头来分析，也可在设计视图下来观看，不过一旦有包含页在里面，则这种显示效果就不会再看到，因此对嵌套表格的写入一定要仔细认真，这样才会使制作效率不断提高，否则一旦发现问题再回过头来在代码视图下观看表格，对谁来说都是很困难的事情。
4.2.2 注册页面构成（2）
创建好数据库后，接下来就要向数据表中添加数据，其数据来源就是表单的内容。添加数据就是对表单内容进行提交，并根据条件对表单的内容进行处理。类似于注册这种提交表单的数据处理，相对比较简单，可在一个网页内完成，因此可对上面的register.asp页面代码进一步完善，加进一些内容，使数据的提交能够顺利完成，其完整的代码构成如下。
1．<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%> 89．<% |
代码释义：
第一，注册表单输入内容设计了很多项，而每次注册时，不一定要求把这些项都填上，但对其中几个重要项，如用户账号和密码等要求必须填写，一旦重要项没有填写，则有相应的提示加以说明；第二，注册的内容已经被写入数据库，因此必须建立好与数据库的连接；第三，一般来讲，一个网站内网页数量越多，越会影响到网站的速度，因此在建立网页时要尽量减少网页数量，这也是为什么把注册表单提交所链接的网页设为本页的原因。经过这样分析之后，下面对代码一一说明。
第10~30行定义了一个函数，主要是为提交表单而设计的，当提交表单时，如果用户的账号、密码和验证密码没有被填写，就会弹出一个对话框，提示一定的信息。当单击【确定】按钮后，返回到本页，继续填写。其中“if reg.user.value="" then jhf="请输入用户账号！"reg.user.focus”语句的意思是，如果表单（reg）的用户（user）的填充值（value）为空，那么定义的变量就会显示“请输入用户账号”，当单击【确定】按钮后，光标会停在user框内。那么这句话怎样才能显示在弹出的窗口上呢？其实这句话的显示在第24~29行，即：
? if jhf="" then表示设置一个如果句，作为判断，即当所设置的变量值为空时。
? reg_onsubmit=true表示表单中的【提交】按钮可用，即可以提交。
? else表示如果不为空。
? alert(jhf)用于显示变量中的内容（这是JavaScript语句，表示弹出窗口，括号中的内容就是弹出窗口显示的内容）。
? reg_onsubmit=false，表示当有弹出窗口时，表单的【提交】按钮不可用。
除了用定义函数的形式来设置【提交】按钮外，还可以用其他的方法来完成，如用JavaScript语句完成的【提交】按钮代码如下。
1．onSubmit="javascript:if(document.reg.user.value=='') |
这段代码可以写在表单的第一行，即<form…>内，解释如下。
当提交表单时，用JavaScript书写语句，判断当前浏览器所浏览的网页（document），即当前网页中表单（reg）的输入框（user）的值（value）是否为空。这里要注意的一点是，在JavaScript中用的是两个等号。如果是空，则弹出窗口，显示“请输入用户账号！”；如果密码为空则显示“请输入密码”的弹出信息。其他几行与此类似。
以上关于【提交】按钮的代码，希望大家要理解并掌握好，以后凡涉及注册、登录和留言等有关提交内容的都可以进行套用。
下面看代码第32~45行，这是定义的样式内容，主要是在CSS中定义的，有类和标签，类可直接引用，如class="jt3"，标签定义好之后，在浏览器中可直接显示出来，如
input {
|
上面的CSS定义了在输入文本框中，设置输入背景的颜色，如果设置的只在本页中，则在该网页中所有文本输入背景均为同一种颜色。CSS定义的样式既可在当前网页中使用，也可存成文件，在不同网页中引用。有关CSS的用法，在前面的基础知识中已学过，这里不在赘述。
下面看第48和49行，这两行包含了两个文件，第48行是网页头，第49行是包含一个数据连接，要想把表单提交的内容写入数据库，必须与数据库构成连接。
与Access数据库的连接方式有以下3种方法。
第一种：DSN-LESS连接方法。
set conn=server.createobject(“adodb.connection”) |
第二种：OLEDB连接方法。
Set conn=server.createobject(“adodb.connection”) |
第三种：ODBC连接方法。
Set conn=server.createobject(“adodb.connection”) |
这个包含的网页在网站目录下的位置如图4-15所示。
conn.asp页面的代码构成如下。
1．<% |
这里要解释的是server.MapPath，即获取文件的绝对路径，如果在这里直接写文件的绝对路径，一是不安全，二是在网站文件移植时修改起来不方便，因此要采用这种形式获取绝对路径。
第51~57行，从浏览器获得表单提交的数据，request获得数据的方法有form和querystring，前者表单的传递方法为post，后者是get传递方法，另外在表单传递数据时，由问号后传递的值也要由querystring方法获得，如pargent.asp?cj=1，user=request.Form("user")是获得表单中用户输入的账号，其他类似。
第58行，设置了一个判断语句if，这个语句的意思是如果获得的用户名为空，则显示表单中的信息。
第60~88行，注册信息，由表单来完成，这个表单写在表格里，这样便于对表单的控制。
第90~118行，当获得的用户名不为空时，不为空不等于这个用户就可成为注册用户，因为还存在着重名的问题，所以在这层判断中首先加入了一个二层判断即第91~117行，这层判断是对数据进行查询，其条件就是where user='"&user&'"，查询的方法是遍历数据表中的每条记录，如果查询没有到最后即if not rs.eof ，则说明所输入的用户名在数据库中已经存在，则要求用户重新填写账号，如果循环到结尾，则说明这个账号还没有人用过，可以用来注册，即建立SQL语句。因为是向数据表中添加数据，所以用到的语句为insert into…形式，插入的语句为：
sql=insertintouser(user,password,password1,email,homepage,intrduce)values |
书写插入语句代码时，要注意每个values值，要根据所定义的数据类型来写，否则容易出错。在数据库中，定义的数据类型都是文本型，对于文本型的数据类型，在添加时，要对所添加的值加定界符，由于外边有双引号，所以里边的要用单引号，同时获取的都是变量，要用连接符把它们连上。大家在写这段代码时可能由于定界符、连接符很多，容易出差错，这里给大家一个简单的方法：在每个添加的值内都先成对地写好各种符号，如在写user这个变量时，就可以先写上“"”，然后在单引号中间加上双引号，即“'""'”，之后在双引号中加上连接符，即“'"&&"'”，最后在连接符中间写上变量，即“'"&user&"'”，接下来再写第二个时，先把逗号加上，然后再按上面的顺序依次写出，一般这种情况下出错的可能性很小。
另外大家要注意第104行，这行是把查询语句关闭，为什么要关闭呢？因为对于SQL语句，“rs.open sql,conn,1,1”这种形式并没有完全打开数据库，而采用do while not rs.eof这种循环，则完全打开了数据库，对于完全打开的数据库，当再次打开时，必须要先关上，否则程序就会出错。
当用户把填写的信息提交，并存储到数据库后，用户就可以登录到相关的网页，如论坛等，但当用户关闭该网页，并在很短的时间内回来再想进入该网页时，用户还需要登录并确认后才可进入网页，每次都这样做，显得略加烦琐，那么有没有办法让用户登录一次，可以在一段时间内不过期呢？答案是肯定的，即把用户注册或登录信息存入用户的本地硬盘上，并给予一定的时间限制，也就是说，当用户注册成为正式用户后，就可以登录网站的BBS或聊天室，并在限制的时间内不必再一次登录认证。怎样才能实现这种功能呢？采取的办法就是建立cookies，即第106~110行。cookies是嵌入客户机中用以标识用户的标记。cookies既可以创建单键值，也可以创建多键值，即cookies字典，本例中创建的是cookies字典。字典名为log，并设有两个子键，分别为user和password，这两个键值分别是从表单中获取的数据。建立cookies后，要设置它的过期时间，一般过期时间都是从注册时间或登录时间开始，即从现在开始，所以大家一定会想到now()。为了实现这个目的，需要用到一个函数dateadd，即返回已添加指定时间间隔的日期，它后边有3个参数，如dateadd(interal, number,date)。interal是个字符串，表示添加时间间隔（YYYY表示年，Q表示季，M表示月，D表示日，WW表示周，H表示小时，N表示分，S表示秒），Number表示增加的时间，date表示返回的当前时间。如dateadd(''n'',10,now())，表示时间从现在起增加10分钟。本网站设置的cookies过期时间为20分钟。
4.2.4 登录页面的生成
登录页面一般由用户账号和密码构成。很显然这是一个提交表单，现在在大多数论坛登录中都加入了验证码，而验证码大都是由现成的图片构成的，因此可以把它单独做成一个页面以嵌入的形式加入到登录页面中。对于账号、密码及验证码都要求不能为空，所以要加入判断语句，与数据库中的用户信息进行比较。而一旦登录成功，则可直接进入下一个页面或链接进入下一个页面。
登录页面所在的文件名为log.asp，其预览效果如图4-16所示。
<iframe scrolling="no"src="log.asp" name="i_log" frameborder="0" |
1．<table cellpadding="2" cellspacing="4" align="center"> |
代码释义：
一般来说，表单都要写在表格中，这样表单的位置就很容易控制，而且有时可以在表格中嵌套表格。第1~12行就是一个大的表格。
第2~11行是一个表单，第2行是表单的标记，包括表单的action、method及name。action是表单提交处理程序的链接，也就是单击【提交】按钮后，表单指向哪个网页。method是表单处理数据的方法，共分为post和get两种。用post传递的数据量要大一些，而且在获取数据时是以form形式接收的，如request.form("")形式。如果以get形式传递，则一般来说传递的数据量要有所限制，一般在1KB以下，而且以该形式传递数据时，在获取数据时是以querystring形式接收的，如request.querystring("")。当然对于以问号形式传递的数据在接收时，也要用querystring形式接收，如qsdd.asp?id=<%=rs(" xm ")%>。在获得id时，就要用到querystring，如：
<<% |
但需要注意的是，如果链接的内容以问号的形式传递了变量，则会在地址栏内显示出相关信息，因此安全性会有所降低。对于重要的数据，可以通过建立隐藏域来进行传递。关于这方面的内容，后边将会介绍。
第3~4行为用户名输入域设置。<input type="text" name="user" class="jt1" size=16 />是表单输入域，type表示类型，它可包括text、 password 、submit、 reset 、checkbox 、image、radio 和hidden等8种类型，分别是文本、密码、提交、重置、复选框、图像域、单选按钮及隐藏域。对于每个输入域的命名是很有用的，大家在命名时一定要有规律，否则一旦网页较多，而且需要在表单之间传递数据时，如果对命名所包含的意思不太了解，在具体应用时会很费事。
在第10行，“ ”代表的是空格，两个代表一个汉字。为了使文字对齐工整，我们可以用空格来代替文字，如密码之间的两个空格就是如此。class="jt1"这是定义在CSS中的样式，定义好了之后，在具体标记中进行调用。样式定义的结果如图4-17所示。
 |
| 图4-17 |
在定义文本框大小时，由于类型不同而使两个文本框大小不一致，可以使用style来设置，示例如下。
<tr><td>用户名：<input type="text" name="username" style="width:3cm" /></td></tr> |
以上是登录表单的制作，但只有表单是不能完成登录的，必须对所填写的内容进行提交，而且要加进一些判断，因此完整的登录表单代码还应包括一些其他的内容，其代码构成如下。
1．<body> |
代码释义：
登录页面要实现的功能是，当用户是注册用户时，如果输入的用户账号与密码都是正确的，则显示登录成功；如果用户已经登录，则在一定时间内，用户再次进入网页时，可直接进入到相关的网页，而不必再次登录。要实现这种功能，必须要用到在注册页面上设置的cookies内容。
第4行，“user=request.cookies("log")("user")”语句用于取得cookies中的值。
第5行，使用一个判断语句，如果获取的cookies值为空，则有两层含义，其一你是注册用户，但还没有登录，是第一次打开网页；其二你根本就没注册过，至于结果，只有在提交表单时才能反应出来。
第7~24行，既然获得的cookies值是空的，无论什么情况，都显示登录表单，即显示用户名、密码及验证码的输入表单信息。
第9~11行，对用户提交表单的判断，即要求文本内容不得为空，即减小数据库的负荷。这是用JavaScript脚本语言写的。关于【提交】按钮的分析，前面已经介绍，这里不再赘述。
第22行，当用户单击【注册】按钮时，网页跳转到注册页面。
第18行，插入一个包含页，这个页用来书写验证码信息。这里需要说明的是，所谓包含页面就是把包含页的代码加到这一页中。之所以采用包含的形式，是使代码管理更方便，修改更容易些，同时在这一行，还加入了一个隐藏域。隐藏域传递了一个值，它是为了与所输入的验证码进行比较的。这一点希望大家能够掌握，这是数据传递常用的一种方法。
第26~30行，当cookies不为空时，则显示登录信息。
4.2.5 验证码页面的生成
在网页制作中，无论登录论坛还是聊天室，都加入了验证码信息。在通常情况下，验证码都是由4位数字或4个汉字组成的，每刷新一次更换一次。无论数字还是汉字，其实都是做成的图片，它们唯一不同的是数字只要做成10幅图片即可，而汉字则要做得多一些，否则在随机变换中获得同样汉字的概率就要高些。
由于每次获取的图片都是不同的，所以首先想到的是随机数的应用，其二是图片做成后，怎样获取这些图片。其实只要把做成的图片存放在数组中，当需要的时候，每次提取出4个，这样就会形成连续的图片。而所谓的验证就是看在定义的文本框中所输入的内容与显示的图片内容是否相同，不相同，或者是错误的，则重新输入，直到正确输入才可以登录。
本网站的验证码使用的是数字，因此，首先要利用软件制作10幅图片（本书中的图片是用Flash制作的，大家对其他软件使用较熟悉，可以用其他软件来完成，另外本网站所需的各种动画均用Flash制作完成）。如果是文字，可以做得多一些。做好的图片存成gif格式，并要单独存储在网站根目录下的单独文件夹内，如图4-18所示。
验证码页面所在的文件是yanma.asp，其代码构成如下。
1．<% |
代码释义：
根据上面分析，这段代码就比较容易理解。
第2~4行，在网页中首先定义一个数组，并设置数组中各元素的值，各值即各个图片，每个图片一定要带好路径，因为要把提取数组中的值作为图片的源路径，所以图片的路径一定要写准确，否则就会显示错误。
第5~10行，使用一个for循环，由于在验证信息中只显示4张图片， 所以for循环语句的I值从1~4，即提取数组中的4个元素。因为是随机提取，所以首先要建立一个随机数生成器randomize，即第6行，然后用Rnd函数，返回一个大于或等于0而小于1的随机数，为了使返回的值符合要求，需要用到一个获取随机数的公式：int（(最大值－最小值+1)＊rnd()+最小值）。因为在这里获取的是一位数，所以最大的一位数是9，最小的是0，所以获得的随机数为jt1=int(10*rnd)，即第7行代码。将这个随机数作为数组的索引，这样就可以获得数组中的值，即jt(jt1)，将它作为图片的源，即src="&jt(jt1)。
由于是提取了4次，需要把这4个图片累加起来，累加的形式可以用lyp=lyp&jt1，这样lyp这个变量就是最后4张图片。
分析到这里，再返回到log.asp代码页面的第18和19行，即<input type="hidden" ，name="c_yan" value="<%=lyp%>" />，用一个隐藏域传递了<%=lyp%>的值，而<%=lyp%>的值正是随机数值的叠加，当网页提交时就可以与输入的文本内容进行比较了。
经过以上分析，下面看一下登录页面提交后是怎样处理的。提交后的URL网页名称为lognext.asp，其代码构成如下。
1．<!--#include file="include/conn.asp"--> |
代码释义：
第1行，包含一个数据库的连接文件。
第3行，定义变量。
第4~7行，获得表单中提交的数据。
第8和9行，进行SQL语句查询。
第10~22行，是一个判断语句。
第10行，如果输入的用户存在，而且所输入的验证信息（yan）与隐藏域所传达递的信息（c_yan）相等时。
第11~15行，将信息写入cookies内，并设置过期时间。
第16~18行，在浏览器上显示“欢迎用户进入青春在线”字样，因为log.asp网页是以内部框架的形式嵌套在index.asp中，所以显示的内容就在index.asp的嵌套位置。
第19~22行，是前面判断语句的后半部，如果用户名不正确，或验码不等，则返回，使用了JavaScript语句中的<a href='javascript:history.back()'>。
