·您现在的位置: 江北区云翼计算机软件开发服务部 >> 文章中心 >> 网站建设 >> 网站建设开发 >> php网站开发 >> Ajax+PHP+MySQL登陆示例
php是一门很好的语言,可以很方便的开发web应用程序,下面介绍一下PHP如何通过Ajax方式实现登录功能:
登录界面中,javascript脚本用ajax方式异步请求dologin.php,dologin.php负责用户信息验证(包括验证码,php生成验证码可以自行搜索).登录界面的代码如下:
1 <?php session_start();?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 3 <html xmlns="http://www.w3.org/1999/xhtml"> 4 <head> 5 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 6 <title>login</title> 7 <link rel="stylesheet" type="text/CSS" href="CSS/login.css" /> 8 <script src="JS/ajaxhelper.js" type="text/Javascript"></script> 9 <script src="JS/jquery-1.3.2.min.js" type="text/javascript"></script> 10 <script type="text/javascript"> 11 function chkForm() { 12 if (m$('username').value == "") { 13 14 alert('用户名不能为空.'); 15 m$('username').focus(); 16 return false; 17 18 } 19 if (m$('passWord').value == "") { 20 21 alert('密码不能为空.'); 22 m$('password').focus(); 23 return false; 24 25 } 26 if (m$('password').value != "" && m$('username').value != "") { 27 28 var xmlhttp = createRequest(); 29 if (xmlhttp) { 30 m$('loading').innerHTML = "<font color='red'>loading...</font>"; 31 var username = m$('username').value; 32 var pwd = m$('password').value; 33 var code = m$('txtCode').value; 34 var url = "dologin.php"; 35 xmlhttp.open("POST", url, true); 36 xmlhttp.onreadystatechange = ValidateResult; 37 xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 38 xmlhttp.send("username=" + escape(username) + "&password=" + escape(pwd) + "&code=" + escape(code)); 39 40 } else { 41 alert('xmlHttp创建失败.'); 42 43 } 44 45 function ValidateResult() { 46 if (xmlhttp.readyState == 4) { 47 if (xmlhttp.status == 200) { 48 if (xmlhttp.responseText != "") { 49 50 //window.alert(xmlhttp.responseText); 51 var obj = eval("(" + xmlhttp.responseText + ")"); 52 if (obj.result == true) { 53 alert("提示:" + obj.info); 54 window.location = 'index.php'; 55 56 } else { 57 alert("错误:" + obj.info); 58 59 } 60 } else { 61 window.alert("从服务器获取失败"); 62 63 window.location.reload(); 64 } 65 m$('loading').innerHTML = ""; 66 } 67 } 68 69 } 70 71 72 } 73 74 } 75 76 function m$(id) { 77 return document.getElementById(id); 78 } 79 80 function changeCode() { 81 var xmlhttp = createRequest(); 82 if (xmlhttp) { 83 m$('loading').innerHTML = "<font color='red'>loading...</font>"; 84 var dt = new Date().getTime(); 85 // alert(dt); 86 var url = "function/imagecode.php?dummay" + escape(dt); 87 xmlhttp.open("GET", url, true); 88 xmlhttp.onreadystatechange = ValidateResult; 89 xmlhttp.send(null); 90 91 } else { 92 alert('xmlHttp创建失败.'); 93 94 } 95 96 function ValidateResult() { 97 if (xmlhttp.readyState == 4) { 98 if (xmlhttp.status == 200) { 99 var dt = new Date().getTime(); 100 var url = "function/imagecode.php?dummay" + escape(dt); 101 m$('imgCode').src = "function/imagecode.php?dummay" + escape(dt); 102 m$('loading').innerHTML = ""; 103 } 104 } 105 106 } 107 } 108 109 function showTool() { 110 $('#divToolTip').css("display", "block"); 111 } 112 113 function hideTool() { 114 $('#divToolTip').css("display", "none"); 115 } 116 window.onload = initPage; 117 118 function initPage() { 119 $('#divToolTip').css("display", "none"); 120 } 121 </script> 122 </head> 123 <body> 124 <div style="background-color:#2A3F55; height:80px;"> 125 126 </div> 127 <div style="min-height:500px;"> 128 129 <div class="left"> 130 131 <div style="margin:120px auto auto auto; height:300px; text-align:left"> 132 <div style="font-size:26px;color:#2A3F55; text-align:center;">Ajax PHP Demo System 133 <img src="Images/appstorm-icon.png" alt="appcation storm image" style="position:relative;top:-18px; left:-12px; vertical-align:middle; text-align:center;font-size:10px; width:65px; height:46px;"/> 134 </div> 135 <br/> 136 <hr style="border:dashed thin #2A3F55;width:70%; text-align:center;"/> 137 <div style="font-size:13px;color:#999999; margin:20px auto 0 auto; padding-left:200px;"> 138 Author:<a href="#" onmousemove="showTool();" onmouSEOut="hideTool();">wangming</a> 139 </div> 140 <div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">DateTime:2009-9-1</div> 141 <div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">Version:1.0.0</div> 142 <div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">Email:wangmingemail@163.com </div> 143 <div id="divToolTip"> 144 <img src="Images/ming.jpg" height="86px;"/> 145 <span class="authordes"> 146 <br/> 147 姓名:wangming<br/> 148 电商06-2<br/> 149 </span> 150 151 </div> 152 153 </div> 154 155 </div> 156 157 <div class="right"> 158 159 <form> 160 <br/> 161 <table class="flogin"> 162 <tr> 163 <td>用户名:</td> 164 <td><input type="text" name="username" id="username"/></td> 165 <td></td> 166 </tr> 167 <tr> 168 <td>密 码:</td> 169 <td><input type="password" name="password" id="password" /></td> 170 <td></td> 171 </tr> 172 <tr> 173 <td>验证码:</td> 174 <td> 175 <input type="text" name="txtCode" id="txtCode" size="12" /> 176 <img src="function/imagecode.php" id="imgCode" alt="image code" height="22px;" style=" vertical-align:bottom;"/> 177 </td> 178 <td><input type="button" class="btnrefresh" onclick="changeCode();" /></td> 179 </tr> 180 <tr> 181 <td></td> 182 <td><input type="button" class="btnlogin" onclick="chkForm();" /></td> 183 <td></td> 184 </tr> 185 <tr> 186 <td></td> 187 <td><span id="loading"></span></td> 188 <td><span id="code"></span></td> 189 </tr> 190 191 </table> 192 </form> 193 </div> 194 195 </div> 196 <div style="background-color:#2A3F55; height:60px; margin:auto 0 0 0; clear:both; text-align:center; line-height:60px; color:#FFFFFF;font-size:12px;"> 197 ©Copyright 2015. 198 </div> 199 </body> 200 </html>
1 function createRequest() { 2 try { 3 request = new XMLHttPRequest(); 4 } catch (tryMS) { 5 try { 6 request = new ActiveXObject("Msxml2.XMLHTTP"); 7 } catch (otherMS) { 8 try { 9 request = new ActiveXObject("Microsoft.XMLHTTP"); 10 } catch (failed) { 11 request = null; 12 } 13 } 14 } 15 return request; 16 } 17 18 function getActivatedObject(e) { 19 var obj; 20 if (!e) { 21 // early version of IE 22 obj = window.event.srcElement; 23 } else if (e.srcElement) { 24 // IE 7 or later 25 obj = e.srcElement; 26 } else { 27 // DOM Level 2 browser 28 obj = e.target; 29 } 30 return obj; 31 } 32 33 function addEventHandler(obj, eventName, handler) { 34 if (document.attachEvent) { 35 obj.attachEvent("on" + eventName, handler); 36 } else if (document.addEventListener) { 37 obj.addEventListener(eventName, handler, false); 38 } 39 }
1 <?php 2 session_start(); 3 header("Content-type:text/html;charset=gb2312");//防止返回的中文乱码 4 $name=$_POST['username']; 5 $pwd=$_POST['password']; 6 $imagecode=$_POST['code']; 7 if(strtoupper($imagecode)==$_SESSION["code"]) 8 { 9 include("conn/conn.php"); 10 $sql="select studentName,studentPwd from tbstudent where studentId='".$name."'"; 11 $result=MySQL_query($sql,$conn); 12 if($row=mysql_fetch_assoc($result)) 13 { 14 if($pwd==$row['studentPwd']) 15 { 16 $_SESSION['username']=$row['studentName']; 17 //echo "{'result':true,'info':'登陆成功!','code':'".$_SESSION["code"]."'}"; 18 echo "{'result':true,'info':'登陆成功!'}"; 19 20 } 21 else 22 { 23 echo "{'result':false,'info':'密码错误!'}"; 24 } 25 } 26 else 27 { 28 echo "{'result':false,'info':'该用户不存在!'}"; 29 } 30 } 31 else 32 { 33 echo "{'result':false,'info':'验证码错误!'}"; 34 } 35 ?>
1 <?php 2 $conn=$mysql_connect("localhost","root", ""); 3 mysql_select_db("bbs",$conn); 4 mysql_query("SET NAMES GB2312"); 5 ?>
1 <?php 2 class Users { 3 function Users() { 4 } 5 function checkLogin($username, $userpwd) { 6 try { 7 mysql_connect("localhost", "root", "123"); 8 mysql_select_db("studentdb"); 9 mysql_query("SET NAMES GB2312"); 10 $sql = "select userid from tbuser where username='$username' and userpwd='" . md5(trim($userpwd)) . "'"; 11 $result = mysql_query($sql); 12 if ($result) { 13 $arr = mysql_fetch_row($result); 14 $uid = $arr[0]; 15 if ($uid != "") { 16 return "true|$uid login ok.$sql"; 17 mysql_close(); 18 } else { 19 return "false|login failed!$sql"; 20 mysql_close(); 21 } 22 } else { 23 return "false|$result link db failed!"; 24 mysql_close(); 25 } 26 } 27 catch(Exception $ex) { 28 return "false|$ex"; 29 mysql_close(); 30 } 31 } 32 function AddUser($name, $pwd) { 33 try { 34 mysql_connect("localhost", "root", "123"); 35 mysql_select_db("studentdb"); 36 mysql_query("set names gb2312"); 37 $sql0 = mysql_query("select userid from tbuser where username='$name'"); 38 $info0 = mysql_fetch_array($sql0); 39 $userid = $info0[0]; 40 if ($info0 != false) { 41 return "false | $name is exisis.(id:$userid)"; 42 } 43 $pwd = md5(trim($pwd)); 44 $query = mysql_query("insert into tbuser(username,userpwd)values('$name','$pwd')"); 45 $error = mysql_errno(); 46 if ($query) { 47 return "true | add ok"; 48 } else { 49 return "false | $error"; 50 } 51 } 52 catch(Exception $ex) { 53 return "false | $ex"; 54 } 55 } 56 function DeleteUser($name) { 57 mysql_connect("localhost", "root", "123"); 58 mysql_select_db("studentdb"); 59 mysql_query("set names gb2312"); 60 $name = trim($name); 61 $sql0 = mysql_query("select userid from tbuser where username='$name'"); 62 $info0 = mysql_fetch_array($sql0); 63 if ($info0 != false) { 64 if (mysql_query("delete from tbuser where username='$name'")) { 65 return "true | delete ok.(id:" . $info0[0] . ")"; 66 } else { 67 return "false | 删除失败"; 68 } 69 } else { 70 return "false | 删除失败 $name 不存在"; 71 } 72 } 73 function UpdateUser($id, $name, $pwd) { 74 if (is_numeric(intval(trim($id)))) { 75 if ($id && $name && $pwd) { 76 mysql_connect("localhost", "root", "123"); 77 mysql_select_db("studentdb"); 78 mysql_query("set names gb2312"); 79 $pwd = md5(trim($pwd)); 80 $isexists = mysql_query("select * from tbuser where userid='$id'"); 81 if (mysql_fetch_array($isexists)) { 82 $sql0 = mysql_query("update tbuser set username='$name',userpwd='$pwd' where userid= $id"); 83 if ($sql0) { 84 return "ture | update ok"; 85 } else { 86 return "false | 更新失败"; 87 } 88 } else { 89 return "false | usrid=$id not exists."; 90 } 91 } else { 92 return "false |id=$id name=$name and pwd=$pwd .At least one of them is null."; 93 } 94 } else { 95 return "false | $id is not type of int."; 96 } 97 } 98 } 99 ?>View Code
与登录无关,只为了记录一下PHP如何在数据库MYSQL上实现CURD操作.