《专题资料（2021-2022年）1用户管理系统建设.doc》由会员分享，可在线阅读，更多相关《专题资料（2021-2022年）1用户管理系统建设.doc（28页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、用户管理系统建设用户管理系统建设Index.asp用户登录模块找回密码修改资料模块新用户注册界面Register.aspRefail.aspRegok.aspLoginfail.aspWelcome.aspLostpassword.aspUserupdate.aspShowquestion.aspShoupassword.aspUserupdateok.aspLogoot.asp一、系统整体规划（一）（一）页面设计规划页面设计规划在本地站点建立站点文件夹 member。其下将创建的文件夹及文件如图所示（二）（二）网页美工设计网页美工设计本例采用“拐角型”布局结构。美工设计效果如下。素材可自己制
2、作，也可使用我发给大家的。二、数据库设计与连接（一）（一）数据库设计数据库设计通过功能分析发现，数据库应该包括注册的用户名、注册密码以及一些个人信息，如性别、年龄、E-mail、电话等。所以数据库中应该包括上述信息的表，称之为“用户信息表”。本实验中将数据库命名为 member，创建的用户信息表member 如图所示。数据设计库表 user 的字段组成结构如下：下面介绍在 ACCESS 中创建数据库的方法和步骤。1.新建空白数据库；2.保存为 member.mdb，保存类型中选择“Microsoft office access 2002-2003 数据库”，是为了让数据库通用；3.在空白数据库
3、中建立新的“数据表”，另存为“表名称”为 member。4.按照字段的名称和属性进行设置。5.打开 member 数据表，可以再其中预先编辑一些记录对象，其中 admin 的权限（authority）值为 1，其余用户的权限为 0，即为一般用户。6.编辑完成，保存，关闭，数据库和存储用户名和密码等资料的表建立完成。（二）（二）创建数据库连接创建数据库连接具体步骤：1.依次单击“控制面板”|“管理工具”|“数据源（ODBC）”|“系统 DSN”命令；2.单击添加按钮，在“创建新数据源”对话框中选择 Driver do Microsoft Access(*.mdb)选项，如图3.单击完成按钮，打开
4、“ODBC MicrosoftAccess 安装”对话框，在“数据源名（N）”文本框中输入 dsnuser，如图4.单击选择按钮，找到需要找到的数据库。5.确定之后，完成系统 DSN 的设置。6.启动 dreamweaver，在网站根目录下新建一个名为 index.asp 网页并保存7.设置好“站点”、“文档类型”、“测试服务器”，在 dreamweaver 中执行菜单“窗口”|“数据库”命令或者快捷键 shift+ctrl+F10，打开“数据库”面板，单击添加按钮，选择“数据源名称（DSN）”。8.在这个对话框中，在“连接名称”中输入 user，单击“数据源名称”，在其中选择 dsnuser
5、，其他默认，确定完成。9.同时在网站根目录下将会自动创建名为 Connections 的文件夹，该文件夹内有一个名为 user.asp 的文件，可以用记事本打开。10.保存文档，完成数据库连接。三、用户登录模块的设计（一）（一）登陆界面登陆界面在用户访问该用户管理系统时，首先要进行身份验证，这个功能是靠登录界面来实现的。所以登陆页面中必须有要求用户输入用户名和密码的文本框，以及输入完成后进行登录的“登录”按钮和输入错误后重新设置用户名和密码的“重置”按钮。详细制作步骤如下：1.首先来看一下用户登录的首页设计，如图。2.index.asp 页面是用户登录系统的首页，打开前面创建的 index.a
6、sp 页面，输入网页标题“帆云购物中心”，然后执行菜单“文件”|“保存”命令将网页标题保存。3.执行菜单“修改”|“页面属性”命令，然后在“背景颜色”文本框中输入颜色为#CCCCCC，在“上边距”文本框中输入 0 像素，这样设置是为了让页面的第一个表格能置顶到上面，并形成一个灰色的底纹的页面，设置如图。4.设置完成后单击“确定”按钮，进入“文档”窗口，执行菜单“插入”|“表格”命令，在打开的“表格”对话框中，设置 3 行 3 列的表格。表格宽度为 775 像素，边框粗细、单元格边框和间距都为 0，如图。5.单击确定，完成表格插入。将鼠标设置在第 1 行表格中，在“属性”面板中单击合并单元格，将
7、第一行表格合并，再执行菜单“插入记录”|“图像”，选择图片“01.gif”，如图。6.单击确定，完成图片插入。鼠标放置在第 3 行表格中，合并单元格，将第 3 行表格合并，插入图片“05.gif”，如图。7.选择整个表格，在“属性”面板中，选择“对齐”为“居中对齐”，如图。8.把光标移至创建表格第 2 行第 1 列中，在“属性”中设置高度为 456 像素，宽度为 179 像素，在垂直中选择“顶端”，再将光标移至这一列中，单击“拆分”按钮，在中加入 background=”/images/02.gif”，效果如图。9.在表格的第 2 行第 2 列和第 3 列中，分别插入同站点 images 文件
8、夹中的图片 03.gif 和 04.gif10.单击第 2 行第 1 列的单元格，单击“文档”窗口上的拆分按钮，在和之间加入 valign=”top”（表格文字和图片的相对摆放位置，可选值为 top、middle、bottom）。11.单击“文档”窗口的“设计”按钮，在刚创建的表格的单元格中，执行菜单插入表单命令12.将鼠标放置在该表单中，执行菜单“插入记录”|“表格”，打开“表格”对话框，行数 5，列为 2。表格宽度 179像素。单击并拖动鼠标分别选择第 1 行和第 5 行表格，单击合并按钮进行合并。在第 2 行第 1 列中输入文字说明“用户名”，第 2 行第 2 列中执行菜单“插入记录”|
9、“表单”|“文本域”，插入一个单行文本域表单对象，并定义文本域名为“username”，“文本域”设置如图所示13.第 3 行第 1 列表格中输入文字“密码”，在第 3 行表格的第 2 列中执行“插入记录”|“表单”|“文本域”，定义文本域名为“password”，“文本域”设置如图所示14.选择第 4 行单元格，执行“插入记录”|“表单”|“按钮”命令两次，插入两个按钮，分别更改属性变更，一个是登录时用的“提交表单”选项，一个是“重设置单”，“属性”的设置如图15.在第 5 行输入“注册新用户”，并选择这几个字在窗口栏中选择“插入”|“超级链接”，并设置一个转到用户注册页面 register
10、.asp，效果如图16.忘记密码可以找回密码，在表格第 5 行中输入“找回密码”，并设置一个转到密码查询页面 lostpassword.asp 的链接对象17.表单编辑完成之后，来编辑网页的动态内容，使用户可以通过该网页中表单的提交实现登录功能。打开“服务器行为”面板，单击添按钮，执行菜单“用户身份验证”|“登录用户”，如图18.打开“登录用户”对话框，各项参数设置如图19.单击确定后，返回“文档”窗口。在“服务器行为”面板中就增加了一个“登录用户”行为，如图20.表单对象对应的“属性”面板的动作属性值如图所示，为，这是 dreamweaver 自动生成的动作代码。21.保存到本地站点，完成首
11、页的制作（二）登录成功和登录失败页面的制作登录成功和登录失败页面的制作登录如果不正确，就会转到 loginfail.asp 页面；如果登录信息正确，就会转到 welcome.asp 页面。1.创建新 ASP 网页并保存为 loginfail.asp 在网站根目录下，在“布局”下拉菜单中选择“无”，；2.登录失败页面设计如图所示。在文档中选择“这里”文本，加入超级链接指向 index.asp3.保存，完成创建下面制作 welcome.asp 页面1.创建新 ASP 网页并保存为 welcome.asp 在网站根目录下；2.类似的方法制作静态部分，如图3.执行“窗口”|“绑定”，打开“绑定”面板，
12、单击添加按钮，选择“阶段变量”定义一个阶段变量，如图所示4.打开“阶段变量”对话框。在名称中输入 MM_username，单击确定5.在文档窗口拖动鼠标选择“XXXXXX”文本，然后在“绑定”面板中选择 MM_username 变量，再单击“绑定”面板底部的“插入”按钮，将其插入到该“文档”的指定位置。完了就可以看到“XXXXXX”被Session.MM_username代替，如图所示6.在文档中选中“注销你的用户”文本。执行“窗口”|“服务器行为”|“用户身份验证”|“注销用户”7.打开“注销用户”对话框进行设置。“在以下情况下注销”用于设置注销，在本实验中选中“单击链接”，在右边下拉菜单中
13、选择“注销你的用户”“在完成后，转到”用于设置注销后显示的页面，在右侧文本框输入 logoot.asp，如图8.确定之后返回“文档”窗口。在“服务器行为”中就添加了一个“注销用户”行为，同时可以看到“注销用户”链接文本对应的“属性”面板中的“链接”属性值是，这是 dreamweaver 自动生成9.logoot.asp 的页面设置比较简单，不做详细说明，在页面的“这里”指定一个链接到首页 index.asp 就可以了，如图10.保存到本地站点。就可以进行测试该系统的执行情况了。文档中的“修改您的注册资料”链接到 userupdate.asp 页面，此页面在后面的修改中进行介绍。（三）（三）用户
14、登录系统功能的测试用户登录系统功能的测试制作好系统后，需要测试才能上传到服务器使用，步骤如下：1.打开 IE，输入 http:/127.0.0.1/index.asp，打开 index.asp2.在“用户名”和“密码”文本框输入，单击“登录”3.如果登录信息错误，就会转到 loginfail.asp4.如果正确，则显示登录成功页面。这里输入的是预设在数据库中的用户 admin，成功就会转到 welcome.asp5.如果想注销，只需要单击“注销你的用户”即可，就会转到 logoot.asp，然后单击“这里”回到首页。6.至此登录功能测试完成四、用户注册模块的设计该模块是实现新用户注册功能（一）
15、（一）用户注册页面用户注册页面用户注册的操作就是向 member.mdb 数据库的 member 表中添加记录的操作，如图1.创建新 ASP 网页并保存为 register.asp 在网站根目录下，在“布局”下拉菜单中选择“无”，2.在 dreamweaver 中使用静态页面的工具完成如图所示的静态部分，这里说明的是在注册时需要加入一个“隐藏区域”并命名为 authority，设置默认值为 0，即所有的用户注册的时候默认是一般访问用户3.还需要设置一个验证表单的动作，用来检查访问者在表单中填写的内容是否满足数据库中表 user 中字段的要求。在将用户填写的注册资料提交到服务器之前，就会对用户填
16、写的资料进行验证。如果有不符合要求的信息，可以向访问者显示错误的原因，并让访问者重新输入。4.执行菜单“窗口”|“行为”，打开行为面板的添加按钮，从打开的行为列表中选择“检查表单”，打开如图本试验中，设置 username、password、password1、answer、truename、address 文本域为“值：必需的”，“可接受：任何东西”，也就是说这几个文本域必填不能空；tel 和 QQ 文本域验证条件为“值：必需的”，“可接受：数字”，表示这两个必须填写数字不能为空；e-mail 文本域的验证条件是“值：必需的”，“可接受：电子邮件”，表示该文本域必须填写电子邮件地址不能为空5
17、.设置完成，点击确定6.在文档窗口单击工具栏中的“代码”按钮，在验证表单的动作代码中加入如下：/宣告脚本语言为 javascript0&parent.frames.length)d=parent.framen.substring(p+1).document;n=n.substring(0,p);if(!(x=dn)&d.all)x=d.alln;for(i=0;!x&id.forms.length;i+)x=d.formsin;for(i=0;!x&d.layers&id.layers.length;i+)x=MM_findObj(n,d.layersi.document);if(!x&d.g
18、etElementById)x=d.getElementById(n);return x;/定义创建对话框基本属性function MM_validateForm()/v4.0var i,p,q,nm,test,num,max,errors=,args=MM_validateForm.arguments;/检查提交表单的内容for(i=0;i(args.length-2);i+=3)test=argsi+2;val=MM_findObj(argsi);if(val)nm=val.name;if(val=val.value)!=)if(test.indexof(isEmail)!=-1 p=va
19、l.indexof();if(p1|p=(val.length-1)errors+=-+nm+需要输入邮箱地址.n;/如果提交的邮箱地址表单中不是邮件格式则显示为需要输入邮箱地址 esle if(test!=R)num=parseFloat(val);if(is NaN(val)errors+=-+nm+需要输入数字.n;/如果提交的电话表单中不是数字则显示为需要输入数字if(test.indexOf(inRange)!=-1)p=test.indexOf(:);min=test.substring(8,p);max=test.substring(p+1);if(nummin|max编辑完成后
20、，单击“设计”按钮，返回文档窗口此时，可以测试一下执行的结果7.在该网页中添加一个“插入记录”的服务器行为。执行“窗口”|“服务器行为”，打开“服务器行为”面板，单击添加按钮，选择“插入记录”。8.在对话框中设置：从“连接”下拉列表框选择 user 作为数据源连接对象从“插入到表格”下拉列表框选择 member 作为使用的数据库表对象在“插入后，转到”文本框中设置记录成功添加到表 member 后，转到 regok.asp在对话框下半部分，将网页中的表单对象和数据库中表 member 中的字段一一对应，如图9.设置完成后，单击确定，返回“文档”窗口，如图10.设置检查用户名是否重复。单击“服务
21、器行为”上的添加按钮，在弹出的菜单中，执行“用户身份验证”|“检查新用户名”命令，在对话框中设置如下：在“用户名字段”下拉列表框中选择 username 字段在“如果已存在，转到”文本框中输入 regfail.asp，该网页将在后面编辑设置完成如图11.设置完成后，将该文档保存到本地站点中，完成本页制作。（二）注册成功和注册失败页面注册成功和注册失败页面为了方便登录，应该在 regok.asp 中设置一个转到 index.asp 的文字链接。同时为了方便访问者重新进行注册，则应该在 regfail.asp 页面设置一个转到 register.asp 页面的文字链接。1.创建新 ASP 网页并保
22、存为 regok.asp 在网站根目录下2.regok.asp 如图所示，制作比较简单，省去，其中“这里”指向 index.asp 的链接3.如果输入错误或用户名已经存在，在应该显示注册失败的信息。新建一个 regfail.asp 页面，设计如图。其中“这里”指向 register.asp 的链接（三）用户注册功能的测试用户注册功能的测试1.打开 IE，输入 http:/127.0.0.1/register.asp，打开 register.asp2.输入一些不正确的信息，错填或者少填一些内容，以测试网页中验证表单动作的执行情况。3.在页面中注册一个已经存在的用户名，如果输入 admin。单击“
23、确定”，由于已经存在，浏览器会转到 regfail.asp，如图，告诉访问者用户名已经存在。此时，注册者可以单击“这里”返回 register.asp，以重新注册。4.在该注册页面填写任意注册资料5.单击“确定”，浏览器会转到 regok.asp 页面，此时，访问者可以单击“这里”，转到 index.asp 以便进行登录6.在 Access 中打开用户数据库文件 member.mdb，查看其中的 member 表对象的内容，此时可以看到在该表的最后一行多了一条刚提交的注册信息。五、用户注册资料修改模块的设计（一）（一）修改资料页面修改资料页面该页面主要把用户所有资料都列出，通过“更新记录”实现
24、资料修改的功能，步骤如下：1.首先制作用户修改资料页面。由于和用户注册页面相似，可以通过修改 register.asp 页面来得到所需要的记录更新页面。打开 register.asp，“另存为”userupdate.asp2.打开“服务器面板”，删去全部的服务器行为并修改其相应的文字，修改完成后显示如图3.打开“绑定”面板，单击添加按钮，选择“记录集（查询）”4.在该对话框中设置“在“名称”输入 upuser 作为该“记录集”的名称从“连接”下拉列表框选择“user 数据源”连接对象从“表格”下拉列表框中，选择使用的数据库表对象为 member在“列”单选按钮组中先选中“全部”单选按钮在“筛选
25、”栏中设置记录集过滤的条件为 username=阶段变量/MM_userName。完成设置后如图5.设置完成，完成记录集的绑定6.完成记录集的绑定后将 upuser 记录集中的字段绑定到页面上相应的位置上，如图7.对于网页中的单选按钮组 sex 对象，单击“服务器行为”面板中的添加按钮，执行“动态表单元素”|“动态单选按钮”，设置动态单选按钮组对象。打开“动态单选按钮”，从“单选按钮组”下拉列表框中，选择form1 表单中的单选按钮组 sex。单击“选取值等于”后按钮，从打开的“动态数据”对话框中选择记录集 upuser 中的 sex 字段。并用相同的方法设置“密码提示问题”的列表选项，设置完
26、成如图所示。8.单击“服务器行为”面板上的添加按钮，选择“更新记录”，为网页添加更新记录的服务器行为9.打开“更新记录”对话框，该对话框与插入记录的对话框相似，具体设置如图。10.设置完成，返回“文档”窗口，将文档保存到本地站点中。11.由于本页的 MM_username 值是来自上一页注册成功的用户名值，所以单独测试时会提示出错，要先登录，在登录成功的页面单击“修改您的注册资料”超链接到该页面才能产生效果。（二）（二）更新成功页面更新成功页面用户修改注册资料成功后，就会转到 userupdateok.asp。在该页面，应该向用户显示资料修改成功的信息。如果用户要继续修改资料为其提供一个返回到
27、 userupdate.asp 的链接；如果不需要修改，则为其提供一个转到用户登陆页面index.asp 页面的链接，步骤：1.创建新 ASP 网页并保存为 userupdateok.asp 在网站根目录下2.为了向用户提供更好的界面，应该在网页中显示用户修改的结果，以供用户检查修改是否正确。应该首先定义一个记录集，然后将绑定的记录集插入到网页中相应的位置，方法与制作页面 userupdate.asp 中的方法一样。通过在表格中添加记录集中的动态数据对象，把用户修改后的信息显示在表格中，具体操作参照之前的做法（三）（三）修改资料功能的测试修改资料功能的测试1.打开 IE，输入 http:/12
28、7.0.0.1/index.asp，打开 index.asp，在页面中登录，成功后进入 welcome.asp，单击“修改您的资料”，转到 userupdate.asp2.在该页面进行一些修改，然后单击提交。如果更新成功，浏览器转回到 userupdateok.asp3.在 Access 中打开用户数据库文件 member.mdb，查看其中的 member 表对象的内容，此时可以看到，对应的记录内容已经修改六、密码查询模块的设计通过设置的问题和答案找到遗失的密码。方法是判断用户提供的答案和数据库中答案是否一致，来找回密码。（一）（一）密码查询页面密码查询页面本节主要制作密码查询页面 lostp
29、assword.asp，步骤如下：1.创建新 ASP 网页并保存为 lostpassword.asp 在网站根目录下，在“布局”下拉菜单中选择“无”，设计的页面如图所示2.在“文档”窗口中选中表单对象，在“属性”面板中，在“表单 ID”文本框中输入 form1，在“动作”文本框中输入 showquestion.asp 作为该表单提交的对象页面。在“方法”下拉列表框中选择 POST 作为该表单的提交方式，接下来将输入用户名的文本域命名为 inputname，如图3.新建文档，输入网页标题“查询问题”，另存为 showquestion.asp4.在 dreamweaver 中制作静态网页，效果如图
30、5.在“文档”窗口选中表单对象，在“属性”面板中，在“动作”文本框中输入 showpassword.asp 作为该表单提交的对象页面。在“方法”下拉列表框中选择 POST 作为该表单的提交方式，如图所示。接下来将输入密码提示问题答案的文本域命名为 inputanswer6.执行“窗口”|“绑定”，打开绑定面板，单击添加按钮，选择“记录集（查询）”7.在对话框中设置在“名称”文本框中输入 Recordset1 作为该记录集的名称从“连接”下拉列表框选择“user 数据源”连接对象从“表格”下拉列表框中，选择使用的数据库表对象为 member在“列”先选中“选定的”单选按钮，然后在下拉列表框中选择
31、 username 和 question在“筛选”栏中设置记录集过滤的条件为 username：=，表单变量：inputname，表示根据数据库中 username字段的内容是否和从上一个网页中的表单中的 inputname 表单对象传递过来的信息完全一致来过滤记录对象。完成设置后如图8.设置完成，关闭对话框，返回到“文档”窗口9.将 Recordset1 记录集中的 question 字段绑定到页面上相应的位置，如图10.执行“插入记录”|“表单”|“隐藏域”，在表单中插入一个表单隐藏域，然后将该隐藏域的名称设置为 username11.选中该隐藏域，转到“绑定”面板，将 Recordset
32、1 记录集中的 username 字段绑定到该表单隐藏域中，如图。（当用户输入的用户名不存在，即记录集 Recordset1 为空时，就会导致该页面不能正常显示，这就需要设置隐藏区域）12.在“文档”窗口中选中当用户输入用户名存在时显示的内容即整个表单，然后单击“服务器行为”的添加按钮，在弹出的菜单中，执行“显示区域”|“如果记录集不为空则显示区域”，在对话框中选择记录集对象为 Recordset1。这样只有当记录集 Recordset1 不为空，才显示出来。设置完成单击确定关闭对话框，返回到“文档”窗口。13.在网页中编辑显示用户名不存在时的文本“该用户名不存在！”，并为这些内容设置一个“如
33、果记录集为空则显示区域”隐藏区域服务器行为，这样当记录集 Recordset1 为空时，显示这些文本，完成后如图所示（二）完善密码查询功能页面完善密码查询功能页面当用户在 showquestion.asp 输入答案，提交后服务器就会提交到 showpassword.asp。下面就来设计该页面。1.创建新 ASP 网页并保存为 showpassword.asp 在网站根目录下，在“布局”下拉菜单中选择“无”2.在 dreamweaver 中制作如图所示的静态部分3.打开“绑定”面板，单击添加按钮，选择“记录集（查询）”4.在对话框中设置在“名称”文本框中输入 Recordset1 作为该记录集的
34、名称从“连接”下拉列表框选择“user 数据源”连接对象从“表格”下拉列表框中，选择使用的数据库表对象为 member在“列”先选中“选定的”单选按钮，然后在下拉列表框中选择 username、password 和 answer 三个字段在“筛选”栏中设置记录集过滤的条件为 answer 为=，表单变量为 inputanswer，表示根据数据库中 answer字段的内容是否和从上一个网页中的表单中的 inputanswer 表单对象传递过来的信息完全一致来过滤记录对象。完成设置后如图5.单击确定，关闭对话框，返回“文档”窗口6.将记录集中 username 和 password 两个字段分别添
35、加到网页中，如图7.同样需要根据记录集 Recordset1 是否为空，为该网页中的内容设置隐藏区域的服务器行为。在“文档”窗口，选中当用户输入密码提示问题答案正确时显示的内容，然后单击“服务器行为”的添加按钮，在弹出的菜单，执行“显示区域”|“如果记录集不为空则显示区域”，在对话框中选择记录集对象为 Recordset1。这样只有当 Recordset1 不为空时才显示出来，如图。设置完成，关闭对话框，返回“文档”窗口。8.在网页中选择当用户输入密码提示问题答案不正确时显示的内容，并为这些内容设置一个“如果记录集为空则显示区域”隐藏区域服务器行为，这样只有当记录集 Recordset1 为空
36、时，才显示这些文本，如图9.完成保存到本地站点中（三）密码查询功能测试1.打开 IE，输入 http:/127.0.0.1/index.asp，打开 index.asp，在页面中登录，成功后进入 welcome.asp，单击“找回密码”，如图2.当用户进入 lostpassword.asp 后，输入并向服务器提交自己注册的用户名信息。当输入不存在的用户名，单击提交，会转到 showquestion.asp，该页显示出用户名不存在的错误信息，并提供一个转到 lostpassword.asp 的链接，让用户转到 lostpassword.asp，并重新输入用户名3.如果输入一个已经存在的用户名，提交后，IE 会自动转到 showquestion.asp 页面，如图。下面测试输入密码提示问题答案。4.可以先输入一个错误答案，检查 showpassword.asp 是否能显示不正确信息5.输入正确答案，如果无误，就会转到 showpassword.asp，显示用户密码，如图。至此，用户管理系统的常用功能都已经设计并测试成功，设计者如果需要将其应用到其他网站上，只需要与设计的页面配合，修改一些相关的文字说明和背景效果，就可以完成用户管理系统的制作。