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 相关文章推荐
php防盗链的常用方法小结
Jul 02 PHP
php打印输出棋盘的实现方法
Dec 23 PHP
解决ThinkPHP关闭调试模式时报错的问题汇总
Apr 22 PHP
php动态函数调用方法
May 21 PHP
PHP程序员不应该忽略的3点
Oct 09 PHP
laravel创建类似ThinPHP中functions.php的全局函数
Nov 26 PHP
php处理静态页面:页面设置缓存时间实例
Jun 22 PHP
PHP实现的mysql主从数据库状态检测功能示例
Jul 20 PHP
php提取微信账单的有效信息
Oct 01 PHP
ThinkPHP框架实现的微信支付接口开发完整示例
Apr 10 PHP
PHP的HTTP客户端Guzzle简单使用方法分析
Oct 30 PHP
discuz论坛更换域名,详细文件修改步骤
Dec 09 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
You might like
在同一窗体中使用PHP来处理多个提交任务
2006/10/09 PHP
一个简洁的PHP可逆加密函数(分享)
2013/06/06 PHP
PHP读取文本文件并逐行输出该行使用最多的字符与对应次数的方法
2016/11/25 PHP
Ubuntu 16.04中Laravel5.4升级到5.6的步骤
2018/12/07 PHP
jQuery 行级解析读取XML文件(附源码)
2009/10/12 Javascript
script的async属性以非阻塞的模式加载脚本
2013/01/15 Javascript
在父页面调用子页面的JS方法
2013/09/29 Javascript
Java/JS获取flash高宽的具体方法
2013/12/27 Javascript
为何JS操作的href都是javascript:void(0);呢
2015/11/12 Javascript
基于jQuery实现弹出可关闭遮罩提示框实例代码
2016/07/18 Javascript
Angular 理解module和injector,即依赖注入
2016/09/07 Javascript
js学习之----深入理解闭包
2016/11/21 Javascript
Angular项目中$scope.$apply()方法的使用详解
2017/07/26 Javascript
html中通过JS获取JSON数据并加载的方法
2017/11/30 Javascript
javascript Function函数理解与实战
2017/12/01 Javascript
AngularJS 应用模块化的使用
2018/04/04 Javascript
countup.js实现数字动态叠加效果
2019/10/17 Javascript
javascript 高级语法之继承的基本使用方法示例
2019/11/11 Javascript
vue搜索页开发实例代码详解(热门搜索,历史搜索,淘宝接口演示)
2020/04/11 Javascript
Vue-router中hash模式与history模式的区别详解
2020/12/15 Vue.js
[01:57]2018DOTA2亚洲邀请赛赛前采访-iG
2018/04/03 DOTA
[34:10]Secret vs VG 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.24
2019/09/10 DOTA
python中pandas.DataFrame的简单操作方法(创建、索引、增添与删除)
2017/03/12 Python
Python 安装setuptools和pip工具操作方法(必看)
2017/05/22 Python
Python实现按当前日期(年、月、日)创建多级目录的方法
2018/04/26 Python
详解python异步编程之asyncio(百万并发)
2018/07/07 Python
Python集成开发工具Pycharm的安装和使用详解
2020/03/18 Python
python des,aes,rsa加解密的实现
2021/01/16 Python
幼儿园门卫制度
2014/01/29 职场文书
家具公司总经理岗位职责
2014/07/08 职场文书
考试作弊检讨书1000字(5篇)
2014/10/19 职场文书
关于观后感的作文
2015/06/18 职场文书
2015年高三教学工作总结
2015/07/21 职场文书
演讲稿:态度决定一切
2019/04/02 职场文书
奥特曼十大神器:奥特手镯在榜,第一是贝利亚的神器
2022/03/18 日漫
教你使用Jenkins集成Harbor自动发布镜像
2022/04/03 Servers