Form Login ( php + mysql )

Banyak web – web di internet yang menggunakan fasilitas member, untuk mengakses fasilitas member maka pengguna perlu login untuk memvalidsai apaka ia member atau bukan.
Nah,  di sini saya berusaha membuat tutorial sederhana bagaimana cara berkomunikasi atau berkoneksi antara php script dengan database mysql yang ada di phpmyadmin. Mari kita belajar secara sederhana bagaimana sih pembuatan form login.





Untuk membuat form login langkah pertama adalah membuat database yang berisikan username dan password. langkah ini bisa dilakukan dengan sql di php myadmin.

CREATE TABLE 'login' (
'username' VARCHAR( 50 ) NOT NULL AUTO_INCREMENT,
'username' VARCHAR( 50 ) NOT NULL ,
'password' VARCHAR( 32 ) NOT NULL ,
'email' VARCHAR( 50) NOT NULL ,
PRIMARY KEY ( 'username' )
)
untuk pengisian informasi tambahan lainnya, seperti nama lengkap, email, alamat dll, dapat disesuaikan kebutuhan sendiri.
tabel-user
UNtuk password diatas masih belum menggunakan teknik enkripsi, untuk teknik enkrisi akan insya allah di posting selanjutnya, hhe… :)
Setelah pembuatan database selesai, langkah berikutnya adalah pembuatan form. Supaya lebih gampang dalam pembuatan form, bukalah dreamweaver dan design form sesuai keingina anda.
index.php
Buatlah satu file yang bernama index.php. index.php merupakan form awal ketika pengguna masuk ke halaman web dan memasukkan passwodr beserta usernamenya.
login_form
untuk scriptnya dapat langsung di download aja ya, nanti kepanjangan kalau ditaruh di sini. yang penting di form diatas terletak di dalam suatu form.
<form action="periksa.php" method="post" name="login" id="login" onsubmit="cek_isi(); return false;">
// formnya terletak disini .. .. ..
</form>
Maksud adri form di atas adalah ketika di submit atau dikirimkan akan melakukan fingsi javascript cek_cekisi(). cek isi disini merupakan salah satu cara untuk mendeteksi apakah semua field atau inputan telah diisi semua atau belum.
cek_isi()
<script type="text/javascript">
function cek_isi(){

if(document.getElementById("username").value == ''){
        alert ('Username diperlukan untuk login');
        document.getElementById("username").focus();
        return false;
}


if(document.getElementById("password").value == ''){
        alert ('Password diperlukan untuk login');
        document.getElementById("password").focus();
        return false;
}
document.login.masuk.value = "true";
document.getElementById("login").submit();
}

</script>
setelah memeriksa form maka data yang terdapat dalam form akan dikirimkan ke file periksa.php.
sebelum masuk ke file periksa.php, file.php sendiri memerlukan suatu koneksi dengan database yang telah kita buat di php myadmin. Untuk konektornya maka diperlukan pembentukan dua file lagi, yaitu config.php dan koneksi.php
config.php
Config.php merupakan file yang berisikan informasi koneksi kita dengan mysql, seperti database yang digunakan, user dan password untuk koneksi, dan lain lain.

<?php
//-----------Configurasi Host dan Database
$host = "localhost";
$user = "root";
$pass = "";
$dbname = "chat";
?>
koneksi.php
Koneksi.php merupakan scrip tuntuk menghubungi host dan database yang digunakan. sebenarnya antara config.php dan koneksi.php dapat dijadikan satu, akan tetapi untuk mempermudah pemeriksaan maka pada kali ini saya pisahkan.

<?php
session_start();
$conn = mysqli_connect($host,$user,$pass,$dbname) or die ("Tidak berhasil menghubungi database ...");
?>
periksa.php
file periksa.php merupakan file untuk memeriksa apakah username dan password yang telah kita masukkan di file index.php ada dalam database member kita.

<?php
require "config.php";
require "koneksi.php";
$masuk = $_POST['masuk'];
if($masuk) {


    $username = $_POST['username'];
    $password = $_POST['password'];
    $query = "SELECT * FROM user_tbl WHERE username = '$username' AND password = '$password'";
    $sql = mysqli_query($conn,$query);
    $num = mysqli_num_rows($sql);
    if($num==1) {
        // login benar //
        $_SESSION['user'] = $username;
        $_SESSION['passwd'] = $password;
        //echo "berhasil";
        echo "
        <script language='JavaScript'>
            alert('Anda berhasil login');
            document.location='login_berhasil.php'
        </script> ";
    } else {
        // jika login salah //
        //echo "gagal";
        echo "
        <script language='JavaScript'>
            alert('Username atau password Anda salah'); 
            document.location='index.php'
        </script> ";
    }
}else echo "waw o.0  , knapa bisa disini ya?? : ".$masuk;
?>
syntax paling utama dalam file ini adalah query pengecekan 
"SELECT * FROM user_tbl WHERE username = '$username' AND password = '$password'";
ketika query tersebut dijalankan akan menghasilkan baris baris sql yang akan diperiksa. Pada script diatas jika hasil query tersebut ada 1 maka user terdaftar, sedangkan jika tidak ada hasil baris maka user belum terdaftar.
Jika berhasik login maka dengan javascrip akan di redirect ke file utama yaitu login_berhasil.php, jika tidak berhasil maka akan di redirect ke file index.php untuk kembali login.
jika berhasil

<script language='JavaScript'>
     alert('Anda berhasil login');
     document.location='login_berhasil.php'
</script> ";

jika gagal

<script language='JavaScript'>
      alert('Anda berhasil login');
      document.location=’index.php'
</script> ";
nah, selesai sudah percobaan dasar mengenai login form, hal diatas sih masih kurang banyak, bisa ditambahin enkripsi password, penggunaan login_session, pengecekan via javascript, dan masih banyak lagi.
untuk download file klik di sini.
terima kasih.

Tidak ada komentar:

Posting Komentar

Please share your opinion. :)