Cara Membuat Login dengan Session pada CodeIgniter 3

Session merupakan cara yang untuk menyimpan sebuah aktifitas pada sebuah komputer, pada tutorial kali ini kita akan mencoba membuat sebuah login pada CodeIgniter 3 dengan menggunakan session.

Dalam tutorial ini, kita akan belajar tentang membuat form login sederhana di CodeIgniter. Pada form login, kami membuat modul registrasi, modul login dan panel admin menggunakan session.

Membuat sesi di CodeIgniter berbeda dari PHP sederhana. Kita akan memberi Anda informasi rinci tentang semua metode saat kita melangkah lebih jauh dalam tutorial ini. Sebelum memulai, mari kita lihat apa yang akan kita pelajari.

Membuat halaman login, halaman pendaftaran dan halaman admin.
Menyiapkan validasi untuk semua input dari masukan user. Check pengguna yang ada di database selama proses pendaftaran.
Check username dan password pada database dan menunjukkan informasi yang tersimpan pada database.
Membuat sesi untuk panel admin, simpan data input dari pengguna kedalam sebuah session dan menghancurkan atau menghapus Session (logout).

Kami memperkenalkan Alur kerja aplikasi yang akan memberi Anda gambaran yang jelas tentang tujuan tutorial ini.

Terdapat Login Form pada aplikasi.
Login Form berisi username dan password.
Check validasi dari username dan password.
Kalau benar atau ada pada database, maka membuat sesi dan menyimpan informasi user dari database ke sesi data.
redirect ke admin page.
menampilkan informasi user pada admin page.
menampilkan tombol logout.
kalau logout diklik, maka sesi dihapus.
redirect ke login page.

Pertama, tetapkan atau set base URL dalam file config.php pada CodeIgniter 3 seperti pengaturan yang diberikan di bawah ini:

$config['base_url'] = 'http://localhost/login/';

ini berarti nama folder CodeIgniter 3 kita adalah login.

Cara Pembuatan Login

Di bawah ini adalah detail kode yang digunakan dalam tutorial ini dengan penjelasan yang tepat.

Section Artikel

1 1. Membuat Tabel dan Database
2 2. Membuat Controller
3 3. Membuat View
4 4. Membuat Model
5 Proses Registrasi atau Sign Up
6 Proses Sign In
7 Kesimpulan

1. Membuat Tabel dan Database

Hal pertama adalah membuat nama database dengan nama database login dan membuat sebuah tabel dengan nama tabel user_login menggunakan kode yang diberikan di bawah ini

create database login;
CREATE TABLE IF NOT EXISTS `user_login` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`user_name` varchar(255) NOT NULL,
`user_email` varchar(255) NOT NULL,
`user_password` varchar(255) NOT NULL,
PRIMARY KEY (`id`)
)

2. Membuat Controller

Sebelum memulai pengkodean atau memulai membuat kode, mari load semua library yang diperlukan untuk membuat dan mengelola formulir login.

Pertama kita perlu memuat library session dan library validation dalam file Controller. Jadi, mari mulai membuat kode dengan Controller.

Kita buat nama file controller dengan nama user_authentication.php pada folder application / controllers di CodeIgniter 3. Kemudian menulis kode yang diberikan di bawah ini dalam file.

<?php

session_start(); //we need to start session in order to access it through CI

Class User_Authentication extends CI_Controller {

public function __construct() {
parent::__construct();

// Load form helper library
$this->load->helper('form');

// Load form validation library
$this->load->library('form_validation');

// Load session library
$this->load->library('session');

// Load database
$this->load->model('login_database');
}

// Show login page
public function index() {
$this->load->view('login_form');
}

// Show registration page
public function user_registration_show() {
$this->load->view('registration_form');
}

// Validate and store registration data in database
public function new_user_registration() {

// Check validation for user input in SignUp form
$this->form_validation->set_rules('username', 'Username', 'trim|required|xss_clean');
$this->form_validation->set_rules('email_value', 'Email', 'trim|required|xss_clean');
$this->form_validation->set_rules('password', 'Password', 'trim|required|xss_clean');
if ($this->form_validation->run() == FALSE) {
$this->load->view('registration_form');
} else {
$data = array(
'user_name' => $this->input->post('username'),
'user_email' => $this->input->post('email_value'),
'user_password' => $this->input->post('password')
);
$result = $this->login_database->registration_insert($data);
if ($result == TRUE) {
$data['message_display'] = 'Registration Successfully !';
$this->load->view('login_form', $data);
} else {
$data['message_display'] = 'Username already exist!';
$this->load->view('registration_form', $data);
}
}
}

// Check for user login process
public function user_login_process() {

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

if ($this->form_validation->run() == FALSE) {
if(isset($this->session->userdata['logged_in'])){
$this->load->view('admin_page');
}else{
$this->load->view('login_form');
}
} else {
$data = array(
'username' => $this->input->post('username'),
'password' => $this->input->post('password')
);
$result = $this->login_database->login($data);
if ($result == TRUE) {

$username = $this->input->post('username');
$result = $this->login_database->read_user_information($username);
if ($result != false) {
$session_data = array(
'username' => $result[0]->user_name,
'email' => $result[0]->user_email,
);
// Add user data in session
$this->session->set_userdata('logged_in', $session_data);
$this->load->view('admin_page');
}
} else {
$data = array(
'error_message' => 'Invalid Username or Password'
);
$this->load->view('login_form', $data);
}
}
}

// Logout from admin page
public function logout() {

// Removing session data
$sess_array = array(
'username' => ''
);
$this->session->unset_userdata('logged_in', $sess_array);
$data['message_display'] = 'Successfully Logout';
$this->load->view('login_form', $data);
}

}

