latihan php
DESCRIPTION
latihan PHPTRANSCRIPT
Dalam tutorial ini akan dipelajari cara untuk membuat koneksi ke database dan CRUD data (Create,
Read, Update, Delete) dengan studi kasus data user. Tutorial ini belum membahas tentang validasi
inputan baik client side maupun server side. Untuk dapat mengikuti tutorial ini, pastikan anda sudah
menginstall server lokal pada PC anda. Saya menggunakan XAMPP sebagai bundled server apache dan
PHP.
Download “CRUD dan Login” belajar.zip – Downloaded 40616 times – 6 kB
Langkah 1 – Struktur Folder
Buat folder baru pada C:/xampp/htdocs dengan nama belajar. Folder ini akan menjadi area kerja kita dalam
membuat aplikasi yang nantinya dapat diakses menggunakan browser dengan
mengetikkanlocalhost/nama_folder. Karena nama folder kita adalah belajar, maka untuk mengakses aplikasi
ketikkan localhost/belajar pada address bar browser anda.
Langkah 2 – Database
Buat database dengan nama belajar. Kemudian buat tabel dengan namauser dengan data berikut:
FIELDNAME DATATYPE
user_id int(4), PRIMARY, AUTO INCREMENT
username varchar(20)
password varchar(255)
email varchar(100)
fullname varchar(100)
agama varchar(15)
no_hp bigint(14)
Langkah 3 – File Konfigurasi
Sebelum dapat melakukan CRUD data kedalam database, kita harus membuat koneksi  ke database terlebih
dahulu.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
//host yang digunakan
//99,9% tidak perlu dirubah
$host = 'localhost';
//username untuk login ke host
//biasanya didapatkan pada email konfirmasi order hosting
$user = 'root';
//jika menggunakan PC sendiri sebagai host,
//secara default password dikosongkan
$pass = '';
//isikan nama database sesuai database
//yang dibuat pada langkah-1
$dbname = 'belajar';
//mengubung ke host
$connect = mysql_connect($host, $user, $pass) or die(mysql_error());
//memilih database yang akan digunakan
$dbselect = mysql_select_db($dbname);
?>
File config.php ini nantinya akan banyak kita gunakan pada file-file lain yang perlu menghubung ke server untuk
menyimpan, merubah, maupun menghapus data.
Langkah 4 – Form Input Data
Ketikkan kode berikut, kemudian simpan dalam folder belajar dengan namaindex.php
1
2
3
4
5
6
7
8
9
<html>
<head>
<title>Belajar PHP</title>
</head>
<body>
<h1>Form Input Data</h1>
<form name="input_data" action="insert.php" method="post">
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<table border="0" cellpadding="5" cellspacing="0">
<tbody>
<tr>
<td>Username</td>
<td>:</td>
<td><input type="text" name="username" maxlength="20"
required="required" /></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input type="password" name="password" maxlength="20"
required="required" /></td>
</tr>
<tr>
<td>Fullname</td>
<td>:</td>
<td><input type="text" name="fullname" maxlength="100"
required="required" /></td>
</tr>
<tr>
<td>Email</td>
<td>:</td>
<td><input type="email" name="email" required="required" /></td>
</tr>
<tr>
<td>Agama</td>
<td>:</td>
<td><input type="text" name="agama" required="required" /></td>
</tr>
<tr>
<td>Nomor HP</td>
<td>:</td>
<td><input type="text" name="no_hp" maxlength="14"
required="required" /></td>
</tr>
<tr>
<td align="right" colspan="3"><input type="submit" name="submit"
value="Simpan" /></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
action="insert.php"Â adalah file yang digunakan untuk memproses data yang dimasukkan melalui form
ini. method="post"Â adalah metode pengiriman data yang digunakan. Ada dua jenis menthod untuk mengirim data,
yaitu post dan get. Pengiriman dengan method POST berarti bahwa variabel-variabel data tidak ditampilkan pada
url, sedangkan pengiriman dengan method GET, variabel-variabel data disertakan pada url sehingga url terlihat
seperti ini:
1http://localhost/belajar/insert.php?
username=namanya&password=passwordnya&fullname=nama_lengkapnya
Sekarang coba buka pada browser anda dengan mengetikkanlocalhost/belajar pada address bar
browser. Akan tampil form input data seperti ini.
Langkah 5 – Menyimpan Data
Ketikkan kode berikut, kemudian dengan nama insert.php
1
2
3
4
5
6
7
8
<?php
//panggil file config.php untuk menghubung ke server
include('config.php');
//tangkap data dari form
$username = $_POST['username'];
$password = $_POST['password'];
$fullname = $_POST['fullname'];
9
10
11
12
13
14
15
16
17
18
19
$email = $_POST['email'];
$agama = $_POST['agama'];
$no_hp = $_POST['no_hp'];
//simpan data ke database
$query = mysql_query("insert into user values('', '$username', '$password',
'$email', '$fullname', '$agama', '$no_hp')") or die(mysql_error());
if ($query) {
header('location:index.php?message=success');
}
?>
include()Â digunakan untuk menyertakan file lain dalam file ini. Ingat bahwa pada langkah pertama kita sudah
membuat file config.php yang berisi konfigurasi untuk menghubung ke server, maka setiap kali kita perlu untuk
menghubung ke database, kita cukup memanggil file config.php saja tanpa harus menuliskan kembali kode-
kodenya.
$_POST['name']Â digunakan untuk menangkap value yang dikirim dari form. Untuk menangkap data,
gunakan name yang sama dengan name dari form. Contoh: untuk menangkap data username dari form, maka
gunakan$_POST['username'].
mysql_query()Â digunakan untuk menjalankan script SQL. Pada langkah ini, script SQL yang kita gunakan adalah
untuk menambah data ke database.
Tambahkan kode berikut pada file index.php setelah <h1></h1> untuk menampilkan pesan sukses ketika
berhasil menyimpan data.
1
2
3
4
5
6
7
8
9
10
...
<h1>Form Input Data</h1>
<?php
if (!empty($_GET['message']) && $_GET['message'] == 'success') {
echo '<h3>Berhasil menambah data!</h3>';
}
?>
<form name="input_data" action="insert.php" method="post">
11 ...
Sekarang coba jalankan aplikasi dengan membuka localhost/belajar dan isikan data pada form dan klik tombol
simpan. Jika berhasil, anda akan melihat pesan Berhasil menambah data! seperti gambar dibawah. Jika
gagal, periksa kembali kode yang anda tuliskan. Pastikan tidak ada salah pengetikan.
Langkah 6 – Menampilkan Data
Setelah kita berhasil menyimpan data kedalam database, sekarang kita buat halaman untuk menampilkan data-data
yang sudah kita simpan. Ketikkan kode berikut dan simpan dengan nama view.php
1
2
3
4
5
6
7
8
9
<?php
include('config.php');
?>
<html>
<head>
<title>Belajar PHP</title>
</head>
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<body>
<h1>Data User</h1>
<a href="index.php">+ Tambah Data</a>
<table border="1" cellpadding="5" cellspacing="0">
<thead>
<tr>
<td>No.</td>
<td>Username</td>
<td>Password</td>
<td>Email</td>
<td>Fullname</td>
<td>Agama</td>
<td>No. HP</td>
<td>Opsi</td>
</tr>
</thead>
<tbody>
<?php
$query = mysql_query("select * from user");
$no = 1;
while ($data = mysql_fetch_array($query)) {
?>
<tr>
<td><?php echo $no; ?></td>
<td><?php echo $data['username']; ?></td>
<td><?php echo $data['password']; ?></td>
<td><?php echo $data['email']; ?></td>
<td><?php echo $data['fullname']; ?></td>
<td><?php echo $data['agama']; ?></td>
<td><?php echo $data['no_hp']; ?></td>
<td><a href="#">Edit</a> || <a href="#">Hapus</a></td>
</tr>
<?php
$no++;
}
?>
</tbody>
</table>
</body>
</html>
Kemudian tambahkan kode berikut pada file index.php setelah</form> sebelum </body>.
1
2
3
4
...
</form>
<a href="view.php">Lihat Data</a>
5
6
7
</body>
</html>
Sekarang bukalah localhost/belajar/view.php untuk melihat hasilnya.
Pada kolom
opsi terdapat dua menu, yaitu edit dan hapus. Pada langkah ini, kedua menu tersebut masih belum dapat digunakan.
Pada langkah berikutnya akan kita buat menu edit tersebut.
Langkah 7 – Merubah/Update Data
Dalam menginputkan data bisa terjadi kesalahan seperti kesalahan input, kesalahan data yang dimasukkan, ataupun
lainnya. Untuk itu, data yang sudah disimpan harus dapat dirubah sehingga kesalahan dapat diperbaiki. Pada
dasarnya, form untuk mengedit data adalah sama dengan form untuk menginputkan data. Hanya saja pada form
untuk mengedit data, form tersebut harus menampilkan data yang akan dirubah. Untuk itu, buat file baru dengan
nama edit.php, kemudian copy-kan semua kode yang ada pada fileindex.php kedalam file edit.php.
Selanjutnya kita harus menambahkan beberapa kode agar form edit dapat menampilkan data yang akan di edit.
Kode untuk file edit.php menjadi seperti ini. Highlight yang saya berikan adalah baris-baris kode yang
ditambahkan ataupun dirubah.
1
2
3
4
5
6
7
8
<?php
include('config.php');
?>
<html>
<head>
<title>Belajar PHP</title>
</head>
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<body>
<h1>Form Input Data</h1>
<?php
$id = $_GET['id'];
$query = mysql_query("select * from user where user_id='$id'") or
die(mysql_error());
$data = mysql_fetch_array($query);
?>
<form name="update_data" action="update.php" method="post">
<input type="hidden" name="user_id" value="<?php echo $id; ?>" />
<table border="0" cellpadding="5" cellspacing="0">
<tbody>
<tr>
<td>Username</td>
<td>:</td>
<td><input type="text" name="username" maxlength="20"
required="required" value="<?php echo $data['username']; ?>" disabled /></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input type="password" name="password" maxlength="20"
required="required" value="<?php echo $data['password']; ?>" /></td>
</tr>
<tr>
<td>Fullname</td>
<td>:</td>
<td><input type="text" name="fullname" maxlength="100"
required="required" value="<?php echo $data['fullname']; ?>" /></td>
</tr>
<tr>
<td>Email</td>
<td>:</td>
<td><input type="email" name="email" required="required" value="<?
php echo $data['email']; ?>" /></td>
</tr>
<tr>
<td>Agama</td>
<td>:</td>
<td><input type="text" name="agama" required="required" value="<?
php echo $data['agama']; ?>" /></td>
</tr>
<tr>
<td>Nomor HP</td>
<td>:</td>
<td><input type="text" name="no_hp" maxlength="14"
required="required" value="<?php echo $data['no_hp']; ?>" /></td>
</tr>
<tr>
<td align="right" colspan="3"><input type="submit" name="submit"
value="Simpan" /></td>
</tr>
</tbody>
</table>
</form>
<a href="view.php">Lihat Data</a>
</body>
</html>
Kemudian ubah link pada file view.php menjadi seperti ini.
1<td><a href="edit.php?id=<?php echo $data['user_id']; ?>">Edit</a> || <a
href="#">Hapus</a></td>
Umumnya, username seseorang tidak boleh dirubah setelah ia terdaftar. Untuk membuat agar field input username
tidak dapat dirubah, kita gunakan atribut disabled. Sampai langkah ini kita belum dapat melakukan perubahan
data, kita baru dapat menampilkan data pada form edit. Untuk merubah data pada database, kita perlu
membuat query SQL lagi untuk meng-update database dengan data yang baru. Buat file baru dengan
namaupdate.php dan ketikkan kode berikut.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?php
include('config.php');
//tangkap data dari form
$id = $_POST['user_id'];
$password = $_POST['password'];
$fullname = $_POST['fullname'];
$email = $_POST['email'];
$agama = $_POST['agama'];
$no_hp = $_POST['no_hp'];
//update data di database sesuai user_id
$query = mysql_query("update user set password='$password',
fullname='$fullname', email='$email', agama='$agama', no_hp='$no_hp' where
user_id='$id'") or die(mysql_error());
if ($query) {
header('location:view.php?message=success');
}
?>
Kemudian tambahkan baris kode berikut pada file view.php setelah<h1></h1>Â (sama seperti pada file index.php).
1
2
3
4
5
<?php
if (!empty($_GET['message']) && $_GET['message'] == 'success') {
echo '<h3>Berhasil meng-update data!</h3>';
}
?>
Sekarang bukalah halaman view.php pada browser dan ubah-lah salah satu data yang sudah di inputkan dengan
meng-klik tombol edit.
Langkah 8 – Menghapus/Delete Data
Setelah bisa menambah dan merubah data, sekarang kita buat untuk menghapus data. Buat file baru dengan
nama delete.php dan ketikkan kode berikut.
1
2
3
4
5
6
7
8
9
10
11
<?php
include('config.php');
$id = $_GET['id'];
$query = mysql_query("delete from user where user_id='$id'") or
die(mysql_error());
if ($query) {
header('location:view.php?message=delete');
}
?>
Kemudian tambahkan kode pada link dalam file view.php seperti berikut.
1
2
3
4
<td>
<a href="edit.php?id=<?php echo $data['user_id']; ?>">Edit</a> ||
<a href="delete.php?id=<?php echo $data['user_id']; ?>">Hapus</a>
</td>
Sekarang cobalah untuk menghapus beberapa data yang sudah di-input-kan.
Kesimpulan
Cobalah ber-eksperimen membuat aplikasi dengan lebih banyak input-an data sehingga tabel didalam database juga
menjadi semakin banyak, agar pemahaman konsep dasar tentang pembuatan aplikasi web dengan PHP semakin
kental dan mendalam. Untuk pembuatan aplikasi yang lebih kompleks, tentu tutorial ini tidak cukup karena masih
banyak sekali yang harus disertakan seperti validasi, security, user interface, dan banyak lagi materi lainnya yang
akan dibahas dalam tutorial berikutnya. I hope you enjoyed this tutorial and have learn something new today. Yang
berhasil mengikuti tutorial, WAJIB isi komentar! Yang masih error, juga WAJIB isi komentar! Karena isi komentar itu
hukumnya WAJIB… haha
Langkah 1 – Form Login
Buat form login dengan mengetikkan kode berikut. Kemudian simpan pada folder yang sama dengan tutorial
sebelumnya (folder belajar) dengan namalogin.php.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<html>
<head>
<title>LOGIN</title>
</head>
<body>
<h1>LOGIN</h1>
<?php
//kode php ini kita gunakan untuk menampilkan pesan eror
if (!empty($_GET['error'])) {
if ($_GET['error'] == 1) {
echo '<h3>Username dan Password belum diisi!</h3>';
} else if ($_GET['error'] == 2) {
echo '<h3>Username belum diisi!</h3>';
} else if ($_GET['error'] == 3) {
echo '<h3>Password belum diisi!</h3>';
} else if ($_GET['error'] == 4) {
echo '<h3>Username dan Password tidak terdaftar!</h3>';
}
}
?>
<form name="login" action="otentikasi.php" method="post">
<table border="0" cellpadding="5" cellspacing="0">
<tr>
<td>Username</td>
<td>:</td>
<td><input type="text" name="username" /></td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td><input type="password" name="password" /></td>
</tr>
<tr align="right">
<td colspan="3"><input type="submit" name="login" value="Login"
38
39
40
41
42
/></td>
</tr>
</table>
</form>
</body>
</html>
Untuk melihat halaman login ini, bukalahhttp://localhost/belajar/login.php pada browser.
Langkah 2 – Otentikasi Login
Setelah membuat form login, kita harus membuat sebuah file untuk memproses data login yang dimasukkan user
apakah valid atau tidak. Ketikkan kode berikut dan simpan dengan nama otentikasi.php.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<?php
include('config.php');
//tangkap 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)) {
//kalau username dan password kosong
header('location:login.php?error=1');
break;
} else if (empty($username)) {
//kalau username saja yang kosong
header('location:login.php?error=2');
break;
} else if (empty($password)) {
//kalau password saja yang kosong
//redirect ke halaman index
header('location:login.php?error=3');
break;
}
$q = mysql_query("select * from user where username='$username' and
password='$password'");
if (mysql_num_rows($q) == 1) {
//kalau username dan password sudah terdaftar di database
34
35
36
37
38
header('location:index.php');
} else {
//kalau username ataupun password tidak terdaftar di database
header('location:login.php?error=4');
}
?>
Kode diatas akan melakukan pengecekan terhadap inputan user yang berupa username dan password apakah
username dan password terdaftar atau tidak dalam database. Penjelasan kode program sudah saya sertakan dalam
baris-baris komentar pada kode program tersebut.
Sampai disini, sistem login sudah dapat digunakan. Cobalah buka halaman login dengan
membuka http://localhost/belajar/login.php pada browser. Kemudian masukkan username dan password
yang sudah dibuat pada tutorial sebelumnya. Coba juga untuk memasukkan berbagai kondisi yang berbeda
seperti memasukkan username dan password yang salah, mengosongkan field username ataupun password,
ataupun mengosongkan keduanya untuk menguji sistem otentikasi yang dibuat.
Sistem login memang sudah berhasil, namun jika hanya sampai tahap ini saja maka fungsi login belum berfungsi
maksimal karena user masih dapat masuk kedalam aplikasi tanpa harus login terlebih dahulu. Cobalah
bukahttp://localhost/belajar/. Halaman tersebut masih dapat diakses tanpa harus login terlebih dahulu karena
kita belum membuat otentikasi pada setiap halaman apakah user harus login terlebih dahulu atau tidak untuk
mendapat akses ke setiap halaman.
Langkah 3 – Otentikasi pada file-file lain
Agar setiap halaman hanya dapat diakses setelah login, kita perlu menambahkan beberapa baris kode pada
file otentikasi.php seperti berikut.
1
2
3
4
5
<?php
include('config.php');
session_start();
6
7
8
9
10
11
12
13
14
15
16
...
if (mysql_num_rows($q) == 1) {
//kalau username dan password sudah terdaftar di database
//buat session dengan nama username dengan isi nama user yang login
$_SESSION['username'] = $username;
//redirect ke halaman index
header('location:index.php');
} else {
...
Untuk dapat membuat otentikasi pada setiap halaman, kita menggunakan session untuk menyimpan data username
dari user yang telah login.session_start()Â digunakan untuk membuat session baru (jika session belum dibuat)
ataupun melanjutkan session (jika session sudah dibuat sebelumnya). Kemudian data username disimpan dalam
session ini dengan menggunakan perintah $_session['username'] = $username yang berarti menyimpan data
username kedalam session dengan nama session adalah username. Selanjutnya, data session inilah yang akan
selalu kita gunakan untuk men-cek apakah user sudah login atau belum.
Untuk melakukan pengencekan, buat dokumen baru dan ketikkan kode berikut. Kemudian simpan dengan
nama cek-login.php.
1
2
3
4
5
6
7
8
9
<?php
session_start();
//jika session username belum dibuat, atau session username kosong
if (!isset($_SESSION['username']) || empty($_SESSION['username'])) {
//redirect ke halaman login
header('location:login.php');
}
?>
Kemudian kita harus meng-include kan file cek-login.php ini pada file-file yang hanya boleh diakses setelah
user login (index.php, edit.php, dan view.php).
1
2
3
<?php
include('cek-login.php');
?>
Cobalah buka halaman index.php, edit.php, dan view.php pada browser. Jika anda belum login, maka
anda akan secara otomatis dialihkan ke halaman login. Setelah login, cobalah untuk membuka
halaman login.php. Masih dapat dibuka? Meskipun anda sudah login? Ya, kita belum membuat pengecekan
login pada halaman login itu sendiri.
Tambahkan kode berikut pada file login.php.
1
2
3
4
5
6
7
8
9
10
<?php
session_start();
if (!empty($_SESSION['username'])) {
header('location:index.php');
}
?>
<html>
<head>
...
Sekarang cobalah buka halaman login.php. Jika anda sudah login, maka anda akan dialihkan ke
halaman index.php.
Langkah 4 – Logout
Sekarang kita buat file untuk logout. Karena kita menggunakan session untuk menyimpan variabel yang digunakan
dalam validasi login, maka untuk logout, kita cukup menghapus session yang digunakan. Ketikkan kode berikut dan
simpan dengan nama logout.php.
1
2
3
4
5
6
7
8
9
10
<?php
//lanjutkan session yang sudah dibuat sebelumnya
session_start();
//hapus session yang sudah dibuat
session_destroy();
//redirect ke halaman login
header('location:login.php');
?>
Kemudian buat link ke file logout.php pada halaman index.php.
1
2
3
4
5
6
7
</table>
</form>
<a href="view.php">Lihat Data</a> || <a href="logout.php">Logout</a>
</body>
</html>
Sekarang, sistem login sudah selesai dibuat. Cobalah untuk login dan logout dengan mencoba-coba berbagai
kombinasi username  dan password.
Kesimpulan
Dasar pembuatan sistem login adalah dengan menggunakan session untuk menyimpan data login yang kemudian
variabel session inilah yang kita gunakan dalam pengecekan apakah user sudah login ataupun belum. Aplikasi ini
hanyalah contoh sederhana penggunaan sistem login. Dalam aplikasi yang lebih kompleks, akan lebih banyak lagi
pengecekan yang digunakan. Semoga bermanfaat dan jangan lupa isi komentar ya ^_^.
Hak Akses dengan PHP
Untuk dapat mengikuti tutorial kali ini, silahkan Anda download dulu file sourcefiles yang saya
sertakan untuk tutorial ini. Ini karena ada beberapa file yang saya sertakan sebagai alat bantu dalam
tutorial kali ini.Â
Download “Hak Akses” hak-akses.zip – Downloaded 8591 times – 109 kB
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:
1
2
3
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. Simpel banget kan… ^_^
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 memilikirole sebagai admin atau tidak, kode program nya akan terlihat seperti berikut.
1
2
3
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 lebih kompleks dari
ini, maka tinggal disesuaikan dan dikembangkan sesuai dengan kebutuhan.
Langkah 1 – Struktur Folder
Buatlah folder dengan nama hak_akses pada C:xampphtdocs. 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 foldercss, 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.
1
2
3
4
5
<link rel="stylesheet" href="css/reset.css" type="text/css" />
<link rel="stylesheet" href="css/normalize.css" type="text/css" />
<link rel="stylesheet" href="css/permata-ui-kit.css" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
Langkah 2 – Database
Buat database dengan nama tutorial_3. Kemudian buat tabel dengan namausers dengan data
sebagai berikut.
FIELDNAME DATATYPE
id_user int(4), PRIMARY, AUTO INCREMENT
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.
1insert into users 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.
1
2
3
4
<?php
// host yang digunakan
$host = 'localhost';
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 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) or die(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 namaindex.php.
1
2
3
4
5
6
7
8
<?php
session_start();
$logged_in = false;
//jika session username belum dibuat, atau session username kosong
if (isset($_SESSION['username']) || !empty($_SESSION['username'])) {
$logged_in = true;
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
}
include_once('config.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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tutorial Hak Akses - Nurwahyudin.Com</title>
<link rel="stylesheet" href="css/reset.css" type="text/css" />
<link rel="stylesheet" href="css/normalize.css" type="text/css" />
<link rel="stylesheet" href="css/permata-ui-kit.css" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<div style="margin:auto; padding:50px 0 30px; text-align:center">
<h1>Nurwahyudin.Com</h1>
<p>Tutorial Hak Akses</p>
</div>
<div style="margin:auto">
<form class="rounded_3 shadow_3" action="insert.php" method="post"
style="width:400px; margin:auto;">
<fieldset class="rounded_3">
<legend>Register New User</legend>
<?php
$message = $_GET['msg'];
if ($message == 'success') {
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
?>
<div class="info">Success</div>
<?php } else if ($message == 'failed') {?>
<div class="error">Error</div>
<?php } ?>
<div>
<label for="username">Username</label> <input id="username"
name="username" class="wide" type="text" required="required" />
</div>
<div>
<label for="password">Password</label> <input id="password"
name="password" class="wide" type="password" required="required" />
</div>
<div>
<label for="email">Email</label> <input id="email" name="email"
class="wide" type="email" required="required" />
</div>
<div>
<label for="fullname">Fullname</label> <input id="fullname"
name="fullname" class="wide" type="text" />
</div>
<div>
<?php if ($logged_in) { ?>
<span class="left"><a href="users.php">Lihat Data</a></span>
<?php } else {?>
<span class="left"><a href="login.php">Login</a></span>
<?php } ?>
<input class="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 kodeif
(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.
1
2
3
4
5
6
7
8
9
10
11
12
<?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')");
13
14
15
16
17
18
19
20
21
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 ketikkanlocalhost/hal_akses/register.php. Hasilnya akan
terlihat seperti gambar dibawah. Cobalah untuk menambahkan beberapa user baru.
Saat ini, kita masih belum dapat login ke aplikasi (iyalah, login nya belum dibikin :D). Selanjutnya kita
buat halaman untuk login.
Langkah 5 – Login
Ketikkan kode berikut dan simpan dengan nama login.php.
1 <?php
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
session_start();
include_once('config.php');
if (!empty($_SESSION['username'])) {
header('location:index.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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tutorial Hak Akses - Nurwahyudin.Com</title>
<link rel="stylesheet" href="css/reset.css" type="text/css" />
<link rel="stylesheet" href="css/normalize.css" type="text/css" />
<link rel="stylesheet" href="css/permata-ui-kit.css" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<div style="margin:auto; padding:50px 0 30px; text-align:center">
<h1>Nurwahyudin.Com</h1>
<p>authorization required!</p>
</div>
<div style="margin:auto">
<form class="rounded_3 shadow_3" action="auth.php" method="post"
style="width:400px; margin:auto;">
<fieldset class="rounded_3">
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<legend>Login</legend>
<?php
$error = $_GET['error'];
if ($error == 1) {
?>
<div class="error">Username dan Password belum diisi.</div>
<?php } else if ($error == 2) {?>
<div class="error">Username belum diisi.</div>
<?php } else if ($error == 3) {?>
<div class="error">Password belum diisi.</div>
<?php } else if ($error == 4) {?>
<div class="error">Username dan Password tidak terdaftar.</div>
<?php } ?>
<div>
<label for="username">Username</label> <input id="username"
name="username" class="wide" type="text" required="required" />
</div>
<div>
<label for="password">Password</label> <input id="password"
name="password" class="wide" type="password" required="required" />
</div>
<div>
<span class="left"><a href="index.php">Daftar Baru</a></span>
<input class="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.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?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)) {
// kalau username dan password kosong
header('location:login.php?error=1');
break;
} else if (empty($username)) {
// kalau username saja yang kosong
header('location:login.php?error=2');
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
break;
} else if (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 ketikkanlocalhost/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.
1
2
3
<?php
session_start();
4
5
6
7
8
9
10
11
12
13
$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.
1
2
3
4
5
6
7
8
9
10
11
12
13
<?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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tutorial Hak Akses - Nurwahyudin.Com</title>
<link rel="stylesheet" href="css/reset.css" type="text/css" />
<link rel="stylesheet" href="css/normalize.css" type="text/css" />
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<link rel="stylesheet" href="css/permata-ui-kit.css" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<div style="margin:auto; padding:50px 0 30px; text-align:center">
<h1>Nurwahyudin.Com</h1>
<p>Tutorial Hak Akses</p>
</div>
<div style="margin:auto">
<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 />
<?php
$message = $_GET['msg'];
if ($message == 'success') {
?>
<div class="info">Success</div>
<?php } else if ($message == 'failed') {?>
<div class="error">Error</div>
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<?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
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
if ($_SESSION['role'] == 'admin') {
?>
<div class="row-actions">
<a href="edit.php?uid=<?php echo $data['id_user'];?>">Edit</a>
<?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>
</div>
<div class="clear"></div>
<div style="padding-bottom:50px;"></div>
</body>
</html>
Perhatikan baris ke-70 terdapat kodeif ($_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 halamanlocalhost/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.
1
2
3
4
5
6
7
8
9
10
11
<?php
session_start();
include_once('config.php');
include_once('cek-login.php');
if ($_SESSION['role'] != 'admin') {
header('location: users.php');
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Tutorial Hak Akses - Nurwahyudin.Com</title>
<link rel="stylesheet" href="css/reset.css" type="text/css" />
<link rel="stylesheet" href="css/normalize.css" type="text/css" />
<link rel="stylesheet" href="css/permata-ui-kit.css" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<div style="margin:auto; padding:50px 0 30px; text-align:center">
<h1>Nurwahyudin.Com</h1>
<p>Tutorial Hak Akses</p>
</div>
<div style="margin:auto">
<form class="rounded_3 shadow_3" action="update.php" method="post"
style="width:400px; margin:auto;">
<fieldset class="rounded_3">
<legend>Edit User</legend>
<?php
$message = $_GET['msg'];
if ($message == 'success') {
?>
<div class="info">Success</div>
<?php } else if ($message == 'failed') {?>
<div class="error">Error</div>
<?php } ?>
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<?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>
<label for="username">Username</label> <input id="username"
name="username" class="wide" type="text" required="required" value="<?php
echo $data['username']; ?>" disabled="disabled" />
</div>
<div>
<label for="password">Password</label> <input id="password"
name="password" class="wide" type="password" required="required" value="<?
php echo $data['password']; ?>" <?php if ($data['username'] == 'admin') {?>
disabled="disabled" <?php } ?> />
</div>
<div>
<label for="email">Email</label> <input id="email" name="email"
class="wide" type="email" required="required" value="<?php echo
$data['email']; ?>" />
</div>
<div>
<label for="fullname">Fullname</label> <input id="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') {
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
if ($data['username'] != 'admin') {
?>
<div>
<label for="role">Role</label>
<select name="role">
<option value="admin">Admin</option>
<option value="member">Member</option>
</select>
</div>
<?php
}
}
?>
<div>
<?php if ($logged_in) { ?>
<span class="left"><a href="users.php">Lihat Data</a></span>
<?php } else {?>
<span class="left"><a href="login.php">Login</a></span>
<?php } ?>
<input class="right" type="submit" name="submit" value="Update
User" />
</div>
<input type="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 kodeif ($_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.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
include('config.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.
1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
include('config.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');
}
?>
Kesimpulan
Hak Akses atau role tidaklah sulit untuk dibuat. Cukup dengan menggunakan logika if sederhana kita
dapat membuat hak akses. Jika ada kesulitan ataupun jika ada yang kurang jelas, silahkan tanyakan
pada kotak komentar dibawah.
Selamat belajar, dan semoga bermanfaat. ^_^