BAB 4 : MEMBUAT LOGIN DAN LOGOUT WEBSITE DENGAN PHP DAN MySQLi

1. Tujuan Pembelajaran

Siswa mampu mengimplementasi login dan logout website dengan PHP dan MySQLi.

2. Uraian Materi

Melanjutkan Modul Pembuatan CRUD Data Siswa dengan PHP dan MySQLi. Modul berikutnya
adalah membuat login website. Tujuan dari pembuatan login adalah untuk memberikan keamanan
data yang telah kita buat agar tidak dapat di akses oleh sembarang orang.
Langkah- langkah :
1. Untuk melanjutkan projek pada modul ini maka kita harus membuat table login terlebih dahulu
dengan mengetikkan alamat url sebagai berikut localhost/phpmyadmin kemudian masuk ke
database yang pernah kita buat datasiswa:

Jika selesai mengisikan nama table tekan tombol kirim

2. Buat struktur table dengan id, nama, username dan password. Untuk lebih jelasnya bisa
mengikuti gambar dibawah ini:

Jika telah selesai mengikuti struktur table sebagaimana gambar di atas tekan tombol simpan.

3. Jika Proses pembuatan table beserta atributnya berhasil maka akan muncul page seperti gambar di
bawah ini:
4. Selanjutnya Tab menu tambahka dan isikan sesuai dengan gambar seperti dibawah dan tekan
tombol kirim.

5. Jika proses pembuatan table database dan input data telah selesai maka akan kita lanjutkan untuk
membuat code untuk page login. Pertama-tama buatlah file login.php kedalam folder htdoc xampp
kita.

6. Selanjutnya buka text editor kita kemudian buka file login yang telah kita buat dan masukkan kode
sebagai berikut:

Code ini berfungsi untuk membuat form login di website yang telah kita buat. Untuk mengecek
form yang telah kita buat kita harus buka browser dan mengetikkan url
localhost/smktelkom/login.php jika tidak ada kesalahan dalam pengetikan code maka hasil yang
akan didapatkan adalah sebagai berikut:
7. Selanjutnya kita akan kemudian buatlah file login_proses.php dan masukkan code sebagai berikut:

Barisan barisan kode diatas mempunyai beragam fungsi, include ‘koneksi.php’; berfungsi untuk
melakukan pengecekan koneksi kedalam database yang telah ita miliki, jika koneksi berhasil file
proses_login.php akan melanjutkan proses request yang diberikan user melalui form login.php
dengan megecek hasil input username dan password apakah data tersebut ada didalam table login
atau tidak. Jika data tersebut ada didalam data table login maka akan dialihkan ke index.php namun
jika gagal maka user tetap berada dihalaman login.php.

8. Step selanjutnya kita akan melihat hasil form login dan mencoba menjalankan fungsi login.
Pertama-tama kita akan memasukkan username dan password yang benar maka hasilnya sebagai
berikut:
 Dengan login menggunakan username dan password yang benar maka proses_login.php akan
mengarahkan ke halaman index.php.

9. Selanjutnya kita akan mencoba dengan memasukkan username dan password yang salah, maka
hasilnya akan sebagai berikut:

Terlihat dari gambar diatas jika user memasukkan username dan password yang salah maka user
tidak akan dialihkan ke index.php melainkan akan tetap berada di login.php.

10. Jika melihat hasil yang telah kita kerjaan sudah berhasil dan tidak akan ada error, namun
permasalah bisa kita temukan jika ada user yang iseng memasukkan url
localhost/smktelkom/index.php maka user tersebuat akan berhasil masuk ke index.php tanpa
harus melakukan login dan data yang ada akan dengan mudah dapat di akses oleh orang lain.
11. Untuk mengatasi permasalahan tersebut maka kita akan menambahkan session sebagai penanda
user yang sedang login. Pertama kita akan berikan sedikit tambahan code yang terdapat di
login_proses.php dengan menambahkan session_start(); yang berfungsi untuk mengaktifkan
session pada php. Selain itu kita juga akan melakukan modifikasi pada bagian if else dengan
menambahkan session username dan session status agar dapat dilakukan pengecekan.

12. Selanjutnya kita akan menambahkan code kedalam index.php dengan menambahkan if else jika
session status tidak sama dengan “login” maka halaman akan dialihkan sambil mengirim pesan
“belum login”. Pengecekan ini berfungsi untuk keamanan agar halaman index.php tidak bisa di
akses sebelum melakukan login. Selain itu kita juga menambahkan notifikasi selamat datang untuk
username yang sedang login dengan cara langsung menampilkan session username yang berhasil
login dan yang terakhir kita juga menambahkan tombol link untuk logout.
13. Selanjutnya kita membuat file logout yang berguna untuk menghapus semua session yang telah
dibuat saat login dan mengalihkan halaman kembali ke login.php.

14. Selanjutnya kita akan mencoba melakukan login dan melakukan beberapa cheking error agar
program dapat berjalan sempurna.
Lakukan login dengan username dan password yang benar

Jika berhasil akan menampilkan halaman seperti berikut. Terlihat dari hasil penambahan kode pada
index.php terdapat text selamat datang dan adaya tombol logout.

Selanjutnya tekan tombol logout, jika tombol dan proses logot berjalan dengan baik maka session
admin akan dihapus dan halaman akan dialihkan ke login.php.

Hal yang terakhir harus kita cek adalah dengan memasukkan url localhost/smktelkom/index.php,
jika hasilnya kembali kehalaman login maka session kita bekerja dengan baik, namun jika berhasil
masuk ke index.php maka session kita mengalami error.

TUGAS
Buatlah sistem login logout seperti diatas dan tambahlah data user yang berada di database.