Question

我登录时的ajax脚本意味着要重定向到dashboard.php文件。但是我的当前代码是重定向，即使登录失败（比如我使用了错误的用户名和密码）。如何添加支票？比如说如果返回message-success，那么重新定位，否则不要。

Ajax脚本

<script type="text/javascript">
$(document).ready(function() {
    $("#submit").click(function() {
        var dataString = {
            username: $("#username").val(),
      password: $("#password").val(),
        };
    $.ajax({
            type: "POST",
            url: "login-process.php",
            data: dataString,
            cache: true,
      beforeSend: function(){
        $('#loading-image').show();
      },
      complete: function(){
        $('#loading-image').hide();
      },
      success: function(html){
        $('.message').html(html).fadeIn(2000);
                setTimeout(function(){ window.location.replace("dashboard.php"); }, 2000);
            }
        });
        return false;
    });
});
</script>

登录-process.php

<?php
include'config/db.php';
$msg = null;
$date = date('Y-m-d H:i:s');

$uname  = (!empty($_POST['username']))?$_POST['username']:null;
$pass   = (!empty($_POST['password']))?$_POST['password']:null;

if($_POST){
    $stmt = "SELECT * FROM members WHERE mem_uname = :uname";
    $stmt = $pdo->prepare($stmt);
    $stmt->bindValue(':uname', $uname);
    $stmt->execute();
    $checklgn = $stmt->rowCount();
    $fetch = $stmt->fetch();

    if($checklgn > 0){
        if(password_verify($pass, $fetch['mem_pass'])){
            session_start();
            $_SESSION['sanlogin'] = $fetch['mem_id'];
            $msg = "<div class='message-success'>Access Granted! Please wait...</div>";
        }else{
            $msg = "<div class='message-error'>Password mismatch. Please try again!</div>";
        }
    }else{
        $msg = "<div class='message-error'>User not found. Please try again!</div>";
    }
}
echo $msg;
?>

Answer 1

只需要做出最小努力的解决方案就是给响应消息框一个id并使用你已经提供的类检查：

$msg = "<div id='responseBox' class='message-success'>Access Granted! Please wait...</div>";

如果出现错误：

$msg = "<div id='responseBox' class='message-error'>Password mismatch. Please try again!</div>";

在你的ajax回调中，只需检查该框是否包含错误类或成功类：

success: function(html){
    $('.message').html(html).fadeIn(2000);
      if($('.message').find('#responseBox').hasClass('message-success')){
          window.location.replace("dashboard.php"); }, 2000);
      }
    });
    return false;

}

Answer 2

尝试这个，我只是重构了你的代码，我希望它会有所帮助。

登录-process.php

<?php
include'config/db.php';
// $msg = null;
$msg = array();
$date = date('Y-m-d H:i:s');

$uname  = (!empty($_POST['username']))?$_POST['username']:null;
$pass   = (!empty($_POST['password']))?$_POST['password']:null;

if($_POST){
    $stmt = "SELECT * FROM members WHERE mem_uname = :uname";
    $stmt = $pdo->prepare($stmt);
    $stmt->bindValue(':uname', $uname);
    $stmt->execute();
    $checklgn = $stmt->rowCount();
    $fetch = $stmt->fetch();

    if($checklgn > 0){
        if(password_verify($pass, $fetch['mem_pass'])){
            session_start();
            $_SESSION['sanlogin'] = $fetch['mem_id'];
            $msg['ok'] = TRUE;
            $msg['msg'] = "<div class='message-success'>Access Granted! Please wait...</div>";
            // $msg = "<div class='message-success'>Access Granted! Please wait...</div>";
        }else{
            // $msg = "<div class='message-error'>Password mismatch. Please try again!</div>";
            $msg['wrong'] = TRUE;
            $msg['msg'] = "<div class='message-error'>Password mismatch. Please try again!</div>";
        }
    }else{
        // $msg = "<div class='message-error'>User not found. Please try again!</div>";
        $msg['notfound'] = TRUE;
        $msg['msg'] = "<div class='message-error'>User not found. Please try again!</div>";
    }
}
echo json_encode($msg);
?>

Ajax脚本

<script type="text/javascript">
$(document).ready(function() {
    $("#submit").click(function() {
        var dataString = {
            username: $("#username").val(),
            password: $("#password").val()
        };
        $.ajax({
            type: "POST",
            url: "login-process.php",
            data: dataString,
            cache: true,
            dataType: 'json',
            beforeSend: function() {
                $('#loading-image').show();
            },
            complete: function() {
                $('#loading-image').hide();
            },
            success: function(html) {
                $('.message').html(html.msg).fadeIn(2000);
                if (html.ok) {
                    setTimeout(function() {
                        window.location.replace("dashboard.php");
                    }, 2000);
                }
            }
        });
        return false;
    });
});
</script>

Answer 3

更好的方法是设置适当的响应状态代码并检查前端的状态代码。在响应文本上绑定字体结尾意味着您必须始终记住不要更改它（如果添加本地化，也不会起作用）。

在PHP中，您可以使用http_response_code设置状态代码。请参阅以下答案：PHP: How to send HTTP response code?。

用于身份验证的相应状态代码可以是403（禁止），401（未经授权），甚至是404（未找到）。

在字体结尾处，使用$.ajax的{{1}}回调。

statusCode

Answer 4

您可以使用调试器，然后逐行检查您的代码过程。

您可以使用“调试器”，它是javascript的一部分。

例如，在您的代码中，您可以使用2或3个调试器，如：

    <script type="text/javascript">
$(document).ready(function() {
    $("#submit").click(function() {
        var dataString = {
            username: $("#username").val(),
      password: $("#password").val(),
        };
    debugger;
    $.ajax({
            type: "POST",
            url: "login-process.php",
            data: dataString,
            cache: true,
      beforeSend: function(){
        $('#loading-image').show();
      },
    debugger;
      complete: function(){
        $('#loading-image').hide();
      },
      success: function(html){
        $('.message').html(html).fadeIn(2000);
                setTimeout(function(){ window.location.replace("dashboard.php"); }, 2000);
            }
        });
       debugger;
        return false;
    });
});
</script>

进行此更改后，您可以在浏览器中运行代码，然后按 “Ctrl + Shift + I”然后按F10键刷新页面并调试代码。

我相信这对你有用。谢谢你:)）

在重定向Ajax请求之前添加检查

4 个答案: