实训四 设计用户系统的注册及登录.docx

实训四 设计用户系统的注册及登录.docx

《实训四 设计用户系统的注册及登录.docx》由会员分享，可在线阅读，更多相关《实训四 设计用户系统的注册及登录.docx（19页珍藏版）》请在冰豆网上搜索。

实训四设计用户系统的注册及登录

实训四设计用户系统的注册及登录

一、实训目的

1.能正确设计用户注册程序。

2.能正确设计用户登录程序。

3.能正确设计用户的管理程序。

二、工作任务

任务1：

将静态注册页面转换成动态ASP文件页面，设置表单对象。

任务2：

为网页设置引用文件。

任务3：

为注册页面编程，实现对填写的注册信息进行判断的功能，并将注册信息写入数据库。

任务4：

为登录页面编程，实现登录功能，并出现欢迎用户登录的界面。

三、实训步骤

（一）编程实现用户注册功能

首先创建注册界面

图1注册界面

任务1操作方法：

1）用dreamweaver打开前面我们所创建的动态网站，将项目三中所设计的静态注册页面reguser.html复制一份并改名为reguser.asp，其中注册部分页面如图2如所。

图2注册界面

3）选择标签，将其属性按图3修改，将表单名称命名为fom1，动作右侧的文本框中输入reguser.asp?

act=reg，其含义为此表单提交到本页处理，并附加参数act=reg，此参数含义为表单填写完成后提交表单进行注册的参数传递，方法右侧的列表中选择post，其它方面可以忽略。

图3表单属性

4）依照表1修改各个表单元素的名称，以方便程序的编写。

表1注册表单中各表单元素的名称

文本名称

表单元素名称

文本名称

表单元素名称

用户名

f_user

固定电话

f_tel1

f_tel2

密码

f_code

手机号码

f_mtel

姓名

f_name

其他联系

f_contact

性别

f_sex

提交

submit

详细地址

f_addr

重置

reset

设计思想：

当用户输入注册信息时，如果用户名或密码没有填写时系统出现提示信息“用户名或密码不能为空！

”，并将重新注册；

如果用户名在数据库中已经存在通过判断语句系统会有弹出提示信息“用户名已经存在，请重新注册！

”，本教材的其他信息并不要求必须输入，读者可以自己设计；

将用户信息写入到数据库的tbl_user表中保存，注册成功时会有弹出信息“注册成功！

”，单击“确定”按钮将跳转到登录页面可供用户登录，如果注册失败弹出提示信息，并说明注册失败的原因。

任务2操作方法：

1）先创建一个数据库连接文件db.asp，代码：

<%

dimconn,dbpath

setconn=Server.CreateObject（"adodb.connection"）

DBPath=Server.MapPath（"db/tygasp.mdb"）

conn.Open"Provider=Microsoft.Jet.OLEDB.4.0;DataSource="&DBPath

%>

2）打开网页的代码视图，我们在网页的最上部添加代码如下的代码如图4所示，由于数据库连接文件我们在项目五中已经完成，本项目只要使用

--#includefile="db.asp"-->语句将其引用到本页面中即可，以后的网页中也是一样：

图4引用文件部分

代码讲解：

<%@language="vbscript"%>'声明使用vbscript脚本

<%optionexplicit%>'限制本页面引用的变量都需要定义

--前台用户注册-->'前台用户注册注释

--#includefile="db.asp"-->'引用数据库连接文件

--#includefile="config/function.inc.asp"-->'引用自定义函数文件

3）注册网页参考代码：

在标签后面加入如下代码，以实现注册数据的处理代码，我们编程处理参数时总是在网页的开始进行，这样如果数据有改变马上就会在下面的代码上表示出来。

将表单注册信息存入tbl_user表

关闭记录集和清空记录集

出错后继续执行

判断用户名和密码是否为空

判断是否有同名用户

设置固定电话格式

注册是否成功的提示信息！

至此，注册页面的功能已经完成，按F12浏览网页并进行注册测试，如按图5进行注册，单击“提交”按钮，将出来图6注册成功的提示信息，单击“确定”按钮将跳转到登录界面，如果最用相同的用户名进行注册，将来出现图7的对话框，单击“确定”按钮返回注册界面，如果我们没有输入用户名或密码时将会出现图8对话框，单击“确定”按钮返回注册界面。

图5用户注册

图6注册成功图7用户名存在图8用户名或密码为空

设计思想：

当用户提交输入注册信息也就是提交表单动作参数act=”reg”时，如果用户名或密码没有填写时系统出现提示信息“用户名或密码不能为空！

”，并将重新注册，否则进行用户名的判断，如果用户名在数据库中已经存在，判断语句会弹出提示信息“用户名已经存在，请重新注册！

”，所有判断合法之后将注册信息写入数据库，注册成功时会有弹出信息“注册成功！

”，单击“确定”按钮将跳转到登录页面可供用户登录，如果注册失败弹出提示信息。

（二）实现用户登录功能

用户登录参考代码：

1）将公司主页index.html更名为index.asp，并将登录表单动作改为"index.asp?

act=login"，表单元素用户名改为f_user，密码改为f_code。

2）将引用文件添加到网页上方，如图9所示。

创建recordset对象

图9index.asp引用文件部分

3）用户登录部分，登录前是一个表单，如图10所示，登录后要显示用户登录的信息，如图11所示。

图10登录界面图11用户登录信息

以下代码实现了此功能，代码及说明如下：

