Sebelum dilanjutkan ke tutorial, kita pelajari dulu logika dasar untuk hak akses.

(1)

ROLE USER

Rencana Aplikasi

1. Jenis user: Admin, Registered User, Guest (guest adalah user yang tidak terdaftar)

2. Siapa saja dapat mendaftar / membuat user baru tanpa harus login terlebih dahulu.

3. Admin yang dapat mengubah hak akses semua user, merubah data user lain, dan

menghapus user lain.

4. Registered User dapat melihat daftar semua user tanpa dapat merubah maupun

menghapus user lain.

5. Registerd User dapat merubah data pribadinya.

6. Untuk dapat melihat data user (data pribadi maupun data semua user), user harus

login terlebih dahulu.

Materi Dasar

Sebelum dilanjutkan ke tutorial, kita pelajari dulu logika dasar untuk hak akses.

Logika untuk hak akses tidaklah rumit, hanya dengan logika if sederhana. Kita asumsikan

misalkan ada 3 jenis user seperti dalam tutorial kali ini (admin, member, guest) dalam sebuah

aplikasi. Untuk dapat mengakses halaman member, user harus terdaftar dan login terlebih

dahulu. Kemudian user yang login ini harus dapat dikenali aplikasi apakah ia berstatus

sebagai admin atau bukan. Hal ini dikarenakan fungsionalitas aplikasi tidak sama untuk level

user yang berbeda. Misalkan: admin boleh menghapus user lain sedangkan user biasa tidak.

Maka logika dasar dari kasus ini adalah seperti berikut:

if($userLevel== 'admin') {

echo"<a href='delete.php'?id=$id>Delete</a>"; }

Kode diatas berarti bahwa jika user memiliki hak akses sebagai admin, maka link untuk

delete akan ditampilkan, sedangkan jika tidak maka link delete tidak akan ditampilkan.

Dalam tutorial kali ini, hak akses (role) disimpan didalam session untuk kemudian dapat kita

panggil lagi pada halaman lainnya untuk dilakukan pengecekan. Untuk melakukan

pengecekan apakah user yang login memiliki role sebagai admin atau tidak, kode program

nya akan terlihat seperti berikut.

if($_SESSION['role'] == 'admin') { // kode lainnya

}

Kemudian kode tersebut kita sisipkan pada bagian yang hanya boleh diakses oleh user yang

memiliki role sebagai admin.

Jadi, jika ada beberapa menu ataupun fungsionalitas yang hanya boleh digunakan oleh user

dengan hak akses tertentu, cukup gunakan logika dasar ini. Jika kebutuhan aplikasi Anda

(2)

lebih kompleks dari ini, maka tinggal disesuaikan dan dikembangkan sesuai dengan

kebutuhan.

Langkah 1 – Struktur Folder

Buatlah folder dengan nama hak_akses pada C:\xampp\htdocs\. Kemudian buat lagi dua

folder dengan nama css dan images didalam folder hak_akses.

Kemudian copy-kan file .css dari file yang sudah didownload kedalam folder css, dan file

background.jpg kedalam folder images.

File-file .css ini nantinya akan kita gunakan sebagai alat bantu untuk mempercantik tampilan.

Untuk menggunakan file-file .css ini cukup dengan menambahkan baris kode seperti berikut.

<linkrel="stylesheet"href="css/reset.css"type="text/css"/>

<linkrel="stylesheet"href="css/normalize.css"type="text/css"/> <linkrel="stylesheet"href="css/permata-ui-kit.css"type="text/css"/> <linkrel="stylesheet"href="css/bootstrap.css"type="text/css"/> <linkrel="stylesheet"href="css/style.css"type="text/css"/>

Langkah 2 – Database

Buat database dengan nama tutorial_3. Kemudian buat tabel dengan nama users dengan data

sebagai berikut.

Fieldname

Datatype

(3)

username

varchar(20), UNIQUE

