首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 PHP

PHP如何通过AJAX方式实现登录功能

Posted in PHP onNovember 23, 2015

本文实例讲述了Ajax+PHP+MySQL登陆示例。分享给大家供大家参考。具体如下：
运行效果截图如下：

PHP如何通过AJAX方式实现登录功能

具体代码如下：

1 login.php
登录界面中,javascript脚本用ajax方式异步请求dologin.php,dologin.php负责用户信息验证(包括验证码,php生成验证码可以自行搜索).登录界面的代码如下:

<?php session_start();?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
 <title>login</title>
 <link rel="stylesheet" type="text/css" href="CSS/login.css" />
 <script src="JS/ajaxhelper.js" type="text/javascript"></script>
 <script src="JS/jquery-1.3.2.min.js" type="text/javascript"></script>
 <script type="text/javascript">
  function chkForm() {
   if (m$('username').value == "") {

    alert('用户名不能为空.');
    m$('username').focus();
    return false;

   }
   if (m$('password').value == "") {

    alert('密码不能为空.');
    m$('password').focus();
    return false;

   }
   if (m$('password').value != "" && m$('username').value != "") {

    var xmlhttp = createRequest();
    if (xmlhttp) {
     m$('loading').innerHTML = "<font color='red'>loading...</font>";
     var username = m$('username').value;
     var pwd = m$('password').value;
     var code = m$('txtCode').value;
     var url = "dologin.php";
     xmlhttp.open("POST", url, true);
     xmlhttp.onreadystatechange = ValidateResult;
     xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
     xmlhttp.send("username=" + escape(username) + "&password=" + escape(pwd) + "&code=" + escape(code));

    } else {
     alert('xmlHttp创建失败.');

    }

    function ValidateResult() {
     if (xmlhttp.readyState == 4) {
      if (xmlhttp.status == 200) {
       if (xmlhttp.responseText != "") {

        //window.alert(xmlhttp.responseText);
        var obj = eval("(" + xmlhttp.responseText + ")");
        if (obj.result == true) {
         alert("提示:" + obj.info);
         window.location = 'index.php';

        } else {
         alert("错误:" + obj.info);

        }
       } else {
        window.alert("从服务器获取失败");

        window.location.reload();
       }
       m$('loading').innerHTML = "";
      }
     }

    }


   }

  }

  function m$(id) {
   return document.getElementById(id);
  }

  function changeCode() {
   var xmlhttp = createRequest();
   if (xmlhttp) {
    m$('loading').innerHTML = "<font color='red'>loading...</font>";
    var dt = new Date().getTime();
    // alert(dt);
    var url = "function/imagecode.php?dummay" + escape(dt);
    xmlhttp.open("GET", url, true);
    xmlhttp.onreadystatechange = ValidateResult;
    xmlhttp.send(null);

   } else {
    alert('xmlHttp创建失败.');

   }

   function ValidateResult() {
    if (xmlhttp.readyState == 4) {
     if (xmlhttp.status == 200) {
      var dt = new Date().getTime();
      var url = "function/imagecode.php?dummay" + escape(dt);
      m$('imgCode').src = "function/imagecode.php?dummay" + escape(dt);
      m$('loading').innerHTML = "";
     }
    }

   }
  }

  function showTool() {
   $('#divToolTip').css("display", "block");
  }

  function hideTool() {
   $('#divToolTip').css("display", "none");
  }
  window.onload = initPage;

  function initPage() {
   $('#divToolTip').css("display", "none");
  }
 </script>
 </head>
 <body>
 <div style="background-color:#2A3F55; height:80px;">
  
 </div>
 <div style="min-height:500px;">
  
  <div class="left">
  
  <div style="margin:120px auto auto auto; height:300px; text-align:left">
   <div style="font-size:26px;color:#2A3F55; text-align:center;">Ajax PHP Demo System
   <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;"/>
   </div>
   <br/>
   <hr style="border:dashed thin #2A3F55;width:70%; text-align:center;"/>
   <div style="font-size:13px;color:#999999; margin:20px auto 0 auto; padding-left:200px;">
   Author:<a href="#" onmousemove="showTool();" onmouseout="hideTool();">wangming</a>
   </div>
   <div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">DateTime:2009-9-1</div>
   <div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">Version:1.0.0</div>
   <div style="font-size:13px;color:#999999;margin:20px auto auto auto; padding-left:200px;">Email:wangmingemail@163.com     </div>
   <div id="divToolTip">
   <img src="Images/ming.jpg" height="86px;"/>
   <span class="authordes">
    <br/>
    姓名:wangming<br/>
    电商06-2<br/>
   </span>
   
   </div>
   
  </div>
  
  </div>
  
  <div class="right">
  
  <form>
   <br/>
   <table class="flogin">
   <tr>
    <td>用户名:</td>
    <td><input type="text" name="username" id="username"/></td>
    <td></td>
   </tr>
   <tr>
    <td>密   码:</td>
    <td><input type="password" name="password" id="password" /></td>
    <td></td>
   </tr>
   <tr>
    <td>验证码:</td>
    <td>
    <input type="text" name="txtCode" id="txtCode" size="12" /> 
    <img src="function/imagecode.php" id="imgCode" alt="image code" height="22px;" style=" vertical-align:bottom;"/>
    </td>
    <td><input type="button" class="btnrefresh" onclick="changeCode();" /></td>
   </tr>
   <tr>
    <td></td>
    <td><input type="button" class="btnlogin" onclick="chkForm();" /></td>
    <td></td>
   </tr>
   <tr>
    <td></td>
    <td><span id="loading"></span></td>
    <td><span id="code"></span></td>
   </tr>
   
   </table>
  </form>
  </div>
  
 </div>
 <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;">
  ©Copyright 2015.
 </div>
 </body>
