Tutorial CodeIgniter 4 - Cara Membuat Login Page Pada Aplikasi CodeIgniter

Microtrafh - Pada Tutorial kali ini saya akan menjelaskan cara membuat login page di aplikasi CodeIgniter. Sebenarnya jika membuat login di CI cukup mudah. Tidak jauh berbeda jika kita membuat login dengan php normal, tetapi CI memberikan Library yang akan mempermudah dan mengamankan setiap login yang kita buat. Berikut saya akan menjelaskan langkah -langkah membuat login page dengan CI:

Buatlah database dengan nama codeigniter atau boleh diganti sesuai keinginan kalian. Beri nama table login dan field

username : varchar(50)
password : varchar(50)
nama : varchar (50)

Buka file config.php di [root-CI]/application/config/ dan cari kedua variable ini dan ubah seperti ini:

$config['base_url'] = 'http://localhost/codeigniter';
$config['encryption_key'] = '12345';

Selanjutnya buka database.php dan ubah variable seperti ini sesuai konfigurasi mysql kamu:

$db['default']['hostname'] = 'localhost';
$db['default']['username'] = 'root';
$db['default']['password'] = '';
$db['default']['database'] = 'codeigniter';

Konfigurasi selesai.Setelah database dan table dibuat buatlah file login.php pada folder controller di [root-CI]/application/controllers/ dengan struktur seperti ini :

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

//nama class harus sama dengan nama file dan diawali dengan huruf besar
class Login extends CI_Controller {
    public function index()
    {
        //mengambil helpher form. digunakan di v_login.php untuk membuat element form.
        $this->load->helper('form');
        //tampilan html login
        $this->load->view('v_login');
    }
}

Setelah controller dibuat lalu buat file v_login.php pada folder view di [root-CI]/application/views/

<html>
    <head>
        <title>Login Form</title>
    </head>
    <body>
        <?php echo form_open('login_validation'); ?><!-- ini hampir sama dengan <form action="login_validation"></form> -->
        <h5>Username</h5>
        <input type="text" name="username" value="" size="50" />
        <h5>Password</h5>
        <input type="text" name="password" value="" size="50" />
        <div><input type="submit" value="Login" /></div>
        <?php 
            if($this->input->get('gagal')==1){
        ?>
        <span>username atau password salah</span>
        <?php
            }
        ?>
        <?php echo form_close(); ?> <!-- pada bagian ini pun sama menghasilkan </form> -->

    </body>
</html>

setelah itu membuat controller khusus untuk memvalidasi login . Buat controller di folder yang sama dengan login.php diatas dan beri nama login_validation.php

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

class Login_validation extends CI_Controller {
    public function index()
    {
        // load library form validasi , agar login kita lebih aman
        $this->load->library('form_validation');

        $this->load->helper('url'); // digunakan untuk fungsi redirect di bawah

        $this->form_validation->set_rules('username', 'username', 'trim|required|xss_clean');
        $this->form_validation->set_rules('password', 'password', 'trim|required|xss_clean|callback_check_database');// disini terdapat callback : callback_check_database. digunakan untuk memanggil function check_database() dibawah.

        //jika validasi gagal maka akan langsung akan dkembalikan ke login
        if($this->form_validation->run() == FALSE)
        {

            redirect('login?gagal=1','refresh');
        }else
        {
            redirect('home','refresh');

        }
    }

    function check_database()
    {
        $this->load->library('session');
        //validasi kedua dengan cara mengecek database
        $username = $this->input->post('username');
        $password = $this->input->post('password');

        //query ke database dan memanggil model m_login
        $this->load->model('m_login');
        $result = $this->m_login->login($username,$password);

        //jika hasilnya ada pada maka masukan ke season field nama dan username dengan nama season : login
        if($result)
        {
            foreach($result as $row)
            {
                $sess_array = array(
                    'nama'=> $row->nama,
                    'username' => $row->username
                );

                $this->session->set_userdata('login', $sess_array);
            }
            return TRUE;
        }
        else
        {
            return FALSE;
        }
    }
}

pada controller login_validation , fungsi check_database memanggil model m_login untuk mengecek user ke database jadi kita buat dlu model m_login.php di folder [root-CI]/application/models/ seperti ini

<?php
 
 class M_login extends CI_Model {
  
  function __construct()
  {
   parent::__construct();
  }
  
  function login($username, $password)
  {
   $this -> db -> select('username, password,nama');
   $this -> db -> from('login');
   $this -> db -> where('username', $username);
   $this -> db -> where('password', $password);
   $this -> db -> limit(1);
   
   $query = $this -> db -> get();
   
   if($query -> num_rows() == 1)
   {
    
    $result = $query->result();
    
    return $result;
   }
   else
   {
    return false;
   }
  }
  
 }
?>

setelah itu kembali ke controller login.php lalu pada fungsi index tambahkan seasson validasi hingga seperti ini

$this->load->library('session');
            $this->load->helper('url');
            //jika seasson login belum ada maka tampilkan login
            if(!$this->session->userdata('login')){
                //mengambil helpher form. digunakan di v_login.php untuk membuat element form.
                $this->load->helper('form');
                //tampilan html login
                $this->load->view('v_login');
            }else
            {
                //jika seasson ada direct ke home
                redirect('home','refresh');
            }

dan dibawahnya tambahkan fungsi logout

$this->load->library('session');
        $this->load->helper('url');
        $this->session->unset_userdata('login');
        redirect('login','refresh');

sampai tahap ini validasi login telah selesai selanjutnya tinggal buat menu home untuk direct setelah login. Pada tahap ini buat controller home.php di folder controllers sama dengan login.php diatas :

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

//nama class harus sama dengan nama file dan diawali dengan huruf besar
class Home extends CI_Controller {

    public function index()
    {
        $this->load->library('session');
        $this->load->helper('url');
        if($this->session->userdata('login'))
        {
            //mengambil nama dari session
            $session = $this->session->userdata('login');
            $data['nama'] = $session['nama'];
            $this->load->view('v_home',$data);
        }else{
            redirect('login','refresh');   
        }
    }
}

Lalu buat view untuk home beri nama v_home.php:

  public function logout(){
        $this->load->library('session');
        $this->load->helper('url');
        $this->session->unset_userdata('login');
        redirect('login','refresh');
    }

Sekarang pada table login di database insert data
username : test
pasword : test
nama : nama kamu

ini screenshotnya.

tampilan login

test user dan pass salah

hasil jika username dan password salah

menu home

download source code disini
password : blogmicrotrafh
like,+1 atau bagikan jika bermanfaat.
jika mengalami masalah silahkan komentar dibawah.

Tutorial Selanjutnya : Tutorial CodeIgniter 5 - Membuat CRUD dengan CodeIgniter

Tag : codeigniter, tutorial

Tutorial CodeIgniter 4 - Cara Membuat Login Page Pada Aplikasi CodeIgniter

Previous

Next

1 Komentar untuk "Tutorial CodeIgniter 4 - Cara Membuat Login Page Pada Aplikasi CodeIgniter"