7
Nah pada kali ini kita akan membuat Sistem Login , dimana ini digunakan untuk masuk ke halaman admin bagi yang mempunyai , Password, username dan hak akses, intinya kira-kira begitu. Sekarang aktifkan Xampp Control->Service Apache dan Mysql->buat database dengan nama "db_ebsof" pada phpmyadmin Gambar Xampp Control Pembuatan Database "db_ebsof" Setelah itu buatlah tabel, di dalam database "db_ebsof" dengan nama tbl_user berikut script nya tbl_user: view plainprint? 1. CREATE TABLE `db_ebsof`.`tbl_user` ( 2. `id_user` INT( 3 ) NOT NULL AUTO_INCREMENT PRIMARY KEY , 3. `username` VARCHAR( 40 ) NOT NULL , 4. `password` VARCHAR( 40 ) NOT NULL , 5. `level` VARCHAR( 40 ) NOT NULL , 6. `blokir` ENUM( 'Y', 'N' ) NOT NULL 7. ) ENGINE = MYISAM ; Setelah tbl_user berhasil dibuat , insertkan data sebagai berikut : view plainprint? 1. INSERT INTO `db_ebsof`.`tbl_user` ( 2. `id_user` , 3. `username` , 4. `password` , 5. `level` , 6. `blokir` 7. )

Web Dinamis Bagian IV ( Membuat Sistem Login)

Embed Size (px)

DESCRIPTION

web

Citation preview

Page 1: Web Dinamis Bagian IV ( Membuat Sistem Login)

Nah pada kali ini kita akan membuat Sistem Login , dimana ini digunakan untuk masuk ke halaman admin bagi yang mempunyai , Password, username dan hak akses, intinya kira-kira begitu. Sekarang aktifkan Xampp Control->Service Apache dan Mysql->buat database dengan nama "db_ebsof" pada phpmyadmin

Gambar Xampp Control

Pembuatan Database "db_ebsof"

Setelah itu buatlah tabel, di dalam database "db_ebsof" dengan nama tbl_user berikut script nya tbl_user: view plainprint?

1. CREATE TABLE `db_ebsof`.`tbl_user` ( 2. `id_user` INT( 3 ) NOT NULL AUTO_INCREMENT PRIMARY KEY , 3. `username` VARCHAR( 40 ) NOT NULL , 4. `password` VARCHAR( 40 ) NOT NULL , 5. `level` VARCHAR( 40 ) NOT NULL , 6. `blokir` ENUM( 'Y', 'N' ) NOT NULL 7. ) ENGINE = MYISAM ;

Setelah tbl_user berhasil dibuat , insertkan data sebagai berikut : view plainprint?

1. INSERT INTO `db_ebsof`.`tbl_user` ( 2. `id_user` , 3. `username` , 4. `password` , 5. `level` , 6. `blokir` 7. )

Page 2: Web Dinamis Bagian IV ( Membuat Sistem Login)

