使用ajax提交登錄表單

Question

我在其中一種表單中有此javascript。 這是一個登錄表單，我使用API​​樣式從表單本身獲取URL（“不確定我是否理解正確”），但我會將代碼附加到下面

var formup = $('#loginfrom');
formup.submit(function () {
    $.ajax({
        type: formup.attr('method'),
        url: formup.attr('action'),
        data: formup.serialize(),
        success: function (data) {
            alert('you have successfuly logged in');
            window.location = "profile.html";
        }
    });

    return false;
});

這是我從api文件調用的登錄功能

if(!mysql_fetch_array($result)){
return $res;
}
else
    return $resc;

其中$ res返回“錯誤”，而$ resc返回“正確”

和我的api.php

if(!isset($function))
        $resp['err'] = "Function: ".$action." does not exist";
    else
        $resp = $function($request);

當我輸入正確的用戶名和密碼時，它可以正常工作，並定向到用戶配置文件。

但是，如果我輸入的用戶名或密碼不正確，我不知道如何處理。

我確實認為從php返回的內容應該做一些事情告訴javascript登錄不起作用，然后再做其他事情

請提供有關此問題的一些幫助，我們將不勝感激。

Answer 1

該請求總是成功的，因此，您必須檢查data變量的值以重定向到錯誤頁面

...
success: function (data) {
  if ( data == 'correct') {
    alert('you have successfuly logged in');
    window.location = "profile.html";
  } else {
     // handle error
  }
}
...

Answer 2

將您的登錄代碼更改為此

if(!mysql_fetch_array($result)){
  echo 'failure'; die;
}
else    {
    echo 'success'; die;
}

並將您的ajax成功更改為此

success: function (data) {
        if (data == 'success') {
            alert('you have successfuly logged in');
            window.location = "profile.html";
        } else {
             alert('Login Failed');
        }
    }

Answer 3

使用datatype作為json從php獲取返回值。 在下面的代碼中檢查我的建議。

$.ajax({
        type: formup.attr('method'),
        url: formup.attr('action'),
        data: formup.serialize(),
        dataType: 'json',
        success: function (data) {

            if(data.error == 0) {
                alert('you have successfuly logged in');
                window.location = "profile.html";
            } else {

                alert("error");
            }
        }
    });

在您的php文件中，將$ res和$ resc轉換為數組，然后再使用json_encode。 像這樣，

if(!mysql_fetch_array($result)){
    echo array('value'=>$res,'error'=>0);
}
else
    echo array('value'=>$res,'error'=>1);

Answer 4

您可以對數據執行某些操作，也可以讓PHP返回401狀態，如果使用PHP而不是401狀態返回某些內容，則可以讓JavaScript檢查返回的文本：

var formup = $('#loginfrom');
formup.submit(function () {
    $.ajax({
        type: formup.attr('method'),
        url: formup.attr('action'),
        data: formup.serialize(),
        success: function (data) {
            console.log(data);
            // check your console (press F12 in Chrome or Firefox with firebug plugin)
            // do something if the data is valid.
            window.location = "profile.html";
        }
    });

    return false;
});

如果在PHP中登錄失敗，並且您想返回401（導致不調用javascript成功函數，但是在JS中可能需要使用fail / error函數。

header("HTTP/1.0 401 Unauthorized");

並且您需要在javaScript中添加一個失敗回調，以便用戶知道登錄失敗：

    $.ajax({
        ...
        success: function (data) {
          ...
        },
        error: function(){
           //inform the user
        }
    });