Tutorial PHP Part 48 – Membuat Fitur Login & Register di PHP & MySQL (Menggunakan Session & Cookie)
Selamat datang di warung belajar, dalam tutorial kali ini kita akan membahas mengenai bagaimana membuat fitur Login dan Register di PHP.
Tutorial akan mengimplementasikan 3 tutorial kita sebelumnya mengenai session, cookie, password hash dan password_verify, jadi untuk teman – teman yang belum mengenal mengenai session, cookie password hash dan password_verify, bisa membaca tutorial kita sebelumnya :
- Cara Menggunakan Session di PHP
- Cara Menggunakan Cookie di PHP
- Menggunakan password_hash dan password_verify di PHP
Baik saya asumsikan teman – teman sudah mengenal session, cookie password_hash, dan password_verify, kita langsung saja memulai membuat fitur tersebut.
Persiapan
Pada Tahap persiapan, pastikan teman – teman sudah menyiapkan tools sebagai berikut :
- Text Editor, terserah pakai apa, kita menyarankan pakai visual studio code atau sublime
- Web Browser : Google Chrome/Mozilla/Opera dll
- Server PHP, dalam tutorial ini kita contohkan menggunakan Xampp karena didalamnya sudah ada PHP dan database MySQL, Tutorial Instalasi Xampp : Cara Menginstall Xampp
Nantinya untuk tampilan dari aplikasi kita gunakan bootstrap 4, kita sudah menyiapkan library CSS yang diperlukan, untuk download bisa klik disini Bahan Library CSS
Silahkan dibuka dan download dengan menekan tombol Clone Or Download –> Download Zip
Jalankan Service Apache & MySQL di Xampp
Karena dalam contoh ini saya gunakan xampp, saya perlu menjalankan service untuk apache dan MySQL, silahkan buka Xampp Control Panel dan jalankan 2 service tersebut.
Membuat Database untuk keperluan menyimpan data User
Sebelum kita membuat untuk fitur login & register, kita akan membuat database terlebih dahulu untuk menyimpan data user, langkah – langkanya adalah sebagai berikut :
1. Silahkan Buka browser dan ketikkan localhost/phpmyadmin
2. Lalu klik tombol Basis data / Database
3. Lalu Tuliskan nama databasenya pada form databasenya, dalam contoh ini saya tuliskan dengan nama database_user, lalu berikutnya klik tombol buat
4. Berikutnya buat tabel dengan nama tb_user dengan jumlah kolom 4, lalu klik kirim
5.Lalu buat kolom pada tb_user, dengan urutan sesuai berikut :
- id (integer / Primary Key / Auto Increment)
- username (varchar 255)
- password (varchar 255)
- nama (varchar 255)
Setelah itu klik simpan/save
Nah sampai bagian ini kita sudah membuat database yang nantinya kita gunakan untuk menyimpan data register, dan untuk keperluan login user
Membuat Project
Setelah kita membuat database, berikutnya kita sudah bisa memulai untuk membuat projectnya, karena dalam contoh ini kita membuatnya dengan menggunakan xampp, maka project kita akan disimpan di folder htdocs.
Untuk posisi dari folder htdocs, bisa disesuaikan di folder dari instalasi xampp, karena saya menyimpan di Drive C, maka folder htdocs, berada di C:/xampp/htdocs
kita buat folder didalam folder htdocs, dalam contoh ini kita membuat folder dengan nama app_login_register
Setelah itu buat 5 file dengan nama :
- db_connect.php
- home.php
- login.php
- logout.php
- register.php
berikutnya extract hasil download file bahan, dan letakkan folder assets dalam folder app_login_register, jadi hasilnya adalah seperti berikut ini :
Buat File Koneksi ke database
Silahkan Buka file dengan nama db_connect.php, lalu tuliskan skrip seperti dibawah ini :
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 38 39 40 41 42 43 44 45 46 47 48 49 50 |
<?php class database{ var $host = "localhost"; var $username = "root"; var $password = ""; var $database = "database_user"; var $koneksi; function __construct(){ $this->koneksi = mysqli_connect($this->host, $this->username, $this->password,$this->database); } function register($username,$password,$nama) { $insert = mysqli_query($this->koneksi,"insert into tb_user values ('','$username','$password','$nama')"); return $insert; } function login($username,$password,$remember) { $query = mysqli_query($this->koneksi,"select * from tb_user where username='$username'"); $data_user = $query->fetch_array(); if(password_verify($password,$data_user['password'])) { if($remember) { setcookie('username', $username, time() + (60 * 60 * 24 * 5), '/'); setcookie('nama', $data_user['nama'], time() + (60 * 60 * 24 * 5), '/'); } $_SESSION['username'] = $username; $_SESSION['nama'] = $data_user['nama']; $_SESSION['is_login'] = TRUE; return TRUE; } } function relogin($username) { $query = mysqli_query($this->koneksi,"select * from tb_user where username='$username'"); $data_user = $query->fetch_array(); $_SESSION['username'] = $username; $_SESSION['nama'] = $data_user['nama']; $_SESSION['is_login'] = TRUE; } } ?> |
Keterangan :
- Perhatikan baris 3 – 11 (db_connect.php) itu adalah baris skrip yang kita gunakan untuk membuat koneksi ke database_user, dimana koneksinya disimpan dalam variabel $koneksi, jika anda belum mengetahui perintah untuk koneksi ke database, bisa melihat tutorial kami sebelumnya mengenai cara membuat koneksi php ke database mysql menggunakan oop
- Untuk Bagian skrip lainnya kita akan jelaskan fungsinya pada tutorial berikutnya.
Membuat Halaman Register
Silahkan buka file register.php, lalu isi dengan code seperti berikut :
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 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 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 |
<?php include_once('db_connect.php'); $database = new database(); if(isset($_POST['register'])) { $username = $_POST['username']; $password = password_hash($_POST['password'],PASSWORD_DEFAULT); $nama = $_POST['nama']; if($database->register($username,$password,$nama)) { header('location:login.php'); } } ?> <!doctype html> <html lang="en" class="h-100"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors"> <meta name="generator" content="Jekyll v3.8.5"> <title>Register Form</title> <link rel="canonical" href="https://getbootstrap.com/docs/4.3/examples/sticky-footer/"> <!-- Bootstrap core CSS --> <link href="assets/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <style> .bd-placeholder-img { font-size: 1.125rem; text-anchor: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media (min-width: 768px) { .bd-placeholder-img-lg { font-size: 3.5rem; } } </style> <!-- Custom styles for this template --> <link href="sticky-footer.css" rel="stylesheet"> </head> <body class="d-flex flex-column h-100"> <!-- Begin page content --> <main role="main" class="flex-shrink-0"> <div class="container"> <h1 class="mt-5">Register Form</h1> <p class="lead">Silahkan Daftarkan Identitas Anda</p> <hr/> <form method="post" action=""> <div class="form-group row"> <label for="username" class="col-sm-2 col-form-label">Username</label> <div class="col-sm-10"> <input type="text" class="form-control" id="username" name="username" placeholder="Username"> </div> </div> <div class="form-group row"> <label for="nama" class="col-sm-2 col-form-label">Nama</label> <div class="col-sm-10"> <input type="text" class="form-control" id="nama" name="nama" placeholder="Nama"> </div> </div> <div class="form-group row"> <label for="password" class="col-sm-2 col-form-label">Password</label> <div class="col-sm-10"> <input type="password" class="form-control" id="password" name="password" placeholder="Password"> </div> </div> <div class="form-group row"> <div class="col-sm-10"> <a href="login.php" class="btn btn-success">Login</a> <button type="submit" class="btn btn-primary" name="register">Register</button> </div> </div> </form> </div> </main> <footer class="footer mt-auto py-3"> <div class="container"> <span class="text-muted">Warung Belajar@2019</span> </div> </footer> </body> </html> |
Lalu jalankan dengan perintah : http://localhost/app_login_register/register.php maka tampilannya adalah sebagai berikut :
Keterangan :
- Baris 2 (register.php) kita include file db_connect yang berisi class database untuk melakukan koneksi ke database
- Baris 3 (register.php) kita membuat object dari class database
- Baris 58 (register.php) kita membuat form dengan method post, dan attribute action dengan nilai kosong, yang artinya jika tombol register diklik form akan di proses di file ini juga.
- Baris 62 (register.php) kita membuat inputan form dengan type text, dengan name username
- Baris 69 (register.php) kita membuat inputan form dengan type text, dengan name nama
- Baris 79 (register.php) kita membuat input form dengan type password, dengan name password
- Baris 83 (register.php) kita membuat tombol submit dengan name register
- Baris 4 (register.php) kita menulis perintah untuk melakukan pengecekan terhadap tombol form dengan nama register menggunakan perintah if dan isset, sederhananya perintah ini digunakan untuk mendeteksi apakah tombol register pada form register di klik, tulisan register disini mengacu pada value name pada tombol register Baris 83 (register.php)
- Untuk teman – teman yang belum mengetahui konsep penanganan form di PHP, bisa melihat tutorial kami sebelumnya : Penanganan Form di PHP
- Jika baris kode di baris 4 (register.php) bernilai TRUE, maka akan menjalankan perintah pada line 6 – 12
- Baris 6 (register.php) kita menangkap inputan username dari form dan menyimpannya di variabel $username
- Baris 7 (register.php) kita menangkap inputan password dari form dan membuat hash password menggunakan function password_hash bawaan dari PHP, dan disimpan di variabel $password, untuk pembahasan password_hash bisa dilihat disini : Menggunakan password_hash dan password_verify di PHP
- Baris 8 (register.php) kita menangkap inputan nama dari form dan menyimpannya di variabel $nama
- Baris 9 (register.php) kita memanggil function register di class database, dengan menyertakan 3 parameter yaitu variabel $username, $password, dan $nama, kita menggunakan perintah if karena nantinya function register akan mengembalikan nilai TRUE jika proses berhasil, dan jika nilai pengembaliannya TRUE maka akan menjalankan perintah pada baris 11 (register.php)
- Nah sekarang kita kembali ke file db_connect.php perhatikan pada baris 14 (db_connect.php) pada function register, function register memiliki 3 parameter yaitu variabel $username, $password, dan $nama, variabel ini dikirim dari file register.php pada baris 9 (register.php)
- Baris 16 (db_connect.php) pada function register ini kita menjalankan perintah query untuk insert data ke dalam tabel tb_user, dengan nilai yang ada pada parameter variabel $username, $password, dan $nama, jika proses insert data ke tb_user berhasil maka akan mengembalikan nilai TRUE.
- Urutan penulisan value saat perintah insert data ke tabel, adalah disesuaikan dengan urutan nama kolom di tabel tb_user, jika anda belum mengenal query insert bisa dilihat di tutorial kita sebelumnya : Membuat Crud PHP Mysql menambah data
- Jika function register ini mengembalikan nilai TRUE, maka program akan menjalankan baris 11 (register.php), perintah ini digunakan untuk memanggil file login.php yang berisi halaman login.
Mohon maaf kalau penjelasannya cukup panjang, kita hanya coba menjelaskan perbarisnya, jadi memahaminya pelan – pelan saja ya : ), untuk tampilan dari bootstrapnya anda bisa copy paste saja, dan jangan lupa untuk library CSSnya yang kita siapin sudah diextract dan diletakkan di satu folder project kita.
Testing Form Register
Silahkan akses form register di alamat http://localhost/app_login_register/register.php, lalu kita coba isikan ya datanya :
Setelah diisi kita tekan tombol Register, jika anda diarahkan ke halaman login berarti anda sudah berhasil register user.
Cek data user di database
Coba anda masuk kedalam localhost/phpmyadmin, lalu masuk kedalam database dengan nama database_user, lalu klik di table tb_user.
terlihat terdapat 1 record data dengan yang berisi username (administrator), nama (Aris Samsudin)
Nah berarti sampai sini kita sudah berhasil membuat fitur Register Form untuk registrasi user baru, kita akan lanjut dibagian Fitur Login User.
Membuat Fitur Login
Untuk membuat fitur login, silahkan buka file login.php dan isikan dengan code sebagai berikut :
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 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 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 |
<?php session_start(); include_once('db_connect.php'); $database = new database(); if(isset($_SESSION['is_login'])) { header('location:home.php'); } if(isset($_COOKIE['username'])) { $database->relogin($_COOKIE['username']); header('location:home.php'); } if(isset($_POST['login'])) { $username = $_POST['username']; $password = $_POST['password']; if(isset($_POST['remember'])) { $remember = TRUE; } else { $remember = FALSE; } if($database->login($username,$password,$remember)) { header('location:home.php'); } } ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors"> <meta name="generator" content="Jekyll v3.8.5"> <title>Login Form</title> <link rel="canonical" href="https://getbootstrap.com/docs/4.3/examples/sign-in/"> <!-- Bootstrap core CSS --> <link href="assets/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <style> .bd-placeholder-img { font-size: 1.125rem; text-anchor: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media (min-width: 768px) { .bd-placeholder-img-lg { font-size: 3.5rem; } } </style> <!-- Custom styles for this template --> <link href="assets/css/signin.css" rel="stylesheet"> </head> <body class="text-center"> <form class="form-signin" method="post" action=""> <img class="mb-4" src="assets/assets/css/bootstrap-solid.svg" alt="" width="72" height="72"> <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1> <label for="username" class="sr-only">Username</label> <input type="text" id="username" class="form-control" placeholder="Username" name="username" required autofocus> <label for="password" class="sr-only">Password</label> <input type="password" id="password" class="form-control" placeholder="Password" name="password" required> <div class="checkbox mb-3"> <label> <input type="checkbox" value="remember-me" name="remember"> Remember me </label> </div> <button class="btn btn-lg btn-primary btn-block" type="submit" name="login">Sign in</button> <a href="register.php" class="btn btn-lg btn-success btn-block">Register</a> <p class="mt-5 mb-3 text-muted">Warung Belajar © 2019</p> </form> </body> </html> |
Untuk menjalankan anda bisa mengaksesnya di alamat http://localhost/app_login_register/login.php
Tampilannya adalah seperti berikut ini :
Keterangan :
- Saya coba login dengan username “administrator” dan password yang dibuat dibagian register, lalu saya klik tombol Sign in
- Untuk tampilan kita gunakan template standart login dari bootstrap 4, yang terpenting anda telah meletakkan folder assets hasil bahan di folder project.
- Baris 3 (login.php) kita include file db_connect.php untuk includekan file db_connect.php yang berisi class database
- Baris 4 (login.php) kita membuat object $database dengan menggunakan class database
- Baris 72 (login.php) kita membuat form dengan method post, dan action dengan value kosong, yang artinya proses form ini akan dilakukan di file ini sendiri.
- Baris 76 (login.php) kita membuat input type text dengan name username
- Baris 78 (login.php) kita membuat input type password dengan name password
- Baris 81 (login.php) kita membuat checkbox dengan name remember, checkbox ini digunakan untuk mengaktifkan fitur penyimpan data user di cookie, jika bagian checkbox ini di centang
- Baris 84 (login.php) kita membuat button dengan type submit dengan name login.
- Pemrosesan form dilakukan di Baris 17 (login.php) dengan melakukan check apakah klik pada tombol dengan name “login”, tombol yang dimasud adalah tombol register, jika pengecekan ini bernilai TRUE (artinya tombol login diklik) maka program akan menjalankan code di baris 19 – 33 (login.php)
- Baris 19 (login.php) inputan form dengan name username disimpan di variabel $username
- Baris 20 (login.php) inputan form dengan name password disimpan di variabel $password
- Baris 21 (login.php) dilakukan pengecekan apakah checkbox dengan name remember di centang / di checklist, jika dichecklist maka variabel $remember akan bernilai TRUE, tetapi jika tidak maka variabel $remember akan bernilai FALSE
- Baris 30 (login.php) memanggil function login didalam class database menggunakan object $database, dimana pada function login, mengirimkan 3 parameter dengan nama $username, $password, dan $remember, pemanggilan function login menggunakan IF, karena function login mengembalikan return TRUE, jika proses login berhasil yang akan menjalankan baris 32 (login.php) untuk mengakses halaman home.php
- Berikutnya kita coba lihat file db_connect.php pada baris 20 (db_connect.php) pada function login, terlihat pada function ini memiliki 3 parameter juga yaitu $username, $password, dan $remember, 3 paremeter ini dikirim oleh file login.php di baris 30
- Baris 22 (db_connect.php) kita menuliskan perintah untuk menampilkan data user dengan username yang sesuai dari variabel $username.
- Baris 23 (db_connect.php) kita menampung hasil data user pada variabel $data_user, data berupa array karena kita menggunakan perintah fetch_array()
- Baris 24 (db_connect.php) kita menggunakan perintah password_verify untuk mencocokan password hasil inputan dari form login (variabel $password) dan nilai password di tabel user atas username administrator, jika password sesuai maka akan menjalankan code dibaris 26 – 35 (db_connect.php)
- Baris 27 (db_connect.php) kita melakukan pengecekan apakah nilai dari variabel $remember adalah TRUE (variabel $remember bernilai TRUE jika checkbox remember dicentang) jika bernilai TRUE maka akan menjalankan perintah di baris 29 – 30 (db_connect.php)
- Baris 29 (db_connect.php) kita membuat COOKIE dengan nama “username” dengan nilai value dari variabel $username dalam hal ini “administrator”
- Baris 30 (db_connect.php) kita membuat COOKIE dengan nama “nama” dengan nilai value dari kolom nama dari tb_user dengan username “administrator” dalam hal ini “Aris Samsudin”
- Baris 32 (db_connect.php) kita membuat SESSION dengan nama “username” dengan value variable $username dalam hal ini “administrator”
- Baris 33 (db_connect.php) kita membuat SESSION dengan nama “nama” dengan value kolom nama di tabel tb_user hasil query dibaris 22 dalam hal ini adalah “Aris Samsudin”
- Baris 34 (db_connect.php) kita membuat SESSION dengan nama “is_login” dengan value TRUE.
- Baris 35 (db_connect.php) kita mengembalikan nilai TRUE, yang akan menjalankan Baris 32 (login.php) yang akan meredirect halaman ke home.php
Baik itu adalah penjelasan dari proses fitur login, berikutnya kita akan membuat halaman home, yang berfungsi sebagai halaman yang akan ditampilkan ketika login berhasil
Membuat Halaman home.php
Halaman home.php adalah halaman yang diakses ketika proses login berhasil, silahkan buka file home.php dan isi codenya sebagai berikut :
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 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 66 67 68 69 70 71 72 73 |
<?php session_start(); if(! isset($_SESSION['is_login'])) { header('location:login.php'); } ?> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="description" content=""> <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors"> <meta name="generator" content="Jekyll v3.8.5"> <title>Starter Template · Bootstrap</title> <link rel="canonical" href="https://getbootstrap.com/docs/4.3/examples/starter-template/"> <!-- Bootstrap core CSS --> <link href="assets/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <style> .bd-placeholder-img { font-size: 1.125rem; text-anchor: middle; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media (min-width: 768px) { .bd-placeholder-img-lg { font-size: 3.5rem; } } </style> <!-- Custom styles for this template --> <link href="assets/css/starter-template.css" rel="stylesheet"> </head> <body> <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top"> <a class="navbar-brand" href="#">WB</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarsExampleDefault"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> </ul> <a href="logout.php" class="form-inline my-2 my-lg-0 btn btn-secondary">Logout</a> </div> </nav> <main role="main" class="container"> <div class="starter-template"> <h1>Selamat Datang <?php echo $_SESSION['nama']; ?></h1> <p class="lead">Belajar PHP Sangat Menyenangkan</p> </div> </main><!-- /.container --> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script>window.jQuery || document.write('<script src="/docs/4.3/assets/js/vendor/jquery-slim.min.js"><\/script>')</script><script src="/docs/4.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-xrRywqdh3PHs8keKZN+8zzc5TX0GRTLCcmivcbNJWm2rs5C8PRhcEn3czEjhAO9o" crossorigin="anonymous"></script></body> </html> |
Untuk mengakses anda bisa menggunakan alamat http://localhost/app_login_register/home.php, kurang Lebih tampilannya adalah sebagai berikut :
Keterangan :
- Karena kita sudah berhasil login dengan username administator, maka akan tampil Tulisan Selamat Datang “Aris Samsudin” tulisan Aris Samsudin adalah nama dari usernya atas username administrator
- Baris 2 (home.php) kita menuliskan session_start(); karena akan mengakses data session
- Baris 66 (home.php) kita menuliskan perintah echo $_SESSION[‘nama’]; yang digunakan untuk menampilkan session dengan name “nama” sehingga menampilkan nama sesuai yang sedang login dalam hal contoh ini “Aris Samsudin”
- Baris 58 (home.php) kita membuat link dengan tulisan Logout, dimana link ini akan mengakses file logout.php
Itu adalah file home, berikutnya kita akan membuat file logout.php
Membuat Fitur Logout
Fitur Logout ini digunakan untuk menghapus session dan cookie dari user yang sedang login, silahkan buka file logout.php dan isikan dengan code berikut ini :
1 2 3 4 5 6 7 8 |
<?php session_start(); session_unset(); session_destroy(); setcookie('username', '', 0, '/'); setcookie('nama', '', 0, '/'); header('location:login.php'); ?> |
Keterangan :
- Baris 2 (logout.php) digunakan untuk menjalankan session
- Baris 3 – 4 (logout.php) digunakan untuk menghapus data session dari user
- Baris 5 – 6 (logout.php) digunakan untuk menghapus data cookie
- Baris 7 (logout.php) digunakan untuk redirect ke halaman login.php
Membuat Fitur Pembatasan Akses untuk user yang belum login
Fungsi dari fitur login salah satunya adalah memberikan pembatasan akses dari sebuah fitur aplikasi.
Sebagai contoh halaman home.php hanya bisa diakses untuk user yang sudah login saja.
1 2 3 4 |
if(! isset($_SESSION['is_login'])) { header('location:login.php'); } |
Perhatikan code pada baris 3 (home.php) kita melakukan pengecekan, jika tidak ditemukan session dengan nama “is_login”, maka akan menjalankan baris 5 yang akan meredirect ke halaman login.php, sehingga pengguna aplikasi harus login terlebih dahulu
1 2 3 |
$_SESSION['username'] = $username; $_SESSION['nama'] = $data_user['nama']; $_SESSION['is_login'] = TRUE; |
Seperti yang telah dibahas saat fitur login baris 34 (db_connect.php), ketika user berhasil login akan dibuatkan session dengan nama is_login dengan TRUE, tetapi jika user belum login maka tidak memiliki session dengan nama is_login, sehingga untuk melakukan pengecekan user sudah login atau belum cukup dengan melakukan cek SESSION dengan nama is_login
Membuat Fitur Pengecekan User yang sudah login di halaman login
Jika user sudah login, seharusnya ketika mengakses di halaman login.php, akan diredirect ke halaman home.php karena user sudah dinggap login sehingga tidak perlu login ulang, nah perhatikan perintah berikut ini :
1 2 3 4 |
if(isset($_SESSION['is_login'])) { header('location:home.php'); } |
Keterangan :
- Pada baris 6 (login.php) code ini digunakan untuk melakukan pengecekan jika ada session dengan nama is_login, maka akan diredirect ke halaman home.php (baris 7 – login.php)
- Karena jika user memiliki session dengan is_login maka dianggap user tersebut sudah login, sehingga tidak perlu login lagi
Fitur Relogin dengan Cookie
Seperti saat kita membahas mengenai cookie, cookie memiliki kelebihan bisa mengatur waktu expired, berbeda dengan session, jika session otomatis akan dihapus ketika browser diclose.
nah pada bagian form login ada fitur checkbox remember, ketika checkbox remember dichecklist maka akan dibuatkan COOKIE saat proses login.
Jadi ilustrasinya ketika kita checklist bagian remember saat login, maka user akan dibuatkan cookie, dan ketika anda close browser, lalu membuka browser kembali, dan mengakses halaman login, harusnya anda langsung diredirect ke halaman home, anda tidak perlu login ulang karena informasi data user anda masih disimpan di cookie, karena cookie tidak akan dihapus meskipun browser diclose.
perhatikan perintah berikut ini di file login.php :
1 2 3 4 5 |
if(isset($_COOKIE['username'])) { $database->relogin($_COOKIE['username']); header('location:home.php'); } |
Keterangan :
- Baris 11 (login.php) perintah itu melakukan pengecekan apakah memiliki COOKIE dengan nama username
- Jika memiliki COOKIE dengan nama username, maka akan menjalankan code di baris 13 – 14 (login.php)
- Baris 13 (login.php) perintah itu mengakses relogin di class database, dengan parameter COOKIE dengan nama username
- Perintah baris 39 (db_connect.php) pada function relogin, function relogin memiliki 1 paremeter dengan variabel $username.
- baris 41 (db_connect.php) perintah untuk melakukan query untuk mencari data pada tb_user dengan username sesuai dengan variabel $username
- baris 42 (db_connect.php) kita buat variabel $data_user untuk menyimpan data user sesuai username sesuai dengan variabel $username, data yang disimpan berupa array karena kita menggunakan fetch_array()
- baris 43 (db_connect.php) kita membuat SESSION dengan nama “username” dengan nilai dari variabel $username
- baris 44 (db_connect.php) kita membuat SESSION dengan nama “nama” dengan nilai dari kolom nama pada table tb_user sesuai username di variabel $username
- baris 45 (db_connect.php) kita membuat SESSION dengan nama “is_login” dengan nilai TRUE
- lalu berikutnya meredirect ke halaman home.php (baris 14 – login.php)
Jadi kurang lebih seperti itu teman – teman pembahasan tutorial kali ini, kita telah membuat fitur login, register, yang menggunakan session dan cookie, serta menggunakan fitur password_hash dan password_verify.
Untuk source code hasil belajar bisa didownload dengan Klik Disini
Jika ada yang ingin didiskusikan silahkan di kolom komentar, sekian dulu sampai jumpa di tutorial selanjutnya.
ANDA INGIN SERIUS BELAJAR PEMROGRAMAN PHP ?
Seperti yang anda ketahui bahwa saat ini skill di bidang pemrograman sangatlah dibutuhkan, salah satunya adalah pemograman PHP.
Untuk anda yang ingin serius belajar pemrograman PHP, Warung Belajar Memiliki Beberapa Paket Tutorial yang bisa membantu anda dalam belajar Pemrograman PHP, dari mulai step – step dasar hingga mampu membuat aplikasi berbasis web dengan menggunakan PHP.
Paket Tutorial ini berisi video tutorial belajar pemrograman berbahasa indonesia, cocok sekali untuk anda yang sedang belajar pemrograman PHP, bahkan untuk orang awam sekalipun.
Paket Tutorial ini juga dilengkapi dengan study kasus yang akan mempermudah pemahaman anda dalam belajar pemrograman, Mari berinvestasi untuk menambah skill dalam menguasai Pemrograman PHP
-
Tutorial Seminggu Menguasai PHP Dan MySQL
Rp80,000 Add to cart -
Tutorial HTML White Box – Panduan Belajar HTML Lengkap
Rp70,000 Add to cart -
Tutorial Web Programming Black Box – Tutorial Belajar HTML, CSS, Bootstrap 4, PHP OOP, dan MySQL – Study Kasus Membuat Aplikasi Sistem Management Stok Barang
Rp120,000 Add to cart -
Tutorial Membuat Aplikasi Dengan Codeigniter, Javascript Dan Ajax Jquery
Rp95,000 Add to cart -
Tutorial Membangun Layanan SMS Gateway Berbasis Client Server
Rp145,000 Add to cart -
Tutorial Membuat Aplikasi Dinamis Dengan HTML CSS Boostrap PHP Dan MySQL
Rp120,000 Add to cart -
TUTORIAL MEMBANGUN APLIKASI BERBASIS WEB DENGAN PHP MYSQL DAN BOOTSTRAP
Rp95,000 Add to cart -
Tutorial Tips Dan Trik Aplikatif Master PHP
Rp85,000 Add to cart
Selamat pagi bang.. Bang saya lg belajar utk login multi level tp gk paham2, seandainya saya hnya mau menampilkan data inputan sesuai dengan yg dbuat akun username tersebut gmn bang.. Jd tiap2 user hnya bs melihat data nya sendiri… Terima kasih bang..
selamat pagi mas, kalau membuat seperti itu biasanya saya pada bagian tabel datanya, semisal tabel barang gitu ya,, saya tambahkan kolom user_entry, sehingga pada waktu user tersebut masuk ke menu tersebut, data yang ditampilkan hanya berdasarkan user itu, bisa dibuat query contohnya semacam ini : select * from nama_tabel where user_entry=nama_user, nanti nama user didapat dari session kurang lebih saya biasanya seperti itu
Makasih Mas! Udah Nyari Tutor-Nya Tapi Dapet Yang OUTDATE Semua v: (Ketemu Ini Gampang Si… Tinggal Setting Di Search Engine-Nya) btw Saya Sarankan Fitur Komen-nya Menggunaka DISQUS Biar Lebih Enak.
mas knp di bagian file db_connect.php no 23 nya selalu eror mas
pastikan koneksi ke databasenya benar, dan juga pastikan database dan tabelnya sudah terbuat, dan namanya sesuai
kenapa pada saat saya jalankan pada localhost, kok masih terdapat error pada baris 7 file register.php. mohon pencerahannya
coba cek dibagian name dibagian password kak, atau dibagian perintah password_hashnya
saya coba menghapus baris 7, password pada database kan jadi muncul password biasa tanpa enskripsi. lah saya abaikan enskripsi password. Ketika saya jalankan program, setelah register berhasil masuk kemudian kan diarahlan untuk login. ketika saya login , itu terdapat error pada baris 24 file koneksi.php. Itu kenapa yaa. mohon pencerahannya
karena saat proses login, kita mengecek verifikasi password, sedangkan tadi dibagian register dihapus proses hashnya , itu yang buat erro, saran aja untuk password gunakan hash
Informasinya sangat membantu sekali.
Terima kasih.
mau nanya mas, kenapa registernya ga mau lebih dari 1 kali ya mas? apa ada yang perlu diubah pada scriptnya mas? Thank you mas.
dan untuk menambahkan atribut baru bagaimana mas?
bisa menambahkan kolom di tabel jika diperlukan
berarti program diatas cuma bisa register 1 kali mas?
harusnya bisa lebih dari satu kak
harusnya bisa mas, coba gunakan source code yang kita sertakan
Terimakasih atas tutorialnya, berfungsi dengan baik !
Supaya register Username yang sama tidak di izinkan, bagaimana lanjutannya, adakah Tutorialnya?
Sebelum diinsert bisa dilakukan pengecekan apakah user dengan username itu ada, jika tidak maka akan insert data, atau bisa dijadikan unique untuk bagian kolom username
kalo file assets dari mana dapat bang??
coba download source code yang kita sediakan kak, diakhir artikel
Min, saya sudah mengikuti langkah dan copy paste sesuai skript yang diberikan di masing masing file php. Saya sudah berhasil masuk register dan datanya ada di tb_user. tapi kenapa disaat di sesi login ketika saya klik sign in, saya kembali di login dengan pesan “Notice
: Undefined index: password in
E:\xampp\htdocs\app_login_register\db_connect.php
on line
24”. kan seharusnya masuk Home.php. Mohon bantuan dan pencerahannya
sepertinya name dibagian form password, tidak sesuai.. atau bisa download source code yang kita sediakan , nanti bisa disamakan kak
Terima kasih infonya, tapi saya pengen nanya nih. Kenapa ya datanya nggak masuk ke database saya pas saya coba login & registernya? padahal saya udah masukin nama database saya di bagian file “db_connect.php”nya. Mohon bantuannya, terima kasih.
coba cek koneksi di databasenya, apakah sudah sesuai…, cek juga nama kolom yang di tabel database apakah sudah sesuai
mau tanya ini menggunakan konsep oop ya min?
ya kak monggo
ada kah caranya supaya bisa memisahkan halaman user dan admin?
bisa dengan menambahkan user_level didalam tabel user, nanti bisa diisi levelnya, misal user dan admin, jadi ketika login dilakukan melakukan pengecekan status usernya apa, jika user biasa kita redirect ke halaman A semisal, jika user admin kita arahkan ke halaman B semisal, secara logika konsepnya seperti itu
Hai kak, apakah bisa di ganti dengan enkripsi sha1 atau md5 dan sebagainya kak?
Bisa kak, cuma kami tidak menyarankan menggunakan SH1 atau md5 karena sudah banyak website yang bisa decrypt SH1 dan md5
kak, saya bisa login tapi gak bisa logout, apa gak ada cara logout manual?
dibagian bawah ada source code tutorialnya kak, bisa disesuaikan untuk cara logoutnya, sebenarnya proses logout itu hanya menghilangkan session yang dicek saat authentikasi saja mas
terimakasih tutornya mas, tapi ketika login/register kosong kok gk ada peringatan gagal gitu,, solusinya dong mas.. makasih
Bisa ditambahkan required, bisa dilihat di tutorial validasi form html https://www.warungbelajar.com/membuat-form-validasi-dengan-html-5.html
Udah bisa mas,, tapi pas login ketik sembarang ada tulisan ” trying to access array offset on value of type null in db_connect.php on line 24″
speertinya dibagian method password_verifiy salah dibagian parameternya, coba cek hasil query pengecekan database sebelumnya mas
bang mau naya ngatur username sama password nya di bagian apa?
Set aja di tabel tb_user mas, kan ada kolom username dan password
bang keamrin kan udah bisa tapi sekarang
ada tulisan kaya giini
mysqli_connect(): (HY000/1049): Unknown database database_user’ in
itu kenapa ya
terus. tampilan nya css nya gakke baca
Warning: mysqli_connect(): (HY000/1049): Unknown database ‘database_user’ in C:\xampp1\htdocs\app_login_register\db_connect.php on line 10
sama tulisan kek gitu
Coba mas nya pastikan service mysql sudah aktif, lalu untuk database dengan nama itu juga sudah ada
saya mau nambah user ko ga bisa kenapa ya ?
gak bisanya itu keterangannya gimana kak ?
Fatal error: Call to a member function fetch_array() on boolean in C:\xampp\htdocs\oop-mysqli\login_register_php-master\db_connect.php on line 23
error gimana ya
coba cek perintah query kak, atau coba samakan dengan script yang kita sertakan… link source code ada dibawah
Permisi gan mau tanya. pada waktu keamanan password saya ganti ke md5 terus saya regis. pas saya masuk ke halaman login tidak bisa ya?
tidak bisa kak… karena waktu daftar user baru tidak menggunakan md5,, function yang digunakan untuk melakukan encrypt ke md5 juga beda, sedangkan yang dicontohkan di tutorial menggunakan perintah password_hash
kak ko di baris 23 di file koneksi yang “$data_user = $query->fetch_array();” ERROR
coba samakan dengan source code yang kita sediakan kak, dibagian bawah ada link untuk download full source codenya
mau tanya gan kenapa saat di klik login balik ke menu login.php lagi tidak bisa ke menu home.php?
dibagian
relogin($_COOKIE[‘username’]);
header(‘location:home.php’);
}
if(isset($_POST[‘login’]))
{
$username = $_POST[‘username’];
$password = $_POST[‘password’];
if(isset($_POST[‘remember’]))
{
$remember = TRUE;
}
else
{
$remember = FALSE;
}
if($database->login($username,$password,$remember))
{
header(‘location:home.php’);
}
}
?> ada yg salah ?
coba cek di method login itu dengan object database,,, harusnya disitu harus mengembalikan nilai true, akan bisa redirect ke bagian home
kenapa pas register tidak terjadi apa apa ? cuma refresh doang, pas di cek di database juga ga muncul, script sudah saya samakan, malah saya copy pas nyoba kesekian kalinya tapi tetep aja ga masuk ke database, mohon bantuannya pak
Coba mas cek nama kolom di databasenya atau settingan koneksi ke database pastikan sudah sesuai
Min Ini kenapa menu loginnya gak bisa drect ke home ya? padahal sudah saya ikuti petunjuk diatasa satu persatu.
coba cek dibagian redirect yang ke home kak, atau coba sesuaikan source code yang kita sediakan