Ajax İle Login Kontrolü
Bu yazı 2 yıl 5 ay 23 gün önce yayınlanmış olduğundan güncelliğini yitirmiş veya içeriğindeki bilgilerin geçerliliği kaybolmuş olabilir. Herhangi bir yanlış anlaşılmadan bu site sorumlu değildir. Bu yazımda, sayfayı postback etmeden, yani yenileme olmadan kullanıcı girişi nasıl yapılır?, bunun üzerinde duracağım. Sayfanın postback olmadan veri gönderip alması işlemi, Ajax olarak adlandırılır. İlgili veriler arka planda sayfa yenilenmeden işlenir, eğer sonuç alınırsa, ekrana yazdırılmaktadır. Böylece işlerin çok hızlı olması amaçlanmaktadır. ASP.NET ile çalışıyorsanız, “ASP.NET AJAX Control Toolkit” bileşenini Visual Studio’ya kurmanız ve Toolbox’a eklemeniz, ve bu Toolbox üzerindeki “UpdatePanel” ile çalışmanız gerekmektedir. Ben, bu yazıda PHP ile AJAX nasıl kullanılır, bundan bahsedeceğim. Burada anlattıklarım tabii ki ASP.NET’e de uygulanabilir ancak gereği yoktur.
Ajax’ı kullanabilmenin çok çeşitli yolları vardır. En kolayı bir çatı(Framework) kullanmaktır elbette. Birçok JavaScript Framework vardır: ExtJS, Prototype, JQuery bunların en çok popüler olanları. Ben, bu örnekte Prototype Framework kullanacağım. Öteki frameworklerde de, işlem aynı mantıkla işlemektedir.
Öncelikle, kullanıcının giriş yapacağı formu tasarlayalım. Bu formda, şimdilik kullanıcı adı ve şifre alanlarının olması yeterlidir. Örneğin, aşağıdaki gibi bir “index.php” sayfası yapalım:
<html>
<head>
<title>Ajax-Prototype İle Doğrulama</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript">
function Acxdogrula() {
new Ajax.Request("SvsDogrula.php",
{
method: 'post',
parameters: 'Visim='+$F('isim')+'&Vsifre='+$F('sifre'),
onComplete: Acxsonuc
});
}
function Acxsonuc(reqVeri){
$('sonuc').innerHTML= reqVeri.responseText;
}
</script>
</head>
<body>
<h3>Ajax ile doğrulama yapan örnek</h3>
<br /><p id="sonuc"></p><br />
<form action="SvsDogrula.php" method="post" onsubmit="return false;">
Kullanıcı adı (Örnek: mesut):
<input style="background-color: yellow" type="text" id="isim" size="50">
<br />
Şifre (Örnek: password):
<input style="background-color: yellow" type="text" id="sifre" size="50">
<br /><br />
<input type="submit" value="Giriş" onClick="Acxdogrula();">
</form>
</body>
</html>
Sayfayı tasarlamaya başlarken, öncelikle framework’ü, projeye eklememiz gerekmekte. Bu framework dosyasını http://prototypejs.org/ adresinden indirebilirsiniz. Daha sonra, “Acxdogrula” isminde doğrulama fonksiyonumuzu yazmaya başlıyoruz. “new Ajax.Request” ile, yeni bir Ajax isteği tanımlıyoruz ve parametrelerini giriyoruz. Bu arada, Prototype Ajax ile ilgili daha fazla bilgi için, http://www.prototypejs.org/learn/introduction-to-ajax linkini ziyaret edebilirsiniz. Ajax isteğine parametreler gönderilirken, “$F()” ifadesi dikkatinizi çekmiştir. Bu ifade, form üzerindeki elemanlardan içerikleri çekmek için. Örneğin, “isim” id’li elemandan veri çekmek için, “$F(‘isim’)” kullandık. Ajax isteği başarılı olursa, “Acxsonuc” fonksiyonuna gitmekte ve burada da içeriği “sonuc” elemanı içerisine yazdırmaktadır.
Şimdi, Ajax isteğinin gönderileceği “SvsDogrula.php” dosyasını tasarlayalım:
<?php
// Post edilen veriler yakalanıp değişkenlere aktarılıyor
$d_isim =$_POST['Visim'];
$d_sifre =$_POST['Vsifre'];
// Değişkenlerin boş olup olmadıkları kontrol ediliyor
if (empty($d_isim)) {
echo 'Hata: Kullanıcı adı boş olamaz!';
die ();
}
if (empty($d_sifre)) {
echo 'Hata: Şifre boş olamaz!';
die ();
}
// Kullanıcı adı ve şifre kontrol ediliyor
// Bu verileri veritabanından veya dosyadan da alabilirsiniz
if ($d_isim == "mesut" && $d_sifre == "password") {
echo 'Girişiniz Başarılı!:';
echo '<br />';
echo 'Kullanıcı adı: '.$d_isim;
echo '<br />';
echo '<a href="index.php">Çıkış</a>';
}
else echo 'Yanlış Kullanıcı adı veya şifre!';
?>
Burayı da hızlıca geçecek olursak, Post edilen veriler yakalanıp değişkenlere aktarılıyor; boş olup olmadıkları kontrol ediliyor, ve en son-tabi bunlar başarılı olursa, isim ve şifre karşılaştırılmaktadır. Bu verileri veritabanından veya dosyadan çektirmesini de yapabilirsiniz. Bu çalışmayı, http://download.mesuterdemir.com/ajax/ajaxdogrulama.zip adresinden indirebilirsiniz.
Benzer yazılar:
SDU - Bilgisayar Programcılığı mezunuyum. Sıkı bir Linuxçu ve Özgür Yazılım felsefesini benimsemiş biriyim.
