Thursday, March 10, 2011

Membuat Login Form dengan PHP & MySQL

Kembali lagi bersama saya di bidang pemrograman. Kali ini saya ingin berbagi sedikit tentang penanganan form menggunakan PHP, untuk contoh kali ini saya akan membuat sebuah login form. Posting ini juga saya buat untuk para praktikan saya yang mungkin butuh pencerahan dalam mengerjakan tugas besar kuliah basis data. Pada posting ini, saya mengasumsikan Anda semua sudah mengerti penggunaan software seperti MySQL dan HTML/PHP editor, jadi saya hanya menjelaskan tentang form dan syntax PHP yang digunakan.
Sebelum kita mulai membuat form, tentunya harus ada database yang akan diakses oleh form yang akan kita buat. Untuk mudahnya, kita buat saja sebuah database yang terdiri dari satu buah tabel dengan field-field username, password, dan nama. Berikut syntax MySQL yang digunakan (langsung kita isi saja data yang kita inginkan) :

CREATE DATABASE IF NOT EXISTS test_login;
USE test_login;
CREATE TABLE IF NOT EXISTS user(
username VARCHAR(20) PRIMARY KEY,
password VARCHAR(32) NOT NULL,
nama VARCHAR(30)
)ENGINE=MyISAM; 

INSERT INTO user VALUES('azme',MD5('12345'),'Fairuz Azmi');

Setelah membuat database, sekarang kita buat tampilan dari login form yang dibuat. Diharapkan Anda sudah mengerti tentang syntax dasar HTML. Berikut contoh syntax yang saya buat :

<html>
<head><title>Tes Login</title></head>

<body>
    <table>
        <form name='form login' method='post' action=''>
        <tr>
            <td>Username</td>
            <td><input type='text' name='user'/></td>
        </tr>
        <tr>
            <td>Password</td>
            <td><input type='password' name='pass'/></td>
        </tr>
        <tr>
            <td></td>
            <td><input type='submit' name='Submit' value='Login'/></td>
        </tr>
        </form>
    </table>
</body>
</html>

File di atas kita simpan dengan nama "login.php". Setelah tampilan login form kita buat, selanjutnya kita membuat sebuah halaman yang lain yang akan dituju saat proses login berhasil. Berikut contoh syntax yang saya buat (simpan dengan nama "welcome.php") :

<html>
<head><title>Welcome</title></head>

<body>
    Selamat Datang, <?php echo($nama); ?>
    <br>
    <br>
    <a href='logout.php'>Logout</a>
</body>
</html>
Sebelum kita mulai melakukan manipulasi database, tentunya sebelumnya kita harus mengkoneksikan tampilan yang kita buat dengan database. Setiap file tampilan harus memanggil fungsi ini, sehingga untuk memudahkan programmer cukup dibuat sebuah file terpisah untuk koneksi ke database yang tinggal dipanggil oleh file tampilan yang membutuhkan. Berikut syntax untuk mengkoneksikan ke database (simpandengan nama "db.php") :

<?php
    //untuk membuat variabel di PHP selalu diawali tanda $
    //contoh $a,$nama
    $db_host='localhost'; //host MySQL server Anda
    $db_user='root'; //username MySQL Server Anda
    $db_pass=''; //password MySQL Server Anda
    $db_name='test_login'; //nama database yang akan digunakan
   
    //lakukan koneksi ke MySQL Server, tampilkan pesan error jika gagal
    mysql_connect($db_host,$db_user,$db_pass) or die('Koneksi Gagal');
   
    //pilih database yang akan diakses
    //fungsi ini sama dengan perintah USE di MySQL
    mysql_select_db($db_name) or die('Database Tidak Ditemukan');
?>

Setelah membuat file untuk koneksi database, saatnya kita memasukkan fungsi-fungsi PHP dengan mengedit file tampilan. Berikut adalah file tampilan yang sudah disisipi fungsi-fungsi PHP (untuk file "login.php") :