?>

3. Membuat View

Langkah Selanjutnya adalah kita dapat membuat tampilan view login dengan nama login_form.php File dapat dituliskan dengan menambahkan kode berikut

<html>
<?php
if (isset($this->session->userdata['logged_in'])) {

header("location: http://localhost/login/index.php/user_authentication/user_login_process");
}
?>
<head>
<title>Login Form</title>
<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/style.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'>
</head>
<body>
<?php
if (isset($logout_message)) {
echo "<div class='message'>";
echo $logout_message;
echo "</div>";
}
?>
<?php
if (isset($message_display)) {
echo "<div class='message'>";
echo $message_display;
echo "</div>";
}
?>
<div id="main">
<div id="login">
<h2>Login Form</h2>
<hr/>
<?php echo form_open('user_authentication/user_login_process'); ?>
<?php
echo "<div class='error_msg'>";
if (isset($error_message)) {
echo $error_message;
}
echo validation_errors();
echo "</div>";
?>
<label>UserName :</label>
<input type="text" name="username" id="name" placeholder="username"/><br /><br />
<label>Password :</label>
<input type="password" name="password" id="password" placeholder="**********"/><br/><br />
<input type="submit" value=" Login " name="submit"/><br />
<a href="<?php echo base_url() ?>index.php/user_authentication/user_registration_show">To SignUp Click Here</a>
<?php echo form_close(); ?>
</div>
</div>
</body>
</html>

Setelah membuat tampilan login, maka kita dapat membuat tampilan registrasi dengan nama registration_form.php dengan menambahkan kode berikut pada file

<html>
<?php
if (isset($this->session->userdata['logged_in'])) {
header("location: http://localhost/login/index.php/user_authentication/user_login_process");
}
?>
<head>
<title>Registration Form</title>
<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/style.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'>
</head>
<body>
<div id="main">
<div id="login">
<h2>Registration Form</h2>
<hr/>
<?php
echo "<div class='error_msg'>";
echo validation_errors();
echo "</div>";
echo form_open('user_authentication/new_user_registration');

echo form_label('Create Username : ');
echo"<br/>";
echo form_input('username');
echo "<div class='error_msg'>";
if (isset($message_display)) {
echo $message_display;
}
echo "</div>";
echo"<br/>";
echo form_label('Email : ');
echo"<br/>";
$data = array(
'type' => 'email',
'name' => 'email_value'
);
echo form_input($data);
echo"<br/>";
echo"<br/>";
echo form_label('Password : ');
echo"<br/>";
echo form_password('password');
echo"<br/>";
echo"<br/>";
echo form_submit('submit', 'Sign Up');
echo form_close();
?>
<a href="<?php echo base_url() ?> ">For Login Click Here</a>
</div>
</div>
</body>
</html>

Kita telah membuat file tampilan untuk login dan registrasi, saat ini kita dapat membuat tampilan admin dengan nama admin_page.php dengan menambahkan kode berikut

<html>
<?php
if (isset($this->session->userdata['logged_in'])) {
$username = ($this->session->userdata['logged_in']['username']);
$email = ($this->session->userdata['logged_in']['email']);
} else {
header("location: login");
}
?>
<head>
<title>Admin Page</title>
<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>css/style.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'>
</head>
<body>
<div id="profile">
<?php
echo "Hello <b id='welcome'><i>" . $username . "</i> !</b>";
echo "<br/>";
echo "<br/>";
echo "Welcome to Admin Page";
echo "<br/>";
echo "<br/>";
echo "Your Username is " . $username;
echo "<br/>";
echo "Your Email is " . $email;
echo "<br/>";
?>
<b id="logout"><a href="logout">Logout</a></b>
</div>
<br/>
</body>
</html>

4. Membuat Model

Saat ini kita akan membuat sebuah model dengan nama login_database.php dengan menambahkan kode berikut

<?php

