28 Kasım Pazartesi ´11   —   4 Yorum
Bir suredir yavas da olsa yeniden duzenledigim mfyz.com kodlarini sonunda arayuz kismiyla daha cok zaman harcayip oynayabilecegim bur sekle soktum. Ozellikle tum arayuz parcalarini phptal, less ustune oturtmaya baslamistim. Simdi herhalde su ana kadarki en buyuk degisikligi yaptim ve giris sayfasini yeniledim.



Su an giris ve sifre hatirlatma sayfalari basit bir arayuzle goruntuleniyor, birkac adim sonrasinda bunu lightbox ile normal sayfalarin uzerinde cikacak sekile getirebilirim veya bu sayfalar javascripti olmayan insanlar icin failsafe sayfalar olarak da kalabilir.

Bol bol css3 ve webkit ozellikleri kullanarak hazirladim, sadece kapat tusundaki ikon imaj olarak bir sprite'dan geliyor, gerisi tamamen css3. Tabi less ile cok daha hizli yazip derliyorum css'leri.

Simdi tum bolumleri tek tek sadelestirip eski arayuze ait kodlari temizlemeye calisiyorum. Bitirdigimde artik UX, fonksiyonaliteye odaklanabilirim. Tabi icerigi de ihmal etmemeye calisacagim.

Neden bahsediyorum ? :-)


Artık neredeyse her sitede olan üyelik, bazı web uygulamaları için vazgeçilmez oldu. Çünkü üyelere ait özelleştirilmiş siteler her zaman daha popülerleşti. Bunu bir gerekli yanı da sistem güvenliği ve hizmet takibi. Mesela yaptığınız projede yapılacak saldırılarda 1-1 KİŞİ tespiti yapabilmenizi sağlayan mekanizma da aslında üye takibidir. Bazı projelerde ise hizmetinizi sınırlamak istediğiniz insanlar olabilir. Üye statü'leri izinleri veya kayıta kapalı (veya davetli) üyelikler ile hizmetinizi hedef kitlene sınırlayabilirsiniz.
Neyse üyeliğin yararlarını geçelim. Buraya öğrenmeye geldik :-)

Neye ihtiyacımız var?

Tabiki bir veritabanına, mysql kullandığımızı varsayarak kod örnekleyeceğim. Ama postgresql fln kullanan arkadaşlar da var ise bu dökümandaki algoritmayı izleyerek kolayca kendileri de kod yazabilirler. Aşağıda veritabanında kullanacağımız üye tablosuna ait veri yapısını import ederek kolayca oluşturabileceğiniz SQL sorgusunu koyuyorum, bu sorgudan hangi alanlar ve özelliklerinin neler olduğunu da kolayca görebilirsiniz.
CREATE TABLE `uyeler` (
  `no` int(10) NOT NULL auto_increment,
  `kadi` varchar(50) NOT NULL default '',
  `sifre` varchar(100) NOT NULL default '',
  `izin` varchar(20) NOT NULL default '',
  `adi` varchar(100) default NULL,
  `eposta` varchar(255) default NULL,
  PRIMARY KEY  (`no`)
) ENGINE=MyISAM AUTO_INCREMENT=1 ;
gördüğünüz gibi basitçe 6 alanım var, burada no, izin, adi ve eposta alanları sistemin düzgün çalışması için şart olan alanlar değiller fakat üyeniz hakkında küçük bir bilgi tutmanızı sağlar. Eğer isterseniz buradaki alan sayınızı artırarak yeni üye detayları ekleyebilirsiniz. Mesela MSN adresi, web sitesi, ev adresi, cep telefonu, kimlik bilgileri mesleği falan fişman.

Şimdilik kayıtlı bir kullanıcının giriş yapmasını vae sayfalarda kullanının giriş yapıp yapmadığını yani oturumunu kontrol etmeyi göstereceğim. Bildiğiniz gibi kayıt işlemi basitçe bir formdan mysql'e veri kaydetme işlemi.. Buna dökümanın sonunda değineceğim.

Giriş işlemi

Giriş işlemini yapcağımız bir form hazırlayın. Kullanıcı adı ve şifre giriş alanları olacak olan 2 input'luk bir form. “kadi” ve “sifre” gibi pratik alan adları belirlerseniz işiniz kolaylaşır. Bu formu giris.php diye bir işlem sayfanıza post methodu ile göndereceğiz. Şuna benzer bir form olacaktır :
<form name="giris" action="giris.php" method="post">

 <table cellpadding="8" cellspacing="0" align="center">
   <tr>
     <td width="100">Kullanıcı Adı</td>
     <td><input type="text" name="kadi"></td>
   </tr>
   <tr>
     <td width="100">Şifre</td>
     <td><input type="password" name="sifre"></td>
   </tr>
   <tr>
     <td colspan="2" align="right">
       <input type="submit" value="Giriş">
     </td>
   </tr>
 </table>