<?php
    include('db.php');
    session_start();
    if($_POST['Submit']=='Login'){
        /*
        variabel $username dan $password di-post dari form yang kita buat dengan mengambil nama dari input yang di-post
        $username di-post dari input text dengan name='user'
        $password di=post dari input password dengan name='pass'
        */
        $username=$_POST['user'];
        $password=$_POST['pass'];
        //syntax MySQL sudah saya ajarkan di modul 1 dan 2
        //mudah-mudahan dapat dimengerti syntax MySQL berikut
        $sql=mysql_query("SELECT `username`,`password` FROM `user` WHERE `username`='$username'") or die('Syntax error');
        list($user,$pass)=mysql_fetch_row($sql);
        
        //Cek apakah password yang diinput sesuai dengan password yang tersimpan di database
        //Ingat, saat kita menginputkan data, kita menggunakan enkripsi MD5,
        //Kalau tidak mau menggunakan enkripsi, silakan hapus perintah MD5 saat memasukkan data ke tabel
        if(md5($password)==$pass){
            //untuk menyimpan sesi user yang sedang login,
            //gunakan syntax berikut, contoh di bawah ini menggunakan ['user'],
            //terserah mau memakai nama apapun, yg penting saat pindah halaman
            //tetap menggunakan nama tersebut jika ingin menggunakannya.
            $_SESSION['user']=$user;
            
            //pindah ke halaman welcome.php dengan sesi user yg sedang login
            header("Location:welcome.php");
        }else {
            echo("Invalid Login");
        }
    }
?>

<html>
<head><title>Tes Login</title></head>

<body>
    <table>
        <form name='form login' method='post' action='login.php'>
        <tr>
            <td>Username</td>
            <td><input type='text' name='user'/></td>
        </tr>
        <tr>
            <td>Password</td>
            <td><input type='password' name='pass'/></td>
        </tr>
        <tr>
            <td></td>
            <td><input type='submit' name='Submit' value='Login'/></td>
        </tr>
        </form>
    </table>
</body>
</html>

Berikut file "welcome.php" yang telah disisipi PHP :

<?php
    include('db.php');
    session_start();
    //cek apakah sesi user telah diset atau belum.
    //jika sesi belum diset, artinya user belum login yang artinya
    //halaman Welcome tidak boleh ditampilkan
    if(!isset($_SESSION['user'])){
        die('You must login to see this page');
    }
  
    $username=$_SESSION['user'];
    $sql=mysql_query("SELECT `nama` FROM `user` WHERE `username`='$username'") or die('Syntax error');
    list($nama)=mysql_fetch_row($sql);
?>

<html>
<head><title>Welcome</title></head>

<body>
    Selamat Datang, <?php echo($nama); ?>
    <br>
    <br>
    <a href='logout.php'>Logout</a>
</body>
</html>
Kemudian, buatlah file "logout.php" untuk menghapus sesi user yang sedang login. Contoh yang saya buat :

<?php
    session_start();
    if(isset($_SESSION['user'])){
        unset($_SESSION['user']);
    }
    session_destroy();
   
    header("Location:login.php");
?>

Jika sudah, saatnya menguji. Saya menyimpan file-file yang telah saya buat di folder /htdocs/teslogin (folder htdocs terdapat di folder tempat instalasi web server Anda). Buka web browser Anda, ketik alamat "http://localhost/teslogin/login.php" (pastikan web server Anda telah diaktifkan).
tampilan login
tampilan welcome (jika tidak login)
username/password salah
login berhasil
Sekian tutorial kali ini. Tutorial ini hanyalah prinsip dasar membuat login form menggunakan PHP & MySQL. Anda bebas berkreasi baik dari segi tampilan maupun algoritma yang Anda gunakan. Penjelasan tentang syntax PHP yang saya buat sudah saya sertakan dalam komentar pada program di atas. Jika ada yang ingin ditanyakan silakan melalui komentar. Selamat mencoba dan semoga berhasil.

3 comments:

  1. nah ini baru mantep tutorial na......lanjutkan hidup POKAN!!

    ReplyDelete
  2. Keep watching aja. Jagn bawa2 POKAN lah. Kan aku jd malu. Hehe..

    ReplyDelete
  3. Notice: Undefined index: Submit in C:\xampp\htdocs\coba\login.php on line 27

    ReplyDelete