第10节-开发后台登陆页面.pptVIP

第10节 开发后台登陆页面1 ggao@wtu.edu.cn 1.目标 后台管理网站只允许授权用户使用 就是用户表中的用户（user） 登陆页面负责校验用户名和密码，对通过的用户将跳转到后台管理网站；校验失败则提示错误继续停留在登陆页面 加入验证码功能，不仅要输入用户名和密码，还要输入验证码 验证码在客户端通过js验证 目的：防止机器人窃取用户密码 2.添加管理用户 在菜单页面添加管理用户菜单项 制作添加管理用户页面 和添加学生信息页面类似 省略，演示中只制作一个空页面 通过navicat软件添加两个用户 cm，123，一般用户（flag=0） root，123，特权用户（flag=1） 3.制作登陆页面 文件名：login.php 位置：网站根目录 前台规划 用一个div包含所有元素，设置其居中 用一个4行3列表格放置登录信息输入元素 密码输入框input type=password 表格最后一行放置一个登陆按钮 给登陆按钮添加事件，调用函数，检查用户输入是否为空 submitLogin() 4.登陆后台代码 专门为登陆制作一个执行sql读操作php页面 queryLogin.php；网站根目录 该页面接收登陆页面传递过来的sql $sql=urldecode($_REQUEST[sql]); 执行sql $conn=mysql_connect(localhost,root,123456); if(!$conn) echo 没有连接成功!; $result=mysql_query($sql, $conn); 判断结果：如果读不到数据则返回-1，如果读到，则返回用户权限（flag值） if($row=mysql_fetch_row($result)) echo $row[0]; else echo -1; mysql_free_result($result); mysql_close($conn); 5.登陆页面连接后台代码 将用户提交的信息组成读取数据库sql 利用ajax函数调用queryLogin.php并传递sql参数 url: encodeURI(queryLogin.php?sql=+sql) 处理返回 利用success参数 成功则跳转到后台网站主页 location.href=ms.php 6.加入登陆校验码 使用js的Math对象的随机函数生成一个简单校验码 Math.random() 放大10000倍 取整：parseInt() 为了确保有4位数 小于1000，前面加1个零 小于100，前面加2个零 小于10，前面加3个零 用一个函数完成这些操作 将验证码显示在第3行第3个单元格 与用户输入进行比较 如果不一致，提示错误，终止登陆提交，继续输入 如果用户登录失败 修改验证码