Vous êtes sur la page 1sur 15

Login/Logout Halaman Web Dengan PHP di server Apache

Anharku v_maker@yahoo.com http://anharku.freevar.com

Lisensi Dokumen: Copyright 2003-2009 IlmuKomputer.Com Seluruh dokumen di IlmuKomputer.Com dapat digunakan, dimodifikasi dan disebarkan secara bebas untuk tujuan bukan komersial (nonprofit), dengan syarat tidak menghapus atau merubah atribut penulis dan pernyataan copyright yang disertakan dalam setiap dokumen. Tidak diperbolehkan melakukan penulisan ulang, kecuali mendapatkan ijin terlebih dahulu dari IlmuKomputer.Com. Sebenarnya semua ini di buat untuk menjawab rasa penasaran kok bisa yah bikin web dilengkapi username password? Gimana cara bikinnya?banyak web yang menggunakan fitur login dan logout. Fungsinya tentu saja membatasi akses terhadap layanan tertentu yang disediakan pada situs tersebut. Hanya anggota yang telah terdaftar saja yang diijinkan mengakses layanan-layanan khusus tersebut. 1. Mula2 kita buat 7 script wajib yaitu: Index.php Pendaftaran.php Cekpswd.php Proses login.php Sorry.php Main.php Logout.php 1. Index.php <HTML> <HEAD> <TITLE> Login </TITLE> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css"> <!-body,td,th { color: #0000FF; } body { background-color: #000000; } a:link { color: #0000FF; } a:hover { 1
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

color: #FFFFFF; } .style1 { font-size: 24px; color: #FFFFFF; } .style2 {color: #FFFFFF} .style4 {font-size: 12px; color: #FFFFFF; } .style5 {color: #FFFFFF; font-weight: bold; } --> </style> <script language="JavaScript" type="text/JavaScript"> <!-function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } //--> </script> </HEAD> <BODY> <h1 align="center" class="style2"> <marquee> </marquee> </h1> <p align="center">&nbsp;</p> <p align="center">&nbsp; </p> <p>&nbsp;</p> <p align="left" class="style5">Untuk masuk halaman utama </p> <p align="left" class="style5">Isikan User name Dan Password</p> <p align="left" class="style5">Sebagai persyaratan kelengkapan data :</p> <PRE><span class="style2">isi username dan password sesuai dengan yang anda daftarkan!</span> <FORM NAME="frmLogIn" METHOD="post" ACTION="cekpswd.php"> <span class="style2">Username : <INPUT TYPE="text" NAME="uname"> Password : </span><INPUT TYPE="password" NAME="pswd"> <INPUT TYPE="submit" VALUE="Login"> </FORM> <span class="style4">Apabila anda belum mempunyai User dan Password silahkan daftar: <a href="pendaftaran.php">Daftar</a></span></PRE> </BODY> </HTML>

2
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

2. Pendaftaran.php <HTML> <HEAD> <TITLE> Pendaftaran </TITLE> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css"> <!-body,td,th { color: #0000FF; } body { background-color: #000000; } a:hover { color: #FFFFFF; } .style1 {color: #FFFFFF} .style2 { color: #FFFFFF; font-size: 24px; font-weight: bold; } --> </style></HEAD> <BODY> <p align="center" class="style2">LEMBAR PENDAFTARAN </p> <p class="style1">Isi username dan password yang Anda inginkan </p> <p><span class="style1">Sebagai persyaratan pembuatan data untuk proses login</span><BR> 3
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

<PRE> </p> <FORM NAME="frmSignUp" METHOD="post" ACTION="proses login.php"> <span class="style1">Username :</span><INPUT TYPE="text" NAME="uname"> <span class="style1">Password :</span><INPUT TYPE="password" NAME="pswd"> <INPUT TYPE="submit" VALUE="Submit"> </FORM> </BODY> </HTML>

4
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

