PEMROGRAMAN FRAMEWORK TUGAS 4 - MEMBUAT REGISTRASI … · TUGAS 4 - MEMBUAT REGISTRASI DAN LOGIN DI...

PEMROGRAMAN FRAMEWORK

TUGAS 4 - MEMBUAT REGISTRASI DAN LOGIN DI

CODEIGNITER

PARALEL A

KELOMPOK 4

DIAH AYU SETIOWATI 1434010080

BIMO MUHAMMAD REVA 1434010098

RAHMADHONI HARYO JATI 1434010105

ANDI TRI RISTANTO 1434010124

UNIVERSITAS PEMBANGUNAN NASIONAL “VETERAN”

JAWA TIMUR

SURABAYA

2017

Membuat Login dengan Captcha di CodeIgniter

Tugas ke 4 ini kami membuat registrasi dan login dengan captcha dari studi kasus Restoran,

berikut Langkah-langkah membuatnya :

1. Start Apache dan MySQL pada xampp

2. Buka phpmyadmin, dan buat database “restoran”

3. Buat tabel “users” di database restoran

4. Lalu isi atribut tabel users, atribut nya yaitu

Id

Name

Email

Password

Gender

Phone

Created

Modified

Status

5. Kemudian setelah berhasil membuat tabel diatas, isikan data dummy seperti pada gambar

berikut ini:

6. Membuat model login dengan captcha

Model yang akan ditulis memiliki nama m_login. Diletakkan di application -> models -> tugas4.

Folder tugas4 dibuat terlebih dahulu di dalam folder models

<?php

