Güvenlik Kodu Captcha sistemi ile Spam botlardan korunmak en etkili yollardan biri. Şimdi web sitelerimizin ziyaretçilerinin işini biraz kolaylaştırması açısından Ajax yardımı ile bir Captcha doğrulaması yapalım.
Bu doğrulamada resimdeki karaktarlerin yanlış girilmesi durumunda form gönderilmeden önce bir uyarı çıkmasını sağlayacağız.

 

 

CODE:
  1. <html> <head> <title>Ajax Captcha</title> <script language="JavaScript">
  2.  var url = 'captcheck.php?code=';
  3.         var captchaOK = 2// 2 - kontrol edilmedi, 1 - doğru, 0 - yanlış
  4.         function getHTTPObject()
  5.         {
  6.         try {
  7.         req = new XMLHttpRequest();
  8.           } catch (err1)
  9.           {
  10.           try {
  11.           req = new ActiveXObject("Msxml12.XMLHTTP");
  12.           } catch (err2)
  13.           {
  14.           try {
  15.             req = new ActiveXObject("Microsoft.XMLHTTP");
  16.             } catch (err3)
  17.             {
  18.     req = false;
  19.             }
  20.           }
  21.     }
  22.         return req;
  23.     }
  24.         var http = getHTTPObject(); // HTTP objesini yarattık       
  25.         function handleHttpResponse() {
  26.         if (http.readyState == 4) {
  27.             captchaOK = http.responseText;
  28.             if(captchaOK != 1) {
  29.               alert('Girdiğiniz kod yanlıştır. Tekrar deneyin');
  30.               document.myform.code.value='';
  31.               document.myform.code.focus();
  32.               return false;
  33.               }
  34.               document.myform.submit();
  35.            }
  36.         }
  37.         function checkcode(thecode) {
  38.         http.open("GET", url + escape(thecode), true);
  39.         http.onreadystatechange = handleHttpResponse;
  40.         http.send(null);
  41.         }
  42.         function checkform() {
  43.         // İlk önce form doğrulaması
  44.         if(document.myform.req.value=='') {
  45.           alert('lütfen gerekli alanları doldurun');
  46.           document.myform.req.focus();
  47.           return false;
  48.           }
  49.         if(document.myform.code.value=='') {
  50.           alert('Lütfen resimdeki kodu girin');
  51.           document.myform.code.value='';
  52.           document.myform.code.focus();
  53.           return false;
  54.           }
  55.           // Ajax captcha doğrulaması
  56.           checkcode(document.myform.code.value);
  57.           return false;
  58.         }   
  59.            </script> </head> <body> <form action="landing.php" method="post" name="myform"> <table> <tr><td>Gerekli Alan:</td> <td><input type="text" name="req" value=""/></td></tr> <tr><td>Opsiyonel
  60.                 Alan:</td> <td><input type="text" name="opt" value=""/></td></tr> <tr><td>Captcha
  61.                     Resmi:</td> <td><img src="captcha.php" border="0"/></td></tr> <tr><td>
  62.                     Kod Doğrulama:</td> <td><input type="text" name="code" value=""/></td></tr> <tr><td></td> <td> <input type="submit" value="Formu Gönder" onclick="return checkform()"/></td> </tr> </table> </form> </body> </html>

Burada resim dosyamızın captcha.php tarafından yaratıldığını görebilirsiniz, captcha.php dosyası ile rasgele karakter ve sayıları bir arkaplan resmi üzerine yazdırabiliyoruz.
Bu konu ile içli dışlı olanlar yukarıdaki kodların çoğunu biliyorlardır zaten.
Bu formda en önemli bölüm checkform() kısmıdır. checkform() ile form uygunluk işlemlerini (eksik alan) kontrol ettirebiliyoruz. Tüm bu kontrollerden sonra checkcode(). ile de resimdeki kodumuzun doğru olup olmadığına bakabiliyoruz.
Resimdeki kod
captcheck.php?code={resimdeki kod } ile captcheck.php adresine gönderiliyor ve kontrol ediliyor.

PHP:
  1. <?php
  2. // Session'ı başlatıyoruz
  3. // Kodun doğruluğunu kontrol ediyoruz
  4. if(strtoupper($_GET['code']) != $_SESSION['secret_string'])
  5.  {
  6.  echo '0'; // Yanlış
  7.  } else {
  8.  echo '1'; // Tamam
  9.   }
  10. ?>

Burada strtoupper() fonksiyonu ile kullanıcının kodunu alıyor ve session'daki değer ile karşılaştırıyoruz. Eğer yanlış ise "0" doğru ise "1" olarak belirtiyor.

Favorilerinize Ekleyin.
  • BlinkList
  • del.icio.us
  • Digg
  • Netvouz
  • DZone
  • ThisNext
  • MisterWong
  • Wists
  • blogmarks
  • Blue Dot
  • Furl
  • Netscape
  • NewsVine
  • Reddit
  • Shadows
  • Technorati
  • YahooMyWeb
  • Fark
  • feedmelinks
  • Fleck
  • kick.ie
  • LinkaGoGo
  • Linkter
  • MyShare
  • Spurl
  • Webride