Cara Membuat Form Login di Codeigniter 3

Pada aplikasi web yang kita buat pasti memerlukan login agar bisa masuk ke dalam dashboard atau halaman lain yang memerlukan akses login. Oleh karena itu, pada tutorial kali ini kita akan belajar membuat form login di Codeigniter 3.

Sebelum mengikuti tutorial kali ini, kalian wajib mempunyai project codeigniter yang ingin ditambahkan form login. Jika masih belum mempunyai project codeigniter, kalian bisa download disini. Selain itu, kalian harus membuat table dengan nama users yang mempunyai kolom username dan password.

Langkah 1: Membuat Auth Controller

Langkah yang pertama, kita perlu membuat file Auth.php di path application/controllers/Auth.php dan memasukkan kode di bawah ini ke dalam file tersebut.

<?php
defined('BASEPATH') or exit('No direct script access allowed');

class Auth extends CI_Controller
{
  public function index()
  {
    if ($this->session->userdata('username')) {
      redirect('dashboard');
    }

    $this->form_validation->set_rules('username', 'Username', 'required|trim');
    $this->form_validation->set_rules('password', 'Password', 'required|trim');

    if ($this->form_validation->run() == false) {
      $this->load->view('auth/index');
    } else {
      $this->_login();
    }
  }

  private function _login()
  {
    $username = $this->input->post('username');
    $password = $this->input->post('password');

    $users = $this->db->get_where('users', ['username' => $username])->row_array();

    if ($users) {
      if (password_verify($password, $users['password'])) {
        $data = [
          'username' => $users['username'],
        ];
        $this->session->set_userdata($data);
        redirect('dashboard');
      } else {
        $this->session->set_flashdata('message', '<div class="alert alert-danger text-white" role="alert">Password wrong</div>');
        redirect('auth');
      }
    } else {
      $this->session->set_flashdata('message', '<div class="alert alert-danger text-white" role="alert">Account has not been registered</div>');
      redirect('auth');
    }
  }

  public function logout()
  {
    $this->session->unset_userdata('username');

    $this->session->set_flashdata('message', '<div class="alert alert-success text-white" role="alert">You have been logged out</div>');
    redirect('auth');
  }
}

Berikut penjelasan code diatas:

Disini kita membuat class dengan nama Auth yang terdiri dari 3 method yaitu index, _login, dan logout. Dari setiap method tersebut memiliki tugas dan fungsi yang berbeda.
Untuk method index bertugas melakukan validasi sebelum dilakukan pengecekan. Validasi yang dilakukan diantaranya yaitu mengecek apakah ada session user dan mengecek inputan user sudah sesuai atau belum dengan rules di form validation. Jika kedua validasi itu berhasil dilewati maka nantinya akan menjalankan method _login(). Jika validasinya gagal maka akan kembali ke halaman login.
Untuk method _login bertugas melakukan pencocokan dengan inputan user dan data yang ada di database. Jika username dan password yang diisi oleh user terdapat dalam database maka akan redirect ke halaman dashboard. Jika tidak sesuai maka akan kembali ke halaman login dengan menampilkan pesan error.
Untuk method logout bertugas menghapus session yang menyimpan username dari pengguna agar dapat mengakses login kembali.

Langkah 2: Membuat Auth View

Langkah selanjutnya yaitu kita perlu membuat tampilan login agar pengguna dapat menginputkan usernam dan password account mereka. Kita perlu membuat file baru di application/views/auth/index.php. Lalu, copy code berikut di file barusan yang kalian buat.

<!doctype html>
<html lang="en">

<head>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- Bootstrap CSS -->
  <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

  <title>Cara Membuat Form Login di Codeigniter 3</title>
</head>

<body>
  <form action="<?= base_url('auth') ?>" method="post">
    <label>Username</label>
    <div class="mb-3">
      <input type="text" id="username" name="username" class="form-control" placeholder="Username">
      <?= form_error('username', '<small class="text-danger pl-3">', '</small>'); ?>
    </div>
    <label>Password</label>
    <div class="mb-3">
      <input type="password" id="password" name="password" class="form-control" placeholder="Password">
      <?= form_error('password', '<small class="text-danger pl-3">', '</small>'); ?>
    </div>
    <div class="text-center">
      <button type="submit" class="btn bg-info mt-4 mb-0">Sign in</button>
    </div>
  </form>

  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</body>

</html>

Berikut penjelasan code diatas:

Disini kita menggunakan bootstrap 5 untuk mempercantik tampilan login kita nantinya.
Kita perlu membuat tag form dengan method post dan action yang mengarah ke controller auth yang berisi tag input username dan password. Selanjutnya, pada bagian bawah input kita akan menambahkan pesan error yang akan muncul jika ada error setelah tombol sign in diklik. Terakhir kita perlu tombol button dengan type submit yang akan mengirimkan setiap input ke dalam controller auth.

2 thoughts on “Cara Membuat Form Login di Codeigniter 3”

Leave a Comment Cancel Reply

Baca Juga

Langkah 1: Membuat Auth Controller

Langkah 2: Membuat Auth View

Langkah 3: Membuat Dashboard Controller

Baca Juga

2 thoughts on “Cara Membuat Form Login di Codeigniter 3”

Leave a Comment Cancel Reply