password

varchar(300)

email

varchar(100)

fullname

varchar(100)

role

enum(‘admin’, ‘member’)

Kemudian buat satu user sebagai administrator dengan menjalankan kode berikut pada SQL

query (sesuaikan dengan DBMS yang Anda gunakan) agar kita dapat login.

insertintousers values('', 'admin', 'admin', '[email protected]', 'Administrator', 'admin');

Langkah 3 – File Konfigurasi

Seperti biasa, sebelum membuat aplikasi lebih jauh, kita buat terlebih dulu file konfigurasi

untuk koneksi ke server. Ketikkan kode berikut dan simpan dalam folder hak_akses dengan

nama config.php.

<?php

// host yang digunakan $host= 'localhost';

// username untuk login ke hosthosting $user= 'root';

// jika menggunakan PC sendiri sebagai host, // secara default password dikosongkan

$pass= '';

// isikan nama database sesuai database yang akan digunakan $dbname= 'tutorial_3';

// mengubung ke host

$connect= mysql_connect($host, $user, $pass) ordie(mysql_error());

// memilih database yang akan digunakan $dbselect= mysql_select_db($dbname); ?>

Langkah 4 – Register User

Ketikkan kode berikut dan simpan dalam folder hak_akses dengan nama index.php.

<?php

session_start();

(4)

$logged_in= false;

//jika session username belum dibuat, atau session username kosong if (isset($_SESSION['username']) || !empty($_SESSION['username'])) { $logged_in= true; }

include_once('config.php'); ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<metahttp-equiv="Content-Type"content="text/html; charset=utf-8"/> <title>Tutorial Hak Akses - Nurwahyudin.Com</title>

<linkrel="stylesheet"href="css/reset.css"type="text/css"/> <linkrel="stylesheet"href="css/normalize.css"type="text/css"/> <linkrel="stylesheet"href="css/permata-ui-kit.css"type="text/css"/> <linkrel="stylesheet"href="css/bootstrap.css"type="text/css"/> <linkrel="stylesheet"href="css/style.css"type="text/css"/> </head>

<body>

<divstyle="margin:auto; padding:50px 0 30px; text-align:center"> <h1>Nurwahyudin.Com</h1>

<p>Tutorial Hak Akses</p> </div>

<divstyle="margin:auto">

<formclass="rounded_3 shadow_3"action="insert.php"method="post" style="width:400px; margin:auto;">

<fieldsetclass="rounded_3">

<legend>Register New User</legend> <?php $message = $_GET['msg'];

if ($message == 'success') { ?> <divclass="info">Success</div>

<?php} else if ($message == 'failed') {?> <divclass="error">Error</div>

<?php} ?>

<div>

<labelfor="username">Username</label> <inputid="username" name="username"class="wide"type="text"required="required"/>

</div> <div>

<labelfor="password">Password</label> <inputid="password" name="password"class="wide"type="password"required="required"/>

</div> <div>

<labelfor="email">Email</label> <inputid="email" name="email"class="wide"type="email"required="required"/>

</div> <div>

<labelfor="fullname">Fullname</label> <inputid="fullname" name="fullname"class="wide"type="text"/>

</div> <div>

(5)

<spanclass="left"><ahref="users.php">Lihat Data</a></span> <?php} else {?>

<spanclass="left"><ahref="login.php">Login</a></span> <?php} ?>

<inputclass="right"type="submit"name="submit"value="Buat User"/> </div> </fieldset> </form> </div> </body> </html>

Pada baris ke-7 kita lakukan pengecekan apakah user sudah login atau belum dengan kode if

(isset($_SESSION['username']) || !empty($_SESSION['username'])). Jika sudah login, maka

variabel $logged_in di set menjadi true. Variabel ini kita gunakan untuk pengecekan lagi

nantinya.

Pada baris ke-57 kita lakukan pengecekan terhadap nilai dari variabel $logged_in dengan