</html>

2 ajaxhelper.js

function createRequest() {
 try {
  request = new XMLHttpRequest();
 } catch (tryMS) {
  try {
   request = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (otherMS) {
   try {
    request = new ActiveXObject("Microsoft.XMLHTTP");
   } catch (failed) {
    request = null;
   }
  }
 }
 return request;
}

function getActivatedObject(e) {
 var obj;
 if (!e) {
  // early version of IE
  obj = window.event.srcElement;
 } else if (e.srcElement) {
  // IE 7 or later
  obj = e.srcElement;
 } else {
  // DOM Level 2 browser
  obj = e.target;
 }
 return obj;
}

function addEventHandler(obj, eventName, handler) {
 if (document.attachEvent) {
  obj.attachEvent("on" + eventName, handler);
 } else if (document.addEventListener) {
  obj.addEventListener(eventName, handler, false);
 }
}

3 dologin.php

<?php
 session_start();
 header("Content-type:text/html;charset=gb2312");//防止返回的中文乱码
 $name=$_POST['username'];
 $pwd=$_POST['password'];
 $imagecode=$_POST['code'];
 if(strtoupper($imagecode)==$_SESSION["code"])
 {
  include("conn/conn.php");
  $sql="select studentName,studentPwd from tbstudent where studentId='".$name."'";
  $result=mysql_query($sql,$conn);
  if($row=mysql_fetch_assoc($result))
  {
   if($pwd==$row['studentPwd'])
   {
   $_SESSION['username']=$row['studentName'];
   //echo "{'result':true,'info':'登陆成功!','code':'".$_SESSION["code"]."'}";
   echo "{'result':true,'info':'登陆成功!'}";
   
   }
   else
   {
   echo "{'result':false,'info':'密码错误!'}";
   }
  }
  else
  {
   echo "{'result':false,'info':'该用户不存在!'}";
  }
 }
 else
 {
  echo "{'result':false,'info':'验证码错误!'}";
 }
?>

4 conn.php

<?php
 $conn=$mysql_connect("localhost","root", "");
 mysql_select_db("bbs",$conn);
 mysql_query("SET NAMES GB2312");
 ?>
 5
 <?php
class Users {
 function Users() {
 }
 function checkLogin($username, $userpwd) {
  try {
   mysql_connect("localhost", "root", "123");
   mysql_select_db("studentdb");
   mysql_query("SET NAMES GB2312");
   $sql = "select userid from tbuser where username='$username' and userpwd='" . md5(trim($userpwd)) . "'";
   $result = mysql_query($sql);
   if ($result) {
    $arr = mysql_fetch_row($result);
    $uid = $arr[0];
    if ($uid != "") {
     return "true|$uid login ok.$sql";
     mysql_close();
    } else {
     return "false|login failed!$sql";
     mysql_close();
    }
   } else {
    return "false|$result link db failed!";
    mysql_close();
   }
  }
  catch(Exception $ex) {
   return "false|$ex";
   mysql_close();
  }
 }
 function AddUser($name, $pwd) {
  try {
   mysql_connect("localhost", "root", "123");
   mysql_select_db("studentdb");
   mysql_query("set names gb2312");
   $sql0 = mysql_query("select userid from tbuser where username='$name'");
   $info0 = mysql_fetch_array($sql0);
   $userid = $info0[0];
   if ($info0 != false) {
    return "false | $name is exisis.(id:$userid)";
   }
   $pwd = md5(trim($pwd));
   $query = mysql_query("insert into tbuser(username,userpwd)values('$name','$pwd')");
   $error = mysql_errno();
   if ($query) {
    return "true | add ok";
   } else {
    return "false | $error";
   }
  }
  catch(Exception $ex) {
   return "false | $ex";
  }
 }
 function DeleteUser($name) {
  mysql_connect("localhost", "root", "123");
  mysql_select_db("studentdb");
  mysql_query("set names gb2312");
  $name = trim($name);
  $sql0 = mysql_query("select userid from tbuser where username='$name'");
  $info0 = mysql_fetch_array($sql0);
  if ($info0 != false) {
   if (mysql_query("delete from tbuser where username='$name'")) {
    return "true | delete ok.(id:" . $info0[0] . ")";
   } else {
    return "false | 删除失败";
   }
  } else {
   return "false | 删除失败 $name 不存在";
  }
 }
 function UpdateUser($id, $name, $pwd) {
  if (is_numeric(intval(trim($id)))) {
   if ($id && $name && $pwd) {
    mysql_connect("localhost", "root", "123");
    mysql_select_db("studentdb");
    mysql_query("set names gb2312");
    $pwd = md5(trim($pwd));
    $isexists = mysql_query("select * from tbuser where userid='$id'");
    if (mysql_fetch_array($isexists)) {
     $sql0 = mysql_query("update tbuser set username='$name',userpwd='$pwd' where userid= $id");
     if ($sql0) {
      return "ture | update ok";
     } else {
      return "false | 更新失败";
     }
    } else {
     return "false | usrid=$id not exists.";
    }
   } else {
    return "false |id=$id name=$name and pwd=$pwd .At least one of them is null.";
   }
  } else {
   return "false | $id is not type of int.";
  }
 }
}
?>

与登录无关，只为了记录一下PHP如何在数据库MYSQL上实现CURD操作.

以上就是告诉了大家PHP如何通过AJAX方式实现登录功能，希望对大家的学习有所帮助。

PHP如何通过AJAX方式实现登录功能

- Author -

JackWang-CUMT

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

PHP 相关文章推荐
一个显示天气预报的程序
Oct 09 PHP
PHP字符转义相关函数小结(php下的转义字符串)
Apr 12 PHP
PHP实现异步调用方法研究与分享
Oct 27 PHP
三种php连接access数据库方法
Nov 11 PHP
php实现的支持断点续传的文件下载类
Sep 23 PHP
浅析Yii2集成富文本编辑器redactor实例教程
Apr 25 PHP
ThinkPHP和UCenter接口冲突的解决方法
Jul 25 PHP
PHP严重致命错误处理:php Fatal error: Cannot redeclare class or function
Feb 05 PHP
CakePHP框架Session设置方法分析
Feb 23 PHP
详解php 使用Callable Closure强制指定回调类型
Oct 26 PHP
Thinkphp5.0 框架视图view的比较标签用法分析
Oct 12 PHP
Yii框架 session 数据库存储操作方法示例
Nov 18 PHP
最新制作ThinkPHP3.2.3完全开发手册
Nov 23 #PHP
php生成4位数字验证码的实现代码
Nov 23 #PHP
3种php生成唯一id的方法
Nov 23 #PHP
php命令行（cli）模式下报require 加载路径错误的解决方法
Nov 23 #PHP
PHP语法小结之基础和变量
Nov 22 #PHP
PHP传值到不同页面的三种常见方式及php和html之间传值问题
Nov 19 #PHP
PHP中使用array函数新建一个数组
Nov 19 #PHP
松下(1) PL660(1) 南麂列岛(1) ICF-SW7600GR(1) ICF-SW55(1) Panasonic(1) 根德(2) 台湾(1) SRF-S84(1) SRF-S83(1)
You might like
环境会对咖啡种植有什么影响
2021/03/03 咖啡文化
PHP聊天室技术
2006/10/09 PHP
Yii2.0预定义的别名功能小结
2016/07/04 PHP
js或css文件后面跟参数的原因说明
2010/01/09 Javascript
jquery插件validate验证的小例子
2013/05/08 Javascript
jQuery拖拽 &amp; 弹出层 介绍与示例
2013/12/27 Javascript
html5+javascript制作简易画板附图
2014/04/25 Javascript
原生JS获取元素的位置与尺寸实现方法
2017/10/18 Javascript
vue解决跨域路由冲突问题思路解析
2017/11/03 Javascript
微信小程序使用progress组件实现显示进度功能【附源码下载】
2017/12/12 Javascript
详解通过源码解析Node.js中cluster模块的主要功能实现
2018/05/16 Javascript
学习使用ExpressJS 4.0中的新Router的用法
2018/11/06 Javascript
vue强制刷新组件的方法示例
2019/02/28 Javascript
详解微信UnionID作用
2019/05/15 Javascript
JS中封装axios来管控api的2种方式
2019/09/11 Javascript
微信小程序如何获取用户头像和昵称
2019/09/23 Javascript
在Layui中操作数据表格,给指定单元格添加事件示例
2019/10/26 Javascript
vue.js实现照片放大功能
2020/06/23 Javascript
[01:02:34]TFT vs VGJ.T Supermajor 败者组 BO3 第二场 6.5
2018/06/06 DOTA
Python实现Windows上气泡提醒效果的方法
2015/06/03 Python
Windows上配置Emacs来开发Python及用Python扩展Emacs
2015/11/20 Python
python之PyMongo使用总结
2017/05/26 Python
一份python入门应该看的学习资料
2018/04/11 Python
Python考拉兹猜想输出序列代码实践
2019/07/05 Python
Python实现线性插值和三次样条插值的示例代码
2019/11/13 Python
手把手教你如何用Pycharm2020.1.1配置远程连接的详细步骤
2020/08/07 Python
PREMIUM-MALL法国：行李、箱包及配件在线
2019/05/30 全球购物
MYPROTEIN澳大利亚官方网站：欧洲运动营养品牌
2019/06/26 全球购物
.NET remoting中对象激活的两种方式
2015/06/08 面试题
Lucene推荐的分页方式是什么？
2015/12/07 面试题
机电一体化职业规划书
2014/01/07 职场文书
物流管理专业毕业生自荐信
2014/03/04 职场文书
研究生简历自我评
2015/03/11 职场文书
体育教师研修感悟
2015/11/18 职场文书
《鲁滨逊漂流记》之六读后感（4篇）
2019/09/29 职场文书
搭建zabbix监控以及邮件报警的超级详细教学
2022/07/15 Servers