3. Cekpswd.php <? session_start(); $uname = $_POST['uname']; $pswd = md5($_POST['pswd']); $host = "localhost"; $user = "root"; $pwd = ""; $db = "daftar"; $sql = "select * from anggota where uname='$uname'"; $conn = @mysql_connect($host,$user,$pwd) or die("Koneksi gagal : " . mysql_error()); mysql_select_db($db); $qry = mysql_query($sql) or die("Query salah : " . mysql_error()); $num = mysql_num_rows($qry); $row = mysql_fetch_array($qry); if ($num==0 OR $pswd!=$row['pswd']) { header("Location: sorry.php"); } else { $_SESSION['login']=1; header("Location: main.php"); } ?> File cekpswd.php digunakan untuk memeriksa username dan password yang dimasukkan pada file login.php. Langkah selanjutnya adalah mencocokkan username dan password dengan record yang terdapat pada database. Jika username dan password itu tidak cocok bisa usernamenya tidak terdaftar atau passwordnya yang salah maka skrip tersebut akan mengarahkan langkahnya menuju ke file sorry.php, tapi jika benar maka arahnya akan menuju ke file main.php 4. Proses login.php
<HTML> <HEAD> <TITLE> Processing your Account </TITLE> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css"> <!-body,td,th { color: #FFFFFF; } body { background-color: #000000; } --> </style></HEAD> <BODY> <? $uname = $_POST['uname']; $pswd = md5($_POST['pswd']);

5
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

$host = "localhost"; $user = "root"; $pwd = ""; $db = "daftar"; $stop = 0; $sql = "select uname from anggota"; $conn = @mysql_connect($host,$user,$pwd) or die("Koneksi gagal : " . mysql_error()); mysql_select_db($db); $qry = mysql_query($sql) or die("Query salah : " . mysql_error()); while ($row = mysql_fetch_array($qry)) { if ($uname == $row['uname']) { echo "Username $uname was already chosen by someone else <BR>"; echo "Go back and choose another username"; $stop = 1; break; } } if ($stop==0) { $sql = "insert into anggota values ('$uname','$pswd')"; $qry = mysql_query($sql) or die("Query salah : " . mysql_error()); echo "Your account is successfully created <BR>"; echo "<A HREF='index.php'> Click here </A> to login"; } ?> </BODY> </HTML>

Pada script ini mula-mula diperiksa apakah username yang dipilih telah ada di dalam database. Jika telah ada, maka php akan memberikan peringatan bahwa username tersebut telah ada (Username $uname was already chosen by someone else) dan Anda dipersilakan membuat username baru. Jika belum ada, maka informasi username dan password Anda telah didaftarkan ke dalam database(Your account is successfully
created)

6
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

5. Sorry.php
<HTML> <HEAD> <TITLE> Sorry </TITLE> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css"> <!-body,td,th { color: #0000FF; } body { background-color: #000000; } .style1 { color: #FF0000; font-weight: bold; } .style2 { color: #FF0000; font-size: 36px; } .style3 {color: #FF0000; font-size: 12px; } .style4 { font-size: 36px; font-weight: bold; } .style5 {font-size: 24px} .style6 {color: #FF0000; font-size: 24px; } --> </style> <script language="JavaScript" type="text/JavaScript"> <!-function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } //--> </script> </HEAD> <BODY> <h1 align="center" class="style1"> AKSES DITOLAK </h1> <p class="style2 style5">Maaf USER atau Password yang anda masukkan SALLAH, isi USER dan Password sama seperti yang anda daftarkan ,atau User belum terdaftar!!!! </p> <p class="style2">&nbsp;</p> <p class="style2">&nbsp;</p> <p align="right" class="style3">untuk kembali klik</p> <p align="right" class="style3 style4"><a href="index.php">Back</a></p> </BODY> </HTML>

7
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