kode if ($logged_in). Jika variabel ini bernilai true (yang berarti user sudah login), maka

tampilkan link untuk melihat data user. Sedangkan jika bernilai false (yang berarti user belum

login), maka tampilkan link menuju halaman login.

Selanjutnya, buat file baru dan ketikkan kode berikut ini. Setelah selesai simpan dengan nama

insert.php.

<?php

include_once('config.php');

// terima data dari halaman index.php

$username

= mysql_real_escape_string($_POST['username']); $password

= mysql_real_escape_string($_POST['password']); $email

= mysql_real_escape_string($_POST['email']); $fullname

= mysql_real_escape_string($_POST['fullname']);

$role

= 'member'; // variabel untuk settingan default level yang mendaftar

// simpan data ke database

$query= mysql_query("insert into users values('', '$username', '$password', '$email', '$fullname', '$role')");

if($query) {

// jika berhasil menyimpan

header('location: index.php?msg=success'); } else{

// jika gagal menyimpan

header('location: index.php?msg=failed'); }

?>

Setelah selesai, coba buka browser dan ketikkan localhost/hal_akses/register.php. Hasilnya

akan terlihat seperti gambar dibawah. Cobalah untuk menambahkan beberapa user baru.

(6)

Saat ini, kita masih belum dapat login ke aplikasi (iyalah, login nya belum dibikin

).

Selanjutnya kita buat halaman untuk login.

Langkah 5 – Login

Ketikkan kode berikut dan simpan dengan nama login.php.

<?php session_start();

include_once('config.php');

if (!empty($_SESSION['username'])) { header('location:index.php'); } ?>

<head>

<body>

<divstyle="margin:auto; padding:50px 0 30px; text-align:center"> <h1>Nurwahyudin.Com</h1>

<p>authorization required!</p> </div>

(7)

<formclass="rounded_3 shadow_3"action="auth.php"method="post" style="width:400px; margin:auto;"> <fieldsetclass="rounded_3"> <legend>Login</legend>

<?php $error = $_GET['error'];

if ($error == 1) { ?>

<divclass="error">Username dan Password belum diisi.</div> <?php} else if ($error == 2) {?>

<divclass="error">Username belum diisi.</div> <?php} else if ($error == 3) {?>

<divclass="error">Password belum diisi.</div> <?php} else if ($error == 4) {?>

<divclass="error">Username dan Password tidak terdaftar.</div> <?php} ?>

<div>

<labelfor="username">Username</label> <inputid="username" name="username"class="wide"type="text"required="required"/>

</div> <div>

<labelfor="password">Password</label> <inputid="password" name="password"class="wide"type="password"required="required"/>

</div> <div>

<spanclass="left"><ahref="index.php">Daftar Baru</a></span>

<inputclass="right"type="submit"name="submit" value="Login"/> </div> </fieldset> </form> </div> </body> </html>

Berikutnya kita buat file untuk autentikasi user yang login. Ketikkan kode berikut dan simpan

dengan nama auth.php.

<?php

include('config.php');

session_start();

// terima data dari form login $username= $_POST['username']; $password= $_POST['password'];

// untuk mencegah sql injection

// kita gunakan mysql_real_escape_string

$username= mysql_real_escape_string($username); $password= mysql_real_escape_string($password);

// cek data yang dikirim, apakah kosong atau tidak if(empty($username) && empty($password)) {

(8)

// kalau username dan password kosong header('location:login.php?error=1'); break;

} elseif(empty($username)) {

// kalau username saja yang kosong header('location:login.php?error=2'); break;

} elseif(empty($password)) {

// kalau password saja yang kosong header('location:login.php?error=3'); break;

}

$query= mysql_query("select * from users where username='$username' and password='$password'");

$data= mysql_fetch_array($query);