class M_login extends CI_Model {

function __construct()

{

parent::__construct();

$this->load->database();

}

function login($username, $password)

{

$this -> db -> select('username,

password,nama,email,active');

$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

{

$this -> db -> select('username,

password,nama,email,active');

$this -> db -> from('login');

$this -> db -> where('email', $username);

$this -> db -> where('password', $password);

$this -> db -> limit(1);

$query1 = $this->db->get();

if($query1 -> num_rows() == 1)

{

$result = $query1->result();

return $result;

}

else

{

return false;

}

}

}

}

?>

<?php

7. Membuat controller yang bernama login untuk digunakan dalam membangun sistem

autentikasi sederhana. Controller tersebut memerlukan model m_login karena akan

mengakses tabel users, memerlukan helper url dan form, serta memerlukan library

form_validation.

<?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 {


{


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

$this->load->helper('url');

$this->load->helper(array('captcha','form'));

$this->load->helper(array('form','url'));

}

public function index()

{

//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');

$vals = array(

'img_path' => './capimg/',

'img_url' => '/ci/capimg/',

'img_width' => 150,

'img_height' => 30,

'word_length' => 4,

'font_size' => 16

);

$cap = create_captcha($vals);

$this->session-

>set_userdata('keycode',md5($cap['word']));

$data['captcha_img'] = $cap['image'];

//tampilan html login

$this->load->view('layout/header');

$this->load->view('tugas4/v_login',$data);

}else

{

//jika seasson ada direct ke home

redirect('tugas4/home','refresh');

}

}

public function logout(){



$this->session->unset_userdata('login');

redirect('tugas4/login','refresh');

}

public function submit(){

$captcha = $this->input->post('captcha');

if(md5($captcha)==$this->session-

>userdata('keycode')){

$data['captcha']= $captcha;

$this->session->unset_userdata('keycode');

//$this->load->view('v_success',$data);

}else{

redirect('captcha?cap_error=1','refresh');

}

}

/*public function submit(){

$this->load->helper(array('form','url'));


//$nama = $this->input->post('nama');

$captcha = $this->input->post('captcha');

if(md5($captcha)==$this->session-

>userdata('keycode')){

//$data['nama'] = $nama;

$data['captcha']= $captcha;

$this->session->unset_userdata('keycode');

$this->load->view('home');

}else{

redirect('captcha?cap_error=1','refresh');

}

}*/

}

Pada function index, Anda bisa melihat bahwa function tersebut mengarah ke view

form_login.

Berikut adalah isi dari view v_login, simpanlah source code dibawah ini dengan nama

v_login.php dan taruh di application -> views -> tugas4

<html>

<head>

<link rel="stylesheet"

href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-

beta/css/bootstrap.min.css" integrity="sha384-

/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6

M" crossorigin="anonymous">

<script

src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-

beta/js/bootstrap.min.js" integrity="sha384-

h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm

1" crossorigin="anonymous"></script>

<script src="https://code.jquery.com/jquery-

3.2.1.slim.min.js" integrity="sha384-

KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5Kk

N" crossorigin="anonymous"></script>

<script

src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/um

d/popper.min.js" integrity="sha384-

b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj


<style type="text/css">

::selection{ background-color: #E13300; color: white; }

::moz-selection{ background-color: #E13300; color: white; }

::webkit-selection{ background-color: #E13300; color:

white; }

body {

background-color: #fff;

margin: 40px;

font: 13px/20px normal Helvetica, Arial, sans-serif;

color: #4F5155;

}

a {

color: #003399;

background-color: transparent;

font-weight: normal;

}

h1 {

color: #444;


border-bottom: 1px solid #D0D0D0;

font-size: 19px;


margin: 0 0 14px 0;

padding: 14px 15px 10px 15px;

}

code {

font-family: Consolas, Monaco, Courier New, Courier,

monospace;

font-size: 12px;

background-color: #f9f9f9;

border: 1px solid #D0D0D0;

color: #002166;

display: block;

margin: 14px 0 14px 0;


}

#body{

margin: 0 15px 0 15px;

}

p.footer{

text-align: right;

font-size: 11px;

border-top: 1px solid #D0D0D0;

line-height: 32px;

padding: 0 10px 0 10px;

margin: 20px 0 0 0;

}

#container{

margin: 10px;


-webkit-box-shadow: 0 0 8px #D0D0D0;

}

</style>

<title>Login Form</title>

</head>

<body>

<?php echo form_open('tugas4/login_validation',

'tugas4/login/submit'); ?>

<div class="row">

`<div class="col-md-6 col-md-offset-3">

<div class="form-group">

<label class="control-label col-md-

2">Nama</label>

<div class="col-md-10">

<input type="text" name="name"

class="form-control">

</div>

</div>



2">Password</label>


<input type="text" name="email"


</div>

</div>



10">Captcha</label>

<br/>

<?php echo $captcha_img;?><br>

<input name="captcha" class="form-

control"><br>

<?php

$wrong = $this->input-

>get('cap_error');

if($wrong){

?>

<span style="color:red;">Captcha

yang kamu masukan salah, silahkan ulangi lagi</span>

<?php

}

?>

<br/>


<div class="col-md-10 col-md-offset-

2">

<input type="submit" class="btn

btn-primary" value="Submit">

</div>

</div>

<?php

if($this->input->get('gagal')==1){

?>

<span>username atau password salah</span>

<?php

}

?>

<?php echo form_close(); ?> 



2">

<a href="<?php echo

site_url('tugas4/register');?>"> Belum Punya Akun ?</a></br>

</div>

</div>


</div>

</div>

</body>

</html>

akses function index melalui url :

http://localhost/ci/index.php/tugas4/login

http://localhost/ci/index.php/tugas4/login

8. Menambahkan proses login di controllers account


allowed');

class Login_validation extends CI_Controller {


{


// 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('tugas4/login?gagal=1','refresh');

}else

{

redirect('tugas4/home','refresh');

}

}

function check_database()

{


//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('tugas4/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,

'active' => $row->active,

'email' => $row->email

);

$this->session->set_userdata('login',

$sess_array);

}

return TRUE;

}

else

{

return FALSE;

}

}

}

Ketika akun yang dimasukkan ada di dalam tabel users. Controller login_validation akan

mengarahkan Anda ke halaman sukses. Sebenarnya disini terjadi pengarahan ke Controller

login_validation itu sendiri yang targetnya adalah function yang menampilkan halaman sukses.

Sekarang akan mencoba login ke aplikasi

Setelah klik submit

Lihat tanda merah pada gambar di atas, ini dikarenakan user tersebut belum registrasi

sehingga ketika login akan keluar seperti itu.

Membuat Registrasi di CodeIgniter

Langkah-langkah membuatnya :

1. Buat terlebih dahulu controller yang bernama registrasi, kemudian taruh di application -

> controllers


allowed');

//nama class harus sama dengan nama file dan diawali dengan huruf

besar

class Register extends CI_Controller {


{

$this->load->helper('form');


$this->load->view('tugas4/v_register');

}

public function submit(){

//passing post data dari view

$this->load->helper(array('form', 'url'));

$username = $this->input->post('username');

$password = $this->input->post('password');

$nama = $this->input->post('nama');

$email = $this->input->post('email');

//memasukan ke array

$data = array(

'username' => $username,

'password' => $password,

'nama' => $nama,

'email' => $email,

'active' => 0

);

//tambahkan akun ke database

$this->load->model('tugas4/m_register');

$id = $this->m_register->add_account($data);

//enkripsi id

$encrypted_id = md5($id);

$this->load->library('email');

$config = array();

$config['charset'] = 'utf-8';

$config['useragent'] = 'Codeigniter';

$config['protocol']= "smtp";

$config['mailtype']= "html";

$config['smtp_host']=

"ssl://smtp.gmail.com";//pengaturan smtp

$config['smtp_port']= "465";

$config['smtp_timeout']= "400";

$config['smtp_user']= "[email protected]"; // isi

dengan email kamu

$config['smtp_pass']= "fasilkom14"; // isi dengan

password kamu

$config['crlf']="\r\n";

$config['newline']="\r\n";

$config['wordwrap'] = TRUE;

//memanggil library email dan set konfigurasi untuk

pengiriman email

$this->email->initialize($config);

//konfigurasi pengiriman

$this->email->from($config['smtp_user']);

$this->email->to($email);

$this->email->subject("Verifikasi Akun");

$this->email->message(

"terimakasih telah melakuan registrasi, untuk

memverifikasi silahkan klik tautan dibawah ini<br><br>".

site_url("tugas4/register/verification/$encrypted_id")

);

if($this->email->send())

{

echo "Berhasil melakukan registrasi, silahkan cek

email kamu";

}else

{

echo "Berhasil melakukan registrasi, namu gagal

mengirim verifikasi email";

}

echo "<br><br><a

href='".site_url("tugas4/login")."'>Kembali ke Menu Login</a>";

}

public function verification($key)

{


$this->load->model('tugas4/m_register');

$this->m_register->changeActiveState($key);

echo "Selamat kamu telah memverifikasi akun kamu";

echo "<br><br><a

href='".site_url("tugas4/login")."'>Kembali ke Menu Login</a>";

}

}

2. Buatlah model m_register, kemudian simpan di application > models > tugas4, buat

folder tugas4 terlebih dahulu. Berikut adalah source code nya

<?php

class M_register extends CI_Model {


{


}

function add_account($data)

{


$this->db->insert('login',$data);

return mysql_insert_id();

}

function changeActiveState($key)

{


$data = array(

'active' => 1

);

$this->db->where('md5(id)', $key);

$this->db->update('login', $data);

return true;

}

}

?>

3. Membuat source code dari view untuk menampilkan registrasi yang bernama v_register

<html>

<head>

}

code {

font-family: Consolas, Monaco, Courier New, Courier,

monospace;

font-size: 12px;

background-color: #f9f9f9;


color: #002166;

display: block;

margin: 14px 0 14px 0;


}

#body{

margin: 0 15px 0 15px;

}

p.footer{

text-align: right;

font-size: 11px;

border-top: 1px solid #D0D0D0;

line-height: 32px;

padding: 0 10px 0 10px;

margin: 20px 0 0 0;

}

#container{

margin: 10px;


-webkit-box-shadow: 0 0 8px #D0D0D0;

}

</style>

</head>

<body>

<?php echo form_open('tugas4/register/submit'); ?>

<table>

<tbody>

<tr>

<<div class="form-group">


2">Username</label>


<input type="text" name="username"


</div>

</div>

</tr>

<tr>



2">Password</label>


<input type="text" name="Pasword"


</div>

</div>

</tr>

<tr>



2">Nama</label>


<input type="text" name="nama"


</div>

</div>

</tr>

<tr>



2">Email</label>


<input type="text" name="email"


</div>

</div>

</tr>

<tr>

<td></td>

<div class="col-md-10 col-md-offset-2">

<input type="submit" class="btn

btn-primary" value="Submit">

</div>

</tr>

<br/>



2">

<a href="<?php echo

site_url('tugas4/login');?>"> Sudah Punya Akun ?</a></br>

</div>

</div>

</tbody>

<body>

</html>

Sebelumnya buat terlebih dahulu folder dengan nama tugas4 di application -> views.

Kemudian simpan file diatas dengan nama v_register.php di dalam folder tugas4

Akses controller paginationsample dengan url :

http://localhost/ci/index.php/tugas4/register

gambar registrasi

Gambar memasukkan data saat registrasi

http://localhost/ci/index.php/tugas4/register

Gambar ketika di submit

PEMROGRAMAN FRAMEWORK TUGAS 4 - MEMBUAT REGISTRASI … · TUGAS 4 - MEMBUAT REGISTRASI DAN LOGIN DI...

Documents

Transcript of PEMROGRAMAN FRAMEWORK TUGAS 4 - MEMBUAT REGISTRASI … · TUGAS 4 - MEMBUAT REGISTRASI DAN LOGIN DI...