8. VALUES ( 9. '1', 'admin', 'admin', 'admin', 'N'

Pada tahap ini kita sudah selesai membuat Database dengan nama "db_ebsof" dan tabel dengan nama "tbl_user" , Nah.. Langkah selanjutnya ialah kita membuat FORM login pada halaman index.php , berikut tampilannya :

Form Login

User :

Pass :

Login

langkah penambahan Form login yaitu dengan menambahkan form dan table dengan ukuran 200 px, dengan baris 5 , dan 2 kolom, baris boleh lebih ,, tergantung selera anda Tambahkan Form Login ini di antara code : view plainprint?

Page 3: Web Dinamis Bagian IV ( Membuat Sistem Login)

1. <td width="200" height="600" valign="top" bgcolor="#00CCFF"> 2. ...... </td>

dan berikut ini code form login. view plainprint?

1. <table width="200" border="0" cellspacing="0" cellpadding="0"> 2. <tr> 3. <td><form name="form1" method="post" action="cek_login.php"> 4. <table width="200" border="0" cellspacing="0" cellpadding="2"> 5. <tr bgcolor="#003366"> 6. <td height="30" colspan="2"><div align="center"><strong>Form Login <

/strong></div></td> 7. </tr> 8. <tr> 9. <td width="74" height="30">Username</td> 10. <td width="126">: 11. <input name="username" type="text" id="username" size="10"></td> 12. </tr> 13. <tr> 14. <td height="30">Password</td> 15. <td>: 16. <input name="password" type="password" id="password" size="10"></t

d> 17. </tr> 18. <tr> 19. <td height="30">&nbsp;</td> 20. <td><input type="submit" name="Submit" value="Login"></td> 21. </tr> 22. </table> 23. </form></td> 24. </tr> 25. <tr> 26. <td>&nbsp;</td> 27. </tr> 28. </table>

Sehingga kode html "index.php" yang sudah di modifikasi dengan penambahan form login akan seperti ini view plainprint?

1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

2. 3. <html> 4. 5. <head> 6. 7. <title>Web Portal Ebsof</title> 8. 9. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 10. 11. </head> 12. 13.

Page 4: Web Dinamis Bagian IV ( Membuat Sistem Login)

14. 15. <body> 16. 17. <table width="800" border="0" align="center" cellpadding="0" cellspacing="0"> 18. 19. <tr bgcolor="#003366"> 20. 21. <td height="100" colspan="2">&nbsp;</td> 22. 23. </tr> 24. 25. <tr bgcolor="#CCFF66"> 26. 27. <td colspan="2">&nbsp;</td> 28. 29. </tr> 30. 31. <tr> 32. 33. <td width="200" height="600" valign="top" bgcolor="#00CCFF"><table width="200"

border="0" cellspacing="0" cellpadding="0"> 34. 35. <tr> 36. 37. <td><form name="form1" method="post" action="cek_login.php"> 38. 39. <table width="200" border="0" cellspacing="0" cellpadding="2"> 40. 41. <tr bgcolor="#003366"> 42. 43. <td height="30" colspan="2"><div align="center"><strong>Form Login <

/strong></div></td> 44. 45. </tr> 46. 47. <tr> 48. 49. <td width="74" height="30">Username</td> 50. 51. <td width="126">: 52. 53. <input name="username" type="text" id="username" size="10"></td> 54. 55. </tr> 56. 57. <tr> 58. 59. <td height="30">Password</td> 60. 61. <td>: 62. 63. <input name="password" type="password" id="password" size="10"></t

d> 64. 65. </tr> 66. 67. <tr> 68.

Page 5: Web Dinamis Bagian IV ( Membuat Sistem Login)

69. <td height="30">&nbsp;</td> 70. 71. <td><input type="submit" name="Submit" value="Login"></td> 72. 73. </tr> 74. 75. </table> 76. 77. </form></td> 78. 79. </tr> 80. 81. <tr> 82. 83. <td>&nbsp;</td> 84. 85. </tr> 86. 87. </table></td> 88. 89. <td valign="top">&nbsp;</td> 90. 91. </tr> 92. 93. <tr bgcolor="#0099FF"> 94. 95. <td height="80" colspan="2">&nbsp;</td> 96. 97. </tr> 98. 99. </table> 100. 101. </body> 102. 103. </html>

Pada tahap ini kita sudah menyelesaikan 2 pekerjaan untuk membuat sistem login yaitu : 1. Membuat Database dimana databasenya bernama "db_ebsof" dan tbl_user , serta id user yang nantinya kita gunakan adalah : userid : admin password : admin 2. Memodifikasi "index.php" guna membuat Form Login Setelah selesai pada 2 tahap di atas , tahap selanjutnya adalah membuat coding PHP, yang berguna untuk memproses atau mengecek userid dan password yang di inputkan lewat form Login, dengan yang terdaftar di dalam database : dengan logika : "APABILA userid dan password yang diinputkan sama dengan Yang ada di DATABASE".. maka ia berhak masuk ke halaman admin" berikut adalah script php "cek_login.php" yang berfungsi memproses dan mengecek user id dan password yang di inputkan : view plainprint?

Page 6: Web Dinamis Bagian IV ( Membuat Sistem Login)

1. <?php 2. 3. // pemanggilan file koneksi 4. 5. include "koneksi.php"; 6. 7. // pembuatan variabel pada penginputan username dan password 8. 9. $username = $_POST['username']; 10. 11. $pass = $_POST['password']; 12. 13. 14. 15. // Pengecekan user id dan password dengan yang ada di database 16. 17. $login=mysql_query("SELECT * FROM tbl_user WHERE username='$username' AND password

='$pass' AND blokir='N'"); 18. 19. $ketemu = mysql_num_rows($login); 20. 21. $r=mysql_fetch_array($login); 22. 23. 24. 25. if ($ketemu > 0) { 26. 27. session_start (); 28. 29. 30. 31. $_SESSION[namauser] = $r[username]; 32. 33. $_SESSION[passuser] = $r[password]; 34. 35. $_SESSION[leveluser]= $r[level]; 36. 37. 38. 39. header('location:admin.php'); 40. 41. } 42. 43. else { 44. 45. echo "<center>LOGIN GAGAL 46. 47. 48. Username atau Password Anda Tidak benar 49. 50. 51. Atau Acount Anda Sedang Di blokir 52. "; 53. 54. echo "<a href='index.php'>Ulangi Lagi</a>"; 55. 56. } 57.

Page 7: Web Dinamis Bagian IV ( Membuat Sistem Login)

58. ?>

copy paste, coding php di atas ke text editor, simpan dengan nama "cek_login.php" di folder yang sama dengan file-file yang telah kita buat sebelumnya.. Untuk melihat hasil nya, silahkan jalankan file index.php.. dan masukkan userid : admin password : admin maka akan masuk ke halaman admin, dan jika user id dan password salah,, akan keluar pesan " username atau Password Tidak benar, Atau Acount Anda Sedang Di blokir. Silahkan mencoba