if(mysql_num_rows($query) == 1) {

// kalau username dan password sudah terdaftar di database

// buat session dengan nama username dengan isi nama user yang login $_SESSION['username'] = $username;

$_SESSION['role'] = $data['role'];

// redirect ke halaman users [menampilkan semua users] header('location:users.php');

} else{

// kalau username ataupun password tidak terdaftar di database header('location:login.php?error=4');

} ?>

Setelah selesai, coba buka browser dan ketikkan localhost/hal_akses/login.php. Hasilnya

akan terlihat seperti gambar dibawah.

Berikutnya, kita buat sebuah file untuk melakukan pengecekan apakah user sudah login atau

belum. Jika user sudah login, maka user tidak perlu login lagi. Buat dokumen baru dan

ketikkan kode berikut. Setelah selesai, simpan dengan nama cek-login.php.

<?php

(9)

$logged_in= false;

//jika session username belum dibuat, atau session username kosong if(!isset($_SESSION['username']) || empty($_SESSION['username'])) { //redirect ke halaman login

header('location:login.php'); } else{

$logged_in= true; }

?>

File cek-login.php ini akan kita include pada beberapa file lainnya.

Langkah 6 – Daftar User

Buat dokumen baru dan ketikkan kode berikut. Setelah selesai simpan dengan nama

users.php.

<?php include_once('config.php'); include_once('cek-login.php'); ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

<head>

<body>

<div style="margin:auto; padding:50px 0 30px; text-align:center"> <h1>Nurwahyudin.Com</h1>

<p>Tutorial Hak Akses</p> </div>

<div class="rounded_3 shadow_3 content"> <?php

$username = $_SESSION['username'];

$query_user_login = mysql_query("select * from users where username='$username'");

$user_login = mysql_fetch_array($query_user_login); ?>

<h3>Selamat Datang <?php echo $user_login['fullname']; ?></h3> <br />

(10)

$message = $_GET['msg'];

if($message == 'success') { ?>

<div class="info">Success</div>

<?php } elseif($message == 'failed') {?> <div class="error">Error</div>

<?php } ?>

<a href="index.php"class="left">Tambah User</a> <a href="logout.php" class="right">Logout</a> <br /> <table class="view"> <thead> <tr> <th width="20">No.</th> <th>Username</th> <th>Fullname</th> <th>Email</th> </tr> </thead> <tbody> <?php

$query = mysql_query("select * from users");

$i = 1;

while($data = mysql_fetch_array($query)) { ?>

<tr class="<?php if ($i % 2 == 0) { echo "odd"; } else { echo "even"; } ?>"> <td><?php echo $i; ?></td> <td> <?php echo $data['username'];

// jika user yang login memiliki role sebagai admin, maka tampilkan menu untuk edit dan delete user

if($_SESSION['role'] == 'admin') { ?>

<?php if($data['username'] != 'admin') {?> | <a href="delete.php?uid=<?php echo $data['id_user'];?>"class="delete">Delete</a> <?php } ?> </div> <?php } ?> </td> <td><?php echo $data['fullname']; ?></td> <td><?php echo $data['email']; ?></td> </tr> <?php $i++; } ?> </tbody> </table> </div>

(11)

</div>

</html>

Perhatikan baris ke-70 terdapat kode if ($_SESSION['role'] == ‘admin’). Pada baris ini kita

lakukan pengecekan hak akses apakah user yang login memiliki hak akses sebagai admin

atau tidak. Jika user memiliki hak akses sebagai admin, maka tampilkan menu edit dan

delete. Jika tidak memiliki hak akses sebagai admin, maka menu edit dan delete tidak boleh

ditampilkan.

Cobalah lihat hasilnya pada browser dengan membuka

halaman localhost/hak_akses/users.php. Hasilnya akan terlihat seperti gambar berikut.

Selanjutnya kita buat halaman edit data. Buat dokumen baru dan ketikkan kode berikut,

kemudian simpan dengan nama edit.php.

<?php session_start();