如果session变量不空显示用户登录信息及退出登录

如果session变量为空表示未登录显示登录表单

4）在标签后面添加用户登录和及用户注销信息的处理代码，代码及说明如下：

注销登录后，用户名和密码的session变量赋值为空

关闭对象

判断用户注销登陆信息

查询成功后，用户名和密码分别赋值给session变量

查询数据库中是否有相应的用户名和密码

判断用户提交表单登陆信息

5）在前面加下以下代码：

清空记录集

关闭记录集

清空对象

至此登录功能设计完成，按F12进浏览测试，输入我们上次注册的数据，登录后将出现如图11所示的欢迎信息，如果用户名或密码有错，将会出现图12所示的弹出信息，单击“确定”按钮，返回登录页面。

图12登录失败弹出信息

设计思想：

1．在主页中用户登录前将出现登录界面，登录后由欢迎用户的界面代替原来的表单界面，如“欢迎您，某某”，并具有退出登录的功能；

2．登录数据必须是已经注册过的信息，否则会出现“登录失败，用户名或者密码错误！

”的提示信息。

（三）设计用户系统的后台管理

1.显示用户的网页及编程

显示用户部分操作方法：

1）制作如图13所示显示用户的表格网页，可以显示用户的注册信息，取名为admin_user.asp。

图6.12显示用户界面

2）切换到代码视图，在网页的顶部输入代码，以引用前面的数据库连接、自编函数及定义变量等，方法如模块1的任务，如图6.13所示。

图13引用文件及自定义变量

3）在中添加显示用户信息的功能代码，如下：

定义recordset对象rst变量，降序排列显示用户列表，并将查询结果存入rst变量里

循环读取rst变量里的用户信息，并显示在相应表格的单元格中。

Rst对象指针下移读取下条记录

关闭、清空记录集

添加代码和的网页设计视图如图14所示。

图14添加代码后的设计视图

4）如果我们要对用户进行修改或删除，首先设计修改和删除网页，然后设计参数的提交即可，我们放到后面进行。

按F12浏览即得到用户的资料以倒序显示，如图15所示。

图15用户资料显示

5）要完成用户的修改及删除，需将“修改”和“删除”的文本超链接到处理修改的文件上。

代码如下：

超链接文件，指定传递参数，修改和删除具体的id号用户

（一）修改用户的网页及编程

修改用户操作方法：

1）如图16所示制作一张显示表单网页，用来修改用户的注册信息，取名为admin_user_modify.asp。

图16修改用户表单网页

2）选择标签，将表单属性按图17设置，将表单名称命名为form1，动作右侧的文本框中输入

“admin_user_modify.asp?

act=update&id=<%=request.querystring（"id"）%>”，其含义为此表单提交到本页处理，并通过用户id进行修改，方法右侧的列表中选择post。

图17修改表单属性的设置

3）设置表单属性，表单及表单元素的命名与我们前面的注册网页基本相同，见表2所示。

表2修改用户注册信息单元素的名称

文本名称

表单元素名称

文本名称

表单元素名称

用户名

f_user

固定电话

f_tel

密码

f_code

手机号码

f_mtel

姓名

f_name

其他联系

f_contact

性别

f_sex

提交

submit

详细地址

f_addr

重置

reset

4）考虑到用户名不能修改，直接显示就行，输入代码后的网页结构视图如图18如示。

图18添加代码后的修改表单

判断参数act是否与modify相等

当点击“修改”超链接里，传递参数act=modify运行admin_user_modify.asp中显示修改用户资料的表单，此表单的实现代码如下：

判断数据的合法性，查询记录

表单处理方法

读取用户信息

将密码赋为初始值

5）当提交修改用户表单后，传递参数act=update表示需要运行admin_user_modify.asp中的修改用户信息代码，代码加入到后“显示需要修改用户信息表单”之前，代码如下：

错误处理

判断参数是否正确

将表单注册信息更新存入tbl_user表

（三）删除用户的网页及编程

任务3操作方法：

1）新建一张删除网页命名为admin_user_del.asp，此网页通过用户id删除其用户信息。

引用文件添加到网页上方，切换到代码视图，代码如下。

删除信息

错误处理

判断参数是否合法

2）按F12浏览测试。

注意，为了删除安全，我们应该在删除用户信息时弹出一条提示信息，这儿可以采用一条js的代码来完成，如"targer="_blank"onClick="javascript:

returnconfirm（'您确定要删除此用户吗？

'）;"。

（四）查询用户的网页及编程

任务4操作方法：

1．如图6.18所示制作一张查询用户的表单网页，取名为admin_user_ask.asp，并设计表单属性，表单名为form1，文本框命名为f_user，动作右侧的文本框中输入“admin_user_ask.asp”，其它为默认。

并制作一表格用来显示查询用户信息的列表。

图6.18用户查询界面

2．切换到代码视图，在网页的顶部添加数据库引用文件及自编函数文件等。

提取表单用户名文本框f_user信息存信变量u

3．

根据变量u模糊查询用户个数

统计查询用户的个数存入recordset对象

根据变量u模糊查询用户信息，并降序排列

五、实训总结与分析：

对照实例认真分析产生差异的原因，并说明在实训过程中如何解决，所遇到的技术或知识上难题，同时得到了什么样的经验，并在以后的过程中加以注意。

还有什么问题是你不能解决的。

本人认为有所心得和有必要记载下来的内容。