Ajax登录问题

Ajax login issues

本文关键字：问题 登录 Ajax      更新时间：2023-09-26

我有一个Ajax登录功能的问题。我找到了另一个与我的问题相似的问题，但它被证明是没有用的。

我不知道是什么问题，这在另一个程序上也没有问题，希望有人能看到我的错误

从测试中，我认为问题是在"checkLogIn"函数，因为当我运行应用程序时，函数内的警报显示

Ajax: 

$("#checkLogIn").click(function()
{
    $.ajax({
        type: 'POST',
        contentType: 'application/json',
        url: rootURL + '/logIn/',
        dataType: "json",
        data: checkLogIn(),
    })
        .done(function(data)
        {
            if(data == false)
            {
                alert("failure");
            }
            else
            {
                alert("Success");
                $.mobile.changePage("#page");
            }
        })
        .always(function(){})
        .fail(function(){alert("Error");});
});
function checkLogIn()
{       
    alert();
    return JSON.stringify({
        "userName": $("#enterUser").val(),
        "password": $("#enterPass").val(),
    });
}

我还将包括PHP，但是PHP在测试后可以100%工作。

PHP: 

$app->post('/logIn/', 'logIn');
function logIn()
{
    //global $hashedPassword;
    $request = 'Slim'Slim::getInstance()->request();
    $q = json_decode($request->getBody());
    //$hashedPassword = password_hash($q->password, PASSWORD_BCRYPT);

    $sql = "SELECT * FROM users where userName=:userName AND password=:password";
    try {
        $db = getConnection();
        $stmt = $db->prepare($sql);         
        $stmt->bindParam("userName", $q->userName);
        $stmt->bindParam("password", $q->password);
        $stmt->execute();
        //$row=$stmt->fetch(PDO::FETCH_ASSOC);
        //$verify = password_verify($q->password, $row['password']);
        $db = null;
        //if($verify == true)
        //{
        //  echo "Password is correct";
        //}
        //else
        //  echo "Password is incorrect";
    echo "Success";
    } catch (PDOException $e) {
        echo $e->getMessage();
    }
}

我已经注释掉了所有的散列，直到我能让它正常工作

ajax脚本没有问题。根据我的假设，你总是得到Error警报。这是因为您添加了dataType: "json",，这意味着您正在请求rootURL + '/logIn/'作为json Object的响应。但在php中，您只需将Success作为纯文本回显。这使得ajax进入失败函数。因此，您需要以json形式发送响应。有关ajax中contentType和datatype的更多详细信息，请参阅此链接。

所以你需要在php文件中将echo "Success";更改为echo json_encode(array('success'=>true));。现在你会收到Success警报。下面我添加了一个好方法来处理php文件中的json_encoded响应。

$app->post ( '/logIn/', 'logIn' );
function logIn() {
    global $hashedPassword;
    $request = 'Slim'Slim::getInstance ()->request ();
    $q = json_decode ( $request->getBody () );
    $hashedPassword = password_hash($q->password, PASSWORD_BCRYPT);
    $sql = "SELECT * FROM users where userName=:userName";
    try {
        $db = getConnection ();
        $stmt = $db->prepare ( $sql );
        $stmt->bindParam ( "userName", $q->userName );
        $stmt->execute ();
        $row=$stmt->fetch(PDO::FETCH_ASSOC);
        $verify = false;
        if(isset($row['password']) && !empty($row['password']))
            $verify = password_verify($hashedPassword, $row['password']);
        $db = null;
        $response = array();
        $success = false;
        if($verify == true)
        {
            $success = true;
            $response[] = "Password is correct";
        }
        else
        {
            $success = false;
            $response[] = "Password is incorect";
        }
        echo json_encode(array("success"=>$success,"response"=>$response));
    } catch ( PDOException $e ) {
        echo $e->getMessage ();
    }
}

我修改了ajax代码。在这里，我向您展示了如何从json_encoded Object获取响应。

$("document").ready(function(){
    $("#checkLogIn").click(function()
    {
        var post_data = JSON.stringify({
            "userName": $("#enterUser").val(),
            "password": $("#enterPass").val(),
        });
        $.ajax({
            type: 'POST',
            contentType: 'application/json',
            url: rootURL + '/logIn/',
            dataType: "json",
            data: post_data,
        })
        .done(function(data)
        {
            // data will contain the echoed json_encoded Object. To access that you need to use data.success.
            // So it will contain true or false. Based on that you'll write your rest of the code.
            if(data.success == false)
            {
                var response = "";
                $.each(data.response, function(index, value){
                    response += value;
                });
                alert("Success:"+response);
            }
            else
            {
                var response = "";
                $.each(data.response, function(index, value){
                    response += value;
                });
                alert("Failed:"+response);
                $.mobile.changePage("#page");
            }
        })
        .always(function(){})
        .fail(function(){alert("Error");});
    });
});

希望能有所帮助。

相关文章：