Class Login_Database extends CI_Model {

// Insert registration data in database
public function registration_insert($data) {

// Query to check whether username already exist or not
$condition = "user_name =" . "'" . $data['user_name'] . "'";
$this->db->select('*');
$this->db->from('user_login');
$this->db->where($condition);
$this->db->limit(1);
$query = $this->db->get();
if ($query->num_rows() == 0) {

// Query to insert data in database
$this->db->insert('user_login', $data);
if ($this->db->affected_rows() > 0) {
return true;
}
} else {
return false;
}
}

// Read data using username and password
public function login($data) {

$condition = "user_name =" . "'" . $data['username'] . "' AND " . "user_password =" . "'" . $data['password'] . "'";
$this->db->select('*');
$this->db->from('user_login');
$this->db->where($condition);
$this->db->limit(1);
$query = $this->db->get();

if ($query->num_rows() == 1) {
return true;
} else {
return false;
}
}

// Read data from database to show data in admin page
public function read_user_information($username) {

$condition = "user_name =" . "'" . $username . "'";
$this->db->select('*');
$this->db->from('user_login');
$this->db->where($condition);
$this->db->limit(1);
$query = $this->db->get();

if ($query->num_rows() == 1) {
return $query->result();
} else {
return false;
}
}

}

?>

Dapat menambah kode CSS pada tampilan website untuk memperindah tampilan website

#main{
width:960px;
margin:50px auto;
font-family:raleway;
}

span{
color:red;
}

h2{
background-color: #FEFFED;
text-align:center;
border-radius: 10px 10px 0 0;
margin: -10px -40px;
padding: 30px;
}

#login{

width:300px;
float: left;
border-radius: 10px;
font-family:raleway;
border: 2px solid #ccc;
padding: 10px 40px 25px;
margin-top: 70px;
}

input[type=text],input[type=password], input[type=email]{
width:99.5%;
padding: 10px;
margin-top: 8px;
border: 1px solid #ccc;
padding-left: 5px;
font-size: 16px;
font-family:raleway;
}

input[type=submit]{
width: 100%;
background-color:#FFBC00;
color: white;
border: 2px solid #FFCB00;
padding: 10px;
font-size:20px;
cursor:pointer;
border-radius: 5px;
margin-bottom: 15px;
}

#profile{
padding:50px;
border:1px dashed grey;
font-size:20px;
background-color:#DCE6F7;
}

#logout{
float:right;
padding:5px;
border:dashed 1px gray;
margin-top: -168px;
}

a{
text-decoration:none;
color: cornflowerblue;
}

i{
color: cornflowerblue;
}

.error_msg{
color:red;
font-size: 16px;
}

.message{
position: absolute;
font-weight: bold;
font-size: 28px;
color: #6495ED;
left: 262px;
width: 500px;
text-align: center;
}

Setelah selesai kita dapat melihat hasil yang telah kita buat dengan menuliskan alamat localhost/login pada browser. Ketika browser mendapatkan url di atas maka akan muncul halaman login. Halaman ini berisi bagian login dan link pendaftaran.

Seluruh proses meliputi

Proses Registrasi.
Proses Login.

Proses Registrasi atau Sign Up

Ketika Anda mengklik link signup, link tersebut akan mengarahkan Anda ke SignUp.php dan menampilkan formulir pendaftaran.

Setelah mengisi semua masukan input ketika Anda mengklik tombol kirim, semua data berpindah ke fungsi new_user_registration () pada Controller. Fungsi ini memeriksa validasi pertama untuk setiap masukan.

Jika data Anda kosong atau tidak valid maka akan menghasilkan pesan kesalahan tetapi, jika semua field input mendapatkan data yang benar maka itu akan menghubungkan Anda ke database.

Sebelum memasukkan data ke database, terlebih dahulu dilakukan pengecekan username di database. Jika username yang diberikan sudah tersedia di database, akan menampilkan pesan error username already exist! Pesan akan ditampilkan tetapi jika nama pengguna tidak tersedia dalam database maka itu akan memasukkan semua informasi dalam database dan menampilkan pesan SignUp Successfullly!.

Proses Sign In

Setelah mendaftar, Anda dapat masuk dengan memberikan nama pengguna dan kata sandi yang valid. Jika nama pengguna atau kata sandi yang diberikan tidak valid maka pesan kesalahan akan ditampilkan.

Sekarang mari kita lihat seluruh prosedur Sign In. Saat Anda memasukkan nama pengguna dan kata sandi, nilai-nilai input tersebut dibawa ke fungsi user_login_process () di Controller di mana validasi untuk setiap masukan dicentang.

Jika semua input yang diberikan valid maka fungsi user_login_process () mencocokkan username dan password yang diberikan dengan data yang tersimpan di database.

Jika kecocokan tidak ditemukan maka Anda akan diarahkan ke halaman login dan pesan kesalahan akan ditampilkan. Namun jika ditemukan kecocokan pada database maka akan dibuat sebuah session dan data pengguna akan dimasukkan ke dalam data sesi.

Sekarang, data ini dikirimkan ke halaman admin di mana semua informasi beserta opsi logout akan ditampilkan. Ketika Anda akan mengklik logout maka fungsi logout () akan dipanggil dan di mana data sesi akan dihancurkan atau dihapus. Setelah ini, Anda akan diarahkan ke halaman login untuk login baru.

Kesimpulan

Terima kasih telah membaca postingan lengkapnya. Semoga Anda menikmati membaca posting blog ini dan mendapatkan konsepnya. Anda dapat membagikan pandangan Anda di tempat yang disediakan di bawah ini dan menghubungi kami.

CI CodeIgniter login register