Membuat Fitur Login dan Register dengan PHP

Silahkan ambil bahan di bawah ini:

Bahan

Langkah-langkahnya:

A. Jalankan Service Apache dan MYSQL di XAMPP
B. Membuat Database untuk keperluan menyimpan data user

    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

C. Membuat PROJECT

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

D. Buat File Koneksi Ke Database

Silahkan Buka file dengan nama db_connect.php,

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, 
• Untuk Bagian skrip lainnya kita akan jelaskan fungsinya pada tutorial berikutnya.

E. Membuat Halaman Register

Silahkan buka file register.php,

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, 
• 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, 
• 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 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.

F. Testing Form Register

Silahkan akses form register di alamat http://localhost/app_login_register/register.php

Setelah diisi kita tekan tombol Register, jika anda diarahkan ke halaman login berarti anda sudah berhasil register user.

G. 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(....), nama(....)

Nah berarti sampai sini kita sudah berhasil membuat fitur Register Form untuk registrasi user baru, kita akan lanjut dibagian Fitur Login User.

H. Membuat Fitur Login

Untuk membuat fitur login, silahkan buka file login.php, 

Untuk menjalankan anda bisa mengaksesnya di alamat http://localhost/app_login_register/login.php

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

I. Membuat Halaman Home.php

Halaman home.php adalah halaman yang diakses ketika proses login berhasil, silahkan buka file home.php,

Untuk mengakses anda bisa menggunakan alamat http://localhost/app_login_register/home.php

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

J. Membuat Fitur LOGOUT

Fitur Logout ini digunakan untuk menghapus session dan cookie dari user yang sedang login, silahkan buka file logout.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

J. Membuat Fitur Pengecekan User Yang Sudah Login Di Halaman 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.

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.

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.

L. 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.

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

L. 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. Buka file login.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)