javascript - AJAX/PHP 登录 - 错误消息不起作用

Question

我有一个登录系统，用户可以在其中输入他们的凭据，它会将他们重定向到网站的“客户端” View 或“管理员” View 。这工作正常。

我的问题是，当用户输入不正确的凭据信息时，系统会显示我的错误消息，即无效的用户名和密码。

这是我的登录表单:

<form name="ajaxform" id="ajaxform" action="auth/ajax-auth.php" method="POST" >
    <h4>Client Login</h4>
        <div id="error"></div>
            <label for="username" class="col-sm-2 control-label">Username</label>
            <input id="username" class="form-control" name='username' placeholder="Username">
            <label for="password" class="col-sm-2 control-label">Password</label>
            <input type="password" class="form-control" id="password" name='password' placeholder="Password">
        </div>
        <div class="modal-footer">
            <button type="button">Close</button>
            <button type="submit" id="loginbtn">Login</button>
        </div>
</form>

现在，如果用户输入错误的凭据，我的错误消息应该显示在 <div id="error"></div> 中.

这是ajax-auth.php看起来像:

session_start();

error_reporting(E_ALL);                //THIS IS AMAZING0
ini_set('display_errors', 1);          // <----

$username = $_POST['username'];
$password = $_POST['password'];

include '../connection.php';
$dbc = mysqli_connect(DB_HOST, DB_USER, DB_PASSWORD, DB_NAME);

$sql = "SELECT * FROM users WHERE username='$username' AND password='$password'";

$result = mysqli_query($dbc, $sql);

    if (mysqli_num_rows($result) == true)
    {
        $_SESSION["username"] = $username;

        $row = mysqli_fetch_array($result);
        if ($row["permission"] == 2)
        {
            $_SESSION["permission"] = 2;
            // Redirect to the admin login page.
            echo 'admin';
        }
        else if ($row["permission"] == 1)
        {
            $_SESSION["permission"] = 1;
            $_SESSION["userId"] = $row["user_id"];
            $_SESSION["account"] = $row["account_id"];
            echo 'client';
        }
    }
    else
    {
        echo "User not found!";
        header("Location: ../index.html");
    }

最后是处理重定向的 AJAX 函数。

$("#ajaxform").submit(function(e)
                          {
        e.preventDefault();
        var username=$("#username").val();
        var password=$("#password").val();
        var dataString = 'username='+username+'&password='+password;
        if($.trim(username).length>0 && $.trim(password).length>0) {
            $.ajax({
                type: "POST",
                url: "auth/ajax-auth.php",
                data: dataString,
                cache: false,
                beforeSend: function(){ $("#loginbtn").val('Connecting...');},
                success: function(data){
                    if(data) {
                        //alert(data + " Logged in!");

                       if(data == "admin"){
                           window.location.href = "/TTW-Website-Final/admin/admin.php";
                       }
                       else if(data == "client"){

                        //uncomment when index.php page is ready
                        //window.location.href = "index.php";

                        window.location.href = "index.html";

                       }

                    } else {
                        $("#error").html("<span style='color:#cc0000'>Error:</span> Invalid username and password. ");
                        $("#loginbtn").val('Submit')
                    }
                }

            });            
        }

当我在我的表单中输入错误的凭据并点击登录时，什么也没有发生，我似乎无法弄清楚为什么。它应该显示我的 Ajax 函数中的错误消息。

$("#error").html("<span style='color:#cc0000'>Error:</span> Invalid username and password. ");

我在这里做错了什么？

我知道我已经接近让它按我需要的方式工作了，这可能是我忽略的一些非常愚蠢的事情，我们将不胜感激任何帮助。

Answer 1

在 jeroen 的帮助下，我明白了我做错了什么。

如果我的查询结果返回 false，我应该回显一个值，然后在我的 AJAX 函数中有第三个选项来处理返回到我的成功函数的值。

这是我对 PHP 所做的更改:

if(mysqli_num_rows($result) == true)
    {
        $_SESSION["username"] = $username;

        $row = mysqli_fetch_array($result);
        if ($row["permission"] == 2)
        {
          $_SESSION["permission"] = 2;
          // Redirect to the admin login page.
          echo 'admin';
        }
        else if ($row["permission"] == 1)
        {
           $_SESSION["permission"] = 1;
           $_SESSION["userId"] = $row["user_id"];
           $_SESSION["account"] = $row["account_id"];
           echo 'client';
        }
    }
    else
    {
        echo "unauthorized";
    }

在我的 AJAX 函数中，我添加了第三个选项来处理这个返回值所发生的情况。

if(data) {
   if(data == "admin"){
        window.location.href = "/TTW-Website-Final/admin/admin.php";
    }
    else if(data == "client"){
        window.location.href = "index.html";
    }
    else if(data == "unauthorized"){
       $("#error").html("<span style='color:#cc0000'>Error:</span> Invalid username and password. ");
       $("#loginbtn").val('Submit')
    }
}

这样做解决了我的问题，如果我添加了不正确的凭据，则会显示我的错误消息。