include_once('config.php'); include_once('cek-login.php');

if ($_SESSION['role'] != 'admin') { header('location: users.php'); } ?>

<head>

<body>

(12)

<h1>Nurwahyudin.Com</h1> <p>Tutorial Hak Akses</p> </div>

<formclass="rounded_3 shadow_3"action="update.php"method="post" style="width:400px; margin:auto;"> <fieldsetclass="rounded_3"> <legend>Edit User</legend> <?php $message = $_GET['msg'];

if ($message == 'success') { ?> <divclass="info">Success</div>

<?php} else if ($message == 'failed') {?> <divclass="error">Error</div>

<?php} ?>

<?php

// terima id_user dari halaman users $user_id = $_GET['uid'];

$query= mysql_query("select * from users where id_user='$user_id'");

$data= mysql_fetch_array($query); ?>

<div>

<labelfor="username">Username</label> <inputid="username" name="username"class="wide"type="text"required="required"value="<?php echo $data['username']; ?>" disabled="disabled" />

</div> <div>

<labelfor="password">Password</label> <inputid="password" name="password"class="wide"type="password"required="required"value="<?php echo $data['password']; ?>" <?phpif ($data['username'] == 'admin') {?> disabled="disabled" <?php} ?> />

</div> <div>

<labelfor="email">Email</label> <inputid="email"

name="email"class="wide"type="email"required="required"value="<?php echo $data['email']; ?>" />

</div> <div>

<labelfor="fullname">Fullname</label> <inputid="fullname" name="fullname"class="wide"type="text"value="<?php echo

$data['fullname']; ?>" /> </div>

<?php

// jika user yang login memiliki role sebagai admin, maka tampilkan opsi ini

if ($_SESSION['role'] == 'admin') { if ($data['username'] != 'admin') { ?> <div> <labelfor="role">Role</label> <selectname="role"> <optionvalue="admin">Admin</option> <optionvalue="member">Member</option>

(13)

</select> </div> <?php } } ?> <div> <?phpif ($logged_in) { ?>

<spanclass="left"><ahref="users.php">Lihat Data</a></span> <?php} else {?>

<spanclass="left"><ahref="login.php">Login</a></span> <?php} ?>

<inputclass="right"type="submit"name="submit" value="Update User"/>

</div>

<inputtype="hidden"name="user_id"value="<?php echo $data['id_user']; ?>" /> </fieldset> </form> </div> </body> </html>

Perhatikan pada baris ke-63, kembali kita lakukan pengecekan hak akses apakah user

memiliki role sebagai admin atau tidak dengan kode if ($_SESSION['role'] == ‘admin’). Jika

user memiliki role sebagai admin, maka user boleh merubah role user lain.

Agar hasil edit-an dapat disimpan, buat dokumen baru dan ketikkan kode berikut. Kemudian

simpan dengan nama update.php.

<?php

//tangkap data dari form $id= $_POST['user_id']; $password= $_POST['password']; $fullname= $_POST['fullname']; $email= $_POST['email']; $role= $_POST['role'];

//update data di database sesuai user_id

$query= mysql_query("update users set password='$password',

fullname='$fullname', email='$email', role='$role' where id_user='$id'") or die(mysql_error());

if($query) { header('location:users.php?msg=success'); } else{ header('location:users.php?msg=failed'); } ?>

Sampai disini, kita sudah dapat meng-edit data. Untuk melihat hasilnya, coba buka

halaman localhost/hak_akses/users.php, kemudian edit-lah salah satu data yang ada.

Untuk dapat menghapus data, buat dokumen baru dan ketikkan kode berikut. Simpan dengan

nama delete.php.

(14)

<?php

$uid= $_GET['uid'];

$query= mysql_query("delete from users where id_user='$uid'") or die(mysql_error());

if($query) { header('location:users.php?msg=success'); } else{ header('location:users.php?msg=failed'); } ?>