</form>
Giriş işlemi sayfamızın (giris.php) koduna bakacak olursak :
<?php

# mysql baglantisi, sesion_start yapilmis varsayiyoruz

# bilgiler
  $kadi  = $_POST["kadi"];
  $sifre = $_POST["sifre"];

# kullanici bilgisi alalim
  $sorgu = mysql_query("select sifre from uyeler where kadi = '".$kadi."'");
  if( mysql_num_rows($sorgu) != 1 ){
    print '<script>alert("Kullanıcı bulunamadı!");history.back(-1);</script>';
    exit;
  }else{
    # veriyi alıyoruz
      $bilgi = mysql_fetch_assoc($sorgu);
  }

# sifre eslestirmesi
  if( md5( trim($sifre) ) != $bilgi["sifre"] ){
    print '<script>alert("Yanlış şifre girdiniz!");history.back(-1);</script>';
    exit;
  }

# başarılı giriş yapıldı
# oturuma kaydedip anasayfaya gidelim
  $_SESSION["giris"] = md5( "kullanic_oturum_" . md5( $bilgi["sifre"] ) . "_ds785667f5e67w423yjgty" );
  $_SESSION["kadi"]  = $kadi;

?>
<script>
  alert("Başarıyla giriş yaptınız! Şimdi anasayfaya yönlendiriliyorsunuz.");
  window.top.location = './';
</script>
gördüğünüz gibi kontrol kısmında çok karmaşık bir kod yok. MySQL'den kullanıcıya ait veri alıyoruz. Eğer gelen kayıt kümesinin boyutu 1 değilse üye adı yok demektir. Hata veriyoruz. Eğer 1 ise kayıt kümesini $bilgi dizisine alıyoruz. Alt kısımda da girilen şifrenin md5'ini veritabanındaki string ile karşılaştırıyoruz. Çünkü veritabanında şifrelerimizi md5'leyip saklıyoruz. Çünkü birisi veritabanımızı araklarsa md5'i çözemesin diye. Üye bilgilerinin güvenliğini sağlamış oluyoruz.

En altta ise giriş kontrolü için oturuma 2 değişken attım birisi şifre ile oluşturulmuş karışık bir cümlenin md5'li hali. Bunu giriş kontrolünde oturumda olup olmadığını kontrol etmek için kullanacağız. Sadece kullanıcı adı kullanmamamın nedeni ise sunucu yönetimindeki birinin oturumları oynayıp giriş yapmış kullanıcı hakkını değiştirememesi için oldukça basit bir engel o kadar. İsterseniz daha karmaşık kriptografik anahtarlar da oluşturabilirsiniz. Bu sitede sadece anahtar tutulur mesela. Oturum bilgileri veritabanında saklanır.. Bu tarz gelişmiş şeyler için de beyin fırtınası yapıp güzel şeyler yazabilirsiniz.

Şimdi giriş yapıldıktan sonra anasayfa'ya yönlendirildi üye, peki biz sayfalarımızda oturumu gezen misafirin üye olup olmadığını nasıl anlayacağız?

Üye kontrolü, üye oturumu yönetimi

Benim site geliştirme yoluma göre ilk önce sitenin statik sayfasını hazırlayıp parçalardık hatırlarsanız. Ve her işlem/modül dosyamızın başında mysql.php veya ayar.php gibi bir include edilen dosyamız vardır. İşte buna giris_kontrol.php diye bir dosya daha ekleyin. Yani; üye'lere ait bilgileri alacağınız sayfalarda (üye kontrolü, üye alanları fln) giris_kontrol.php diye bir php include ettirin. Her sayfanıza. giris_kontrol.php dosyamızın kodunu verip açıklayayım :
<?php

# uye oturum degiskenleri
  $giris_yapilmis = false;
  $uye = false;

# kontrol ederek bilgileri dogrulayalim
  if( !empty($_SESSION["giris"]) && !empty($_SESSION["kadi"]) ){
  
    # kulanici bilgisini alalim
      $sorgu = mysql_query("select * from uyeler where kadi='".$_SESSION["kadi"]."'");
      if( mysql_num_rows($sorgu) == 1 ){
      
        $uye = mysql_fetch_assoc($sorgu);
        # anahtar kontrol
          if( $_SESSION["giris"]  ==  md5( "kullanic_oturum_" . md5( $uye["sifre"] ) . "_ds785667f5e67w423yjgty" ) ){
            $giris_yapilmis = true;
          }else{
            # giris yanlis. $uye'yi silelim
            $uye = false;
          }
      }
  }

?>
Tabiki bu sayfadan önce mysql ve ayar dosyanızın fln include edildiğini ve session_start yapılmış olduğunu düşünüyoruz çünkü bu sayfayı her sayfanın başında include ediyoruz.

