Thursday 5 January 2017

CodeIgniter : XSS Clean dan Penerapannya

XSS merupakan kependekan dari cross site scripting.  XSS memiliki arti suatu jenis serangan yang memanfaatkan injeksi code (code injection attack). XSS ini dimanfaatkan oleh penyerang (attacker) dengan memasukkan kode HTML  atau script ke suatu situs. Akibat serangan ini si penyerang dapat mem-bypass keamanan dari sisi klien, mencuri data yang sensitif atau merusak sistem yang diserang.

XSS memiliki 2 tipe antara lain

  • Reflected atau nonpersistent merupakan tipe XSS yang paling umum dan yang paling mudah dilakukan oleh penyerang. Penyerang menggunakan social engineering agar tautan dengan kode berbahaya ini diklik oleh pengguna. Dengan cara ini penyerang bisa mendapatkan cookie pengguna yang bisa digunakan selanjutnya untuk membajak session pengguna. Mekanisme pertahanan menghadapi serangan ini adalah dengan melakukan validasi input sebelum menampilkan data apapun yang di-generate oleh pengguna. Jangan percayai apapun data yang dikirim oleh pengguna.
  • Stored atau persistent lebih jarang ditemui dan dampak serangannya lebih besar. Sebuah serangan stored XSS dapat berakibat pada seluruh pengguna. Stored XSS terjadi saat pengguna diizinkan untuk memasukkan data yang akan ditampilkan kembali. Contohnya adalah pada message board, buku tamu, dll. Penyerang memasukkan kode HTML atau client script code lainnya pada posting mereka.
Sumber Informsi : XSS Wikipedia

Ok, mungkin itu pengertian dari XSS yang perlu kita ketahui sebelum menerapkannya pada aplikasi yang kita buat. Pada kesempatan kali ini saya akan share penerapannya pada framework CodeIgniter. Untuk lebih jelas baca disini dokumentasi security codeigniter.

1. Sekarang kita coba terapkan, silahkan sobat siapkan file codeigniter dan buat controller dengan nama Form.php dan buat kodenya seperti di bawah ini:
<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Form extends CI_Controller {

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

public function index()
{
$this->load->view('View');
}

public function form_submit(){
//data yang akan di kirim ke view tanpa xss
$data['tanpa_xss'] = array(
'username' =>$this->input->post('username'),
'email' =>$this->input->post('email')
);
//data yang dikirim dengan xss
$data['xss_data'] = $this->security->xss_clean($data['tanpa_xss']);

$this->load->view('View_result', $data);
}

}

/* End of file Form.php */
/* Location: ./application/controllers/Form.php */

Sebelum menggunakan security dari CodeIgniter ingat tambahkan library security di autoload['helper'].
Konfigurasi security di autoload CodeIgniter
Setting security CodeIgniter
2. Sekarang kita buat form dengan nama View.php codenya seperti di bawah ini:
<!DOCTYPE html>
<html>
<head>
<title>XSS Test</title>
<!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/css/materialize.min.css">
  <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <!-- Compiled and minified JavaScript -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/js/materialize.min.js"></script>

</head>
<body>
<div class="container">
<div class="card">
<div class="card-panel">
<center style="margin-top: 50px">
<h5 class="blue-text">XSS CodeIgniter</h5>
</center>
<?php echo form_open('Form/form_submit'); ?>
<div class="row">
   <div class="input-field col s6 m6 offset-m3 offset-s3">
   <input id="first_name2" type="text" class="validate" name="username">
   <label for="first_name2">Username</label>
   </div>
  </div>
  <div class="row">
   <div class="input-field col s6 m6 offset-m3 offset-s3">
   <input id="first_name2" type="email" class="validate" name="email">
   <label for="first_name2">Email</label>
   </div>
  </div>
  <div class="col s3 m12 center">
  <button type="submit" class="btn ">Submit</button>
  </div>
<?php echo form_close(); ?>
</div>
</div>
</div>
</body>
</html>

3. Setelah selesai buat form kita buat view lagi satu untuk menampilkan result dengan nama View_result.php codenya seperti dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title>View Result</title>
<!-- Compiled and minified CSS -->
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/css/materialize.min.css">
</head>
<body>
<div class="container">
<div class="card">
<div class="card-panel">
<center>
<h5 class="red-text">Tanpa XSS</h5>
Username : <?php echo $tanpa_xss['username'];?></br>
Email : <?php echo $tanpa_xss['email'];?>
</center>
</div>
</div>
<div class="card">
<div class="card-panel">
<center>
<h5 class="red-text">Dengan XSS</h5>
Username : <?php echo $xss_data['username'];?></br>
Email : <?php echo $xss_data['email'];?>
</center>
</div>
</div>
</div>
</body>
</html>

4. Sekarang kita uji coba formnya isi fieldnya dengan script.
Form uji coba XSS Clean
form test xss
 5. Result dari form yang telah di submit.
Result uji coba xss CodeIgniter
Result form dengan dan tanpa XSS
Bisa sobat lihat, tag script langsung dirumah menjadi removed. Itu menandakan XSS Clean CodeIgniter sudah jalan.

Selain dengan cara di atas, CodeIgniter sudah memiliki fitur auto untuk filtering XSS dengan cara menambahkan TRUE pada input postnya.
$this->input->post('username', TRUE);

Sekian mungkin yang bisa saya sharing, semoga bisa membantu untuk keperluan keamanan menggunakan framework CodeIgniter. Jika ada yang belum dimengerti silahkan tuliskan masalah di komentar atau langsung hubungi saya di social media. 

Baca artikel lainnya tentang CodeIgniter:



  1. CodeIgniter : Insert data dengan Ajax
  2. CodeIgniter : Menampilkan data dari database dan tutorialnya
  3. CodeIgniter : Tutorial Edit dan Hapus