Pelaksanaan Ajax log masuk pengguna
Halaman log masuk pengguna (js melaksanakan permintaan ajax dalam mod dapatkan)
login.html kod adalah seperti berikut:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<hr size="1">
用戶：<input type="text" id="username" name="username"/><br>
密碼：<input type="password" id="password" name="password" /><br>
<div id="error_message" style="color: red"></div>
<input type="submit" id='login' name='login' value="登錄">
<div id="success"></div>
</body>
<script type="text/javascript">
document.getElementById("login").onclick = function () {
var name = document.getElementById("username").value;
var pwd = document.getElementById("password").value;
var oError = document.getElementById("error_message");
var isNotError = true;
if(name==""){
oError.innerHTML = "警告:用戶名為空 ";
isNotError = false;
return;
}else if(pwd==""){
oError.innerHTML = "警告:密碼為空 ";
isNotError = false;
return;
}
//創(chuàng)建XHR對象
var xhr = new XMLHttpRequest();
//設(shè)置請求URL
var url = "./success.php?username=" + name+"&password="+pwd;
//設(shè)置XHR對象readyState變化時響應(yīng)函數(shù)
xhr.onreadystatechange = function () {
var success = document.getElementById("success");
//readyState是請求的狀態(tài)，為4表示請求結(jié)束
if (xhr.readyState == 4) {
//responseText服務(wù)器響應(yīng)的內(nèi)容
var data = eval(this.responseText);
for(var index in data) {
if(data[index].code==1){
alert(data[index].message);//密碼錯誤
}else if(data[index].code==2){
alert(data[index].message);//您已經(jīng)登入了
success.innerHTML = "用戶名："+data[index].session+"---"+"<a href='logout.php'>注銷</a>";;
}else if(data[index].code==3){
alert(data[index].message);//登錄成功
success.innerHTML = "您好！"+data[index].session+",歡迎回來！<a href='logout.php'>注銷</a>";
}
else if(data[index].code==4){
alert(data[index].message);//沒有此用戶,請重新登錄
location.href='login.html';
}
}
}
};
//打開鏈接
xhr.open("get", url, true);
//發(fā)送請求
xhr.send();
}
</script>
</html>Alamat url yang diserahkan oleh ajax ialah success.php, dan sambungan pangkalan data berjaya dibuat .php. Proses data, kemudian kembalikan ke halaman log masuk dalam format json untuk memaparkannya, dan cetak dan lihat melalui makluman
success.php kod adalah seperti berikut:
<?php
/**
* Created by PhpStorm.
* User: Administrator
* Date: 2018/2/27 0027
* Time: 上午 10:47
*/
header('Content-type:text/html;charset=utf-8');
if ($_SERVER['REQUEST_METHOD'] == 'GET') {
$username=trim($_GET['username']);
$password=$_GET['password'];
}
$mysqli = new mysqli('localhost', 'root', 'root', 'student');
$result = $mysqli->query("SELECT password FROM user WHERE username = "."'$username'");
$rs=$result->fetch_row();
if (!empty($rs)){
if ($password != $rs[0]) {
$data = array(
array('code' => 1, 'message' => '密碼錯誤,請重新登錄'),
);
echo json_encode($data);
}else{
$expire=3600;
ini_set('session.gc_maxlifetime', $expire);//保存1小時
if (empty($_COOKIE['PHPSESSID'])) {
session_set_cookie_params($expire);
session_start();
}else{
session_start();
setcookie('PHPSESSID', session_id(), time() + $expire);
}
if(isset($_SESSION['username'])){
$data = array(
array('code' => 2, 'message' => '您已經(jīng)登入了，請不要重新登入','session'=>$_SESSION['username']),
);
echo json_encode($data);
}else{
$_SESSION['username']=$_GET['username'];
$data = array(
array('code' => 3, 'message' => '登錄成功','session'=>$_SESSION['username']),
);
echo json_encode($data);
}
}
}else{
$data = array(
array('code' => 4, 'message' => '沒有此用戶,請重新登錄'),
);
echo json_encode($data);
}