Oturumdaki kadi değişkeni boş değilse veritabanından bilgileri alıyoruz. Eğer kullanıcı yoksa oturum açılmıyor zaten. Eğer şifre ile oluşturulan karışık cümlenin md5'i oturumdaki giris degişkeninin içeriğine eşitse bizim mantıksal koyduğumuz anahtar da doğrudur. Şimdi “giris_yapilmis” değişkenini true yapıyoruz ve $uye dizisine mysql sonuç kümesini atıyoruz. Neden bunu yapıyoruz çünkü, sayfalarımızda doğrudan $giris_yapilmis'i if yapılarımızda giriş yapılmış yapılmamış olduğunu hızlıca alabileceğiz. Mesela üyelere özel bir sayfanız var ise bu sayfanın başında;
if( !$giris_yapilmis ){
  print 'Bu sayfa üyelere özeldir! Lütfen giriş yapın!';
  exit;
}
diyerek giriş yapmamış kullanıcıların o sayfaya erişimini engelleyebilirsiniz.
Eğer üyeye ait bilgilere ihtiyacınız var ise zaten doğrudan $uye dizisinden alabilirsiniz.
Mesela giriş formunun yerine Hoşgeldin X dedirtmek için ile X yerine kullanıcı adını basabilirsiniz.

Kayıt işlemi

Kayıt işleminin mysql'e veri kaydetmek dışında bir kısmı olmadığından örneklemeye gerek duymuyorum. Sadece şifreyi veritabanına md5 fonksiyonundan geçirip kaydediyoruz. Onun dışındaki kontroller ve veri kayıdını yapamayacağınızı düşünmüyorum.


Hazırlayan : Mehmet Fatih YILDIZ
Konsollarda kullanıcı giriş alanı gelmeden önce /etc/issue dosyasından bazı kurallara göre çıktı yaratılır. Salt metin olarak da çıktı verebileceğimiz gibi bu çıktıyı özelleştirebiliriz. Normalde;
login :
şeklinde görünen kısmı;
Mehmet Fatih YILDIZ'in bilgisayarina ho$geldiniz!
Bugun : 01.12.2004 12:00
Cekirdek : Linux-2.6.7-r12
Makine Adi : mfyz
login :
şekline getirebilirsiniz.
Statik çıktısını almak istediğiniz şeyleri öncelikle girin; daha sonra kuralları ekleyeceğiz. Bunlar o andaki tarih, bulunan konsol aygıtı, çekirdeğin versiyonu veya adı, makine adı gibi ayrıntılı kurallar ekleyebileceğiz; aşağıdaki kuralları tersbölü (backslash)(\) ile kullanın;
d     O andaki tarih                              Örnek : 01.12.2004
t     Zaman
u     Login olmuş kullanıcı sayısı
o     Makinenin ifade ettiği domain adı
n     Makinenin adı (hostname olarak geçer) 
m     Makinenin işlemci mimarisi                  Örnek : i486
s     Sistem adı
r     Çekirdek numarası                           Örnek : 2.6.7
v     İşletim sisteminin versiyonu
l     Bulunulan konsol aygıtı                     Örnek : tty1

Öneri : ASCII teknikleri kullanarak Konsol giriş başlıklarınızı daha düzenli hale getirebilirsiniz.
Mesela çoğu dağıtım için "ascii art" logolar, maskotlar veya sloganlar geliştirilmiştir. (http://www.asciiartfarts.com/linux.html)
Hazırlayan : Mehmet Fatih YILDIZ

Popüler Etiketler

wireless share css javascript cache htaccess apache apple windows open source lisans icon ikon grafik download html xhtml rss applications macosx free language social media sosyal medya facebook twitter link wordpress dokuman plugin mootools jquery firefox startups kontrol yapıları if while job developer mfyz blog imza signature mail google network app banner calendar php logo phpstorm jetbrains mysql pgsql sql mssql ide editor sitemap seo iOS parse xml kitap url service tool search ajax xmlhttprequest server framework compile nedir linux fstab ntfs pear mdb2 prepare execute gimp workspace kurulum cms injection ui ux css3 icons lifestream proje widget design portfolio integration api internet newsletter subscription html5 mobile browsers table db database login session js svn subversion git version control deployment örnek kod generator internet explorer ie support browser ubuntu date diff coding form input iphone regex assets howto query select wanda digital konsol route router mod_rewrite ruffles oyun auth spam webkit chart osx statistics istatistik insanlar cookie zaman export button notebook laptop license terminal nasıl switch optimizasyon ipad itunes opengraph fql optimization meta graph less compiler on-the-fly tarih screen music www subdomain redirect crossdomain code development web app ios bootstrap object app store store in-app purchase purchase verification storekit itunes connect pharma hack connect tebrik ipucu radio style player box analyse procedure http textarea doritos kampanya tytz