2013-03-20 47 views
0

我製作了一個簡單的程序來模擬使用AJAX和PHP進行身份驗證。以下是我的代碼。它會重定向到「/?」但沒有發生。我試圖在onclick事件中使用checkLogin(); return false;,但它不起作用。使用AJAX和PHP進行身份驗證

的index.php

<script type="text/javascript" src="validation.js"></script> 
<form> 
    <p> 
     <label>Username <abbr title="Required">*</abbr></label> 
     <input id="usernamelogin" type="text" value="" /> 
    </p> 
    <p> 
     <label>Password <abbr title="Required">*</abbr></label> 
     <input id="passwordlogin" type="text" value="" /> 
    </p>     
    <p> 
     <input id="login" type="submit" value="Login" onclick="checkLogin()" /> 
    </p> 
</form> 

validation.js

function checkLogin(){ 
    var u = document.getElementById("usernamelogin").value; 
    var p = document.getElementById("passwordlogin").value; 

    if(window.XMLHttpRequest){ 
     xmlhttp = new XMLHttpRequest(); 
    } 
    else{ 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onReadystatechange = function(){ 
     if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ 
      if(xmlhttp.responseText == u){ 
       alert(':)'); 
      } 
      else{ 
       alert(':('); 
      } 
     } 
    } 

    xmlhttp.open("GET", "login.php?u=" + u + "&p=" + p, true); 
    xmlhttp.send(); 
} 

的login.php

<?php 
    $u = $_GET['u']; 
    $p = $_GET['p']; 

    $host = 'localhost'; 
    $user = 'root'; 
    $pass = ''; 
    $db = 'db'; 

    $con = mysql_connect($host, $user, $pass); 
    if(!$con) die("Could not connect: " . mysql_error()); 

    mysql_select_db($db, $con); 
    $query = "select username from login where username = '" . $u . "' and password = '" . $p . "'"; 
    $result = mysql_query($query); 
    $row = mysql_fetch_array($result); 
    echo $row['username']; 
    mysql_close($con); 
?> 
+0

爲什麼不使用'/ login.php'來確保它將對當前URL執行獨立於同一個URL的請求。您還可以檢查是否使用Chrome或Firebug for Firefox的開發工具執行任何XHR請求? – 2013-03-20 00:25:21

+0

如果你喜歡,我有建議 1)mysql_ *被刪除 2)這種身份驗證方法非常弱! – 2013-03-20 00:25:49

+0

不是你的問題的答案,但你沒有清理你的db輸入,這是非常危險的。生產當然不安全。 – Christopher 2013-03-20 00:26:42

回答

2

我下面的代碼

xmlhttp.onReadystatechange 

改變

xmlhttp.onreadystatechange 

它的工作原理。並且在輸入type="submit"中也使用onclick="checkLogin(); return false;"

0

你可以做的是去除日Ë的onclick從輸入事件類型=「提交」,並將其添加到窗體:

<form onsubmit="return checkLogin()"> 

爲了讓這項工作,你必須

return false 

添加到您的javascript函數,你收權之前功能

+0

感謝您的回答,但沒有奏效。我得到的結果與'onclick ='checkLogin()'時相同。返回false;'在input type =「submit」中。 – shankshera 2013-03-20 00:35:28