6. Main.php <? session_start(); if(!isset($_SESSION['login'])) { include("login.php"); } else { ?> <HTML> <HEAD> <TITLE> Main Page </TITLE> <style type="text/css"> <!-a:hover { color: #FFFFFF; } body,td,th { color: #0000FF; } body { background-color: #000000; } .style3 {color: #999999} 8
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

.style4 { color: #FFFFFF; font-size: 36px; font-weight: bold; } .style5 {color: #FFFFFF} --> </style> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script language="JavaScript" type="text/JavaScript"> <!-function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } //--> </script> </HEAD> <BODY> <div align="center"> <marquee> <span class="style4">Selamat datang di webside Ku </span> </marquee> </div> <hr> <p align="center" class="style5">Sory Websdenya belum ada isinya..... Habis ini cuma contoh login aja sih hehehe...</p> <p align="center" class="style5">&nbsp;</p> <p align="center" class="style5">&nbsp;</p> <p align="center" class="style5">by:Anharku </p> <h3 align="center"> <div align="center"> <p>&nbsp;</p> <p><span class="style3"><BR> </span></p> <p><BR> </p> <div align="right"><a href="index.php"> </p> Back </a></div> </div> </BODY> </HTML> <? } ?> 9
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

script main.php ini mengolah data-data dari halaman login. Langkah pertama yang dilakukan adalah koneksi ke database. Setelah itu mencocokkan username yang ada di database, jika tidak cocok Anda diminta memasukkan username kembali. Jika username cocok dengan record yang ada pada database, diperiksa passwornya. Jika passwordnya cocok, maka Anda akan dapat login, jika tidak Anda diminta untuk mengisi password dengan tepat.

7. Logout.php <? session_start(); unset($_SESSION['login']); session_destroy(); header("Location: index.php"); ?> Pada script Logout.php ini, variabel $_SESSION['login'] dihilangkan sekaligus bersama dengan sessionnya. Langkah selanjutnya adalah mengarahkan aplikasi ke halaman login.php. Setelah session dihilangkan, maka user harus login lagi untuk dapat mengakses aplikasi tersebut.

10
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

2.Lalu semua script tersebut kita Copy / pindahkan ke C:\apache\htdocs

3.Lanjut menuju C:\apache\mysql\bin klik2x winmysqladmin.exe

4.Jalankan apache klik Start-all programs- PHP Triad- Apache Console-Start Apache

11
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

5.Lalu buka C:\apache\mysql\bin klik2x mysql.exe

6.Setelah database sukses dibuat next buka browser Mozilla isi urlnya dengan: http://localhost/index.php (tekan enter)

12
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

7. Klik daftar akan menuju http://localhost/pendaftaran.php ,isi username pasword lalu submit

8.Hingga account sukses di buat

13
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

9.Lalu isi username password dengan yang telah di daftarkan tadi..klik login

10.akan menuju http://localhost/main.php

14
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org

Apabila dalam memasukkan username password salah maka akan akan menuju http://localhost/sorry.php

Sepertinya dah cukup jelaskan, penjelasan2 diatas? Semoga dapat mengobati rasa penasaran anda mengenai username password pada sebuah web
Referensi: PCplus

Biografi Penulis Anharku. Pertama mengenal komputer saat SMP pertamanya kenal komputer hanya bermain game bawaan window's lambat laun karna pergaulan dan pertumbuhan, merasakan anehnya cinta monyet...patahhati lalu melampiaskannya pada bermain Game online namun karena satu persatu game itu servernya runtuh (gameOver kali) jadi aku memutuskan vakum dari dunia gamer waktu itu juga saat aku masih UAS jadi aku fokus ke skull dulu.Lanjut mengenal dunia internet sejak hobi main di warnet untuk sekedar mengecek e-mail, fs, dan sekedar chatting ga jelas..Dari temanku bernama DNZ lah aku mulai mengenal dunia virus..lalu aku belajar secara otodidak karna temanku DNZ lebih suka dunia Hacking. Belajar algoritma dan pemrograman, membuat flowchart, dan belajar bahasa pemrograman seperti visual basic, delphi, C++, pascal, asmbly. Belajar tentang micro, website, PHP, Basis data, MySQL, belajar tentang Jaringan Komputer..belajar tentang segala sesuatu yang berbau komputer. 15
Komunitas eLearning IlmuKomputer.Org Copyright 2009 IlmuKomputer.Org