首頁 > 文章 > 後端開發 > PHP+Ajax實作驗證碼的即時驗證功能

PHP+Ajax實作驗證碼的即時驗證功能

墨辰丷原創: 2018-06-01 17:03:061470瀏覽

這篇文章主要為大家詳細介紹了PHP Ajax實現驗證碼的即時驗證，有興趣的小夥伴們可以參考一下

PHP的影像處理功能強大，做一張驗證碼圖片也是非常簡單的，但是，在實現實時驗證時，確遇到了一個難題：
我用nat123對我的電腦上的網站進行端口映射，實現了在外網訪問，本來是採用cookie的方式用js對驗證碼進行驗證，但是經檢驗發現nat123雖然使我的網站可以通過一個自定義的網址進行訪問，但是產生驗證碼的php文件在網絡上的位置竟然和其它頁面不在一個域，經查詢得知，因為輸出圖片的緣故，被當作快取檔案映射在了某個資料夾內，所以－－其他頁面在我的網址下，產生驗證碼的頁面又在另一個網址裡，所以它們的cookie不能共用，不管怎麼設定path和domain都不管用，於是我只好採用session儲存驗證碼了，因為session存在於伺服器，也就是在我本地網址中都可以存取。
接下來是重頭戲，之前只是粗略了解過ajax，對於它的用途和特性還是知道的，獲取後台來的數據這個比較泛泛的概念具體的使用起來就不知道如何下手了。
首先，我分析了一個範例的程式碼，用途是取得後台的一個文字檔案的內容：

function getHTTPObject(){
  if(typedef XMLHttpRequest == "undefined")
    XMLHttpRequest = function(){
      try{ return new ActiveXObject("Msxml2.XMLHTTP.6.0");}
      catch(e){}
      try{ return new ActiveXObject("Msxml2.XMLHTTP.3.0");}
      catch(e){}
      try{ return new ActiveXObject("Msxml2.XMLHTTP");}
      catch(e){}
      return false;
    }
    return new XMLHttpRequest();
}
function getNewContent(){
  var request = getHTTPObject();
  if(request){
    request.open("GET","TEST.txt",true);
    request.onreadystateschange = function(){
      alert(request.responseText);
    }
  }else{
  alert("no support XMLHttpRequest!");
  }
}

##其中的關鍵是：

  request.open("GET","TEST.txt",true);
    request.onreadystateschange =function(){
      alert(request.responseText);
    }

這三句指定了GET請求發向的頁面和XMLHttpRequest物件送回回應的時候觸發的處理函數，而資料正是透過request.responseText取得的。

-------------------------------------------- ------------------------------------

可是我要取得的資料是後台php檔案產生的驗證碼，怎麼讓後台發送驗證碼？

無論GET或POST方式都是把資料傳送到後台，ajax從哪裡取回後台的資料呢？
百思不得其解之下，我又查詢了另一本資料，找到一個範例：
其中XMLHttpRequest物件送回回應的處理語句是：

request.onreadystateschange=alertContent;
function alertContent(){
...
  alert(request.responseText);
...
}

請求的檔案為check.php

其中有這麼幾句條件輸出：

if($info){
  echo "你的用户名可以使用";
}else {
  echo "该用户名已被注册";
}

而運行實例效果圖中赫然在靜態頁面彈出訊息框，內容如check.php頁面的輸出！！！

也就是說ajax能請求到一個php頁面的輸出內容，於是，接下來簡單多了，因為圖片也是驗證碼頁面的輸出，所以不能直接ajax驗證碼頁面，不然就把圖片的資料也獲取了。
新建一個php頁面：

sission_start();
$code="";
if(!empty($_session[&#39;check&#39;]))$code=$_session[&#39;check&#39;];
echo $code;

再在前端用ajax向這個頁面GET一個請求，就能用request.responseText取得驗證碼了。

接著把驗證過程封裝在一定條件觸發的函數裡，即可即時驗證。

總結：以上就是這篇文章的全部內容，希望能對大家的學習有所幫助。

PHP+Ajax實作驗證碼的即時驗證功能

相關文章