Tutorial Form PHP Part 6: Validasi Form untuk Mencegah Cross-site Scripting dan HTML injection

Posted on

Di pada panduan Form PHP sebelumnya, kita telah membahas cara melalakukan pengecekan variabel form apakah telah terdapat bagi diproses (dengan kegunaan isset()), apakah variabel tersebut kosong (dengan kegunaan empty()), atau apakah variabel form tersebut mempunyai tipe data tertentu.

Masih berkaitan dengan proses validasi form, kali ini kita akan membahas mengenai cara mencegah user bagi memasukkan kode ’khusus’ seperti JavaScript atau kode HTML kedalam form. Pada panduan kali ini kita akan mempelajari Cara Validasi Form untuk Mencegah Cross-site Scripting dan HTML injection.


Pengertian Cross-site Scripting dan HTML injection

Cross-site Scripting atau sering disingkat dengan XSS yakni jenis serangan ke sebuah situs dengan cara ’menyisipkan’ kode script (biasanya JavaScript) ke pada sebuah situs. Hal ini hanya akan berhasil kalau situs tersebut mempunyai fitur bagi menampilkan kembali isian form ke web browser, seperti form komentar. Sedangkan HTML injection yakni istilah yang lebih spesifik kepada cara ’menyisipkan’ kode HTML kedalam sebuah situs.

Selaku programmer web, penanganan bagi Cross-site Scripting maupun HTML injection adalah hal yang betul-betul urgen, terutama pada perancangan kode form dengan PHP. Karena form di dasarnya dapat diinput oleh siapa saja, karenanya kita perlu memproteksi situs dari kode-kode berbahaya yang dapat diinput oleh user via form.


Contoh Cross-site Scripting dan HTML injection

Agar lebih memahami maksud dari Cross-site Scripting dan HTML injection, kita akan coba menginputnya via contoh halaman form.html dan proses.php dari panduan sebelumnya.

Silahkan buka halaman form kita (form.html), lalu input kode dibawah ini kedalam pada diantara kotak inputan form:

Dan sahabat akan mendapati tampilan berikut:

 Tampilan tersebut yakni hasil dari kode JavaScript yang baru saja kita input via form. Kode tersebut dapat berjalan karena di halaman proses.php kita seketika menampilkan data yang diinput oleh user tanpa mengerjakan proses filter.

Hal ini betul-betul berbahaya karena dengan kode JavaScript seseorang dapat mengerjakan ’hampir segalanya’ dengan situs kita. Tak hanya sekedar menampilkan ucapan selamat seperti kode diatas, tetapi seseorang pun dapat merubah background, mengubah tampilan seluruh web, bahkan mengarahkan pengunjung ke situs lain (redirect).

Hasil diatas saya peroleh menggunakan web browser mozilla firefox. Ketika saya menggunakan google chrome, tampilan javascript tersebut tak muncul karena google chrome mempunyai mekanisme ‘pencegahan‘ kode javascript internal ketika diinput via form.

Selaku contoh lainnya, seseorang dapat menginput kode berikut ke pada kotak input nama:

 Walaupun kode diatas tak mengandung script, namun kode HTML tersebut akan membangun tampilan hasil form menjadi berantakan (bayangkan kalau kita mempunyai halaman yang berisi tabel berisi nama-nama seluruh user, dan kode diatas akan menghancurkan desain web yang telah dirancang).


Cara Mencegah Cross-site Scripting dan HTML injection

Diantara cara sederhana bagi menghindari Cross-site Scripting dan HTML injection yakni dengan membangun karakter-karakter yang mempunyai ’makna’ di pada HTML dan JavaScript bagi diubah menjadi named entity, yaitu menkonversi karakter khusus seperti < menjadi lt;, dan karakter > menjadi gt;. Atau cara lainnya yakni dengan menghilangkan sama sekali seluruh tag HTML atau script dari inputan user.

Penjelasan lebih lanjut mengenai named entity (dan pun numeric entity) karakter HTML pernah kita bahas di panduan Cara Memasukkan Karakter Khusus ke dalam HTML.

Bagi kedua kebutuhan ini, PHP mempunyai kegunaan htmlspecialchars() dan kegunaan strip_tags().

Guna htmlspecialchars() akan mengkonversi 4 karakter ’khusus’ HTML menjadi named entity sehingga tak akan di ’proses’ oleh web browser. Keempat karakter tersebut yakni: <, >, dan  “. Keempat karakter khusus inilah yang membangun web browser akan menerjemahkan sebuah string menjadi kode HTML/JavaScript.

Sedangkan kegunaan strip_tags() akan menghapus seluruh tag HTML dari inputan user.

Selaku contoh, kita akan mengupdate halaman proses.php agar dapat mencegah seseorang menyisipkan Cross-site Scripting dan HTML injection. Berikut yakni command PHP di file proses.php:

Di pada kode diatas, saya hanya menambahkan kegunaan htmlspecialchars() bagi variabel $nama, dan kegunaan strip_tags () bagi variabel $email.

Bagi mengujinya, silahkan sahabat coba memasukkan kode JavaScript kita sebelumnya ke pada kotak input nama, yakni:

dan nilai berikut ke pada kotak input email:

 Kemudian perhatikan hasil tampilan dari proses.php. Seperti yang dirancang, kali ini hasil inputan tersebut akan difilter agar lebih aman.

Apabila sahabat melihat kode yang didapatkan, karenanya akan terlihat bahwa kegunaan htmlspecialchars() akan mengubah

menjadi

Perhatikan bahwa karakter khusus seperti < dan > telah diubah menjadi named entity.

Sedangkan bagi kotak inputan email, seluruh tag <br> telah di filter dan dihapus secara otomatis.


Validasi dengan htmlspecialchars atau strip_tags?

Alternatif apakan menggunakan kegunaan htmlspecialchars() atau strip_tags() tergantung kepada alur logika form yang kita bikin. Bagi isian form seperti user_name, email, dan domisili akan lebih aman kalau kita tak membolehkan tag HTML sama sekali (menggunakan kegunaan strip_tags()), namun bagi kotak form komentar, mungkin kita akan membolehkan beberapa tag bagi diproses seperti tag <b>, tag <i>, atau mungkin pun tag <a>.

Guna strip_tags() mempunyai argumen kedua yang dapat diisi dengan tag-tag HTML apa saja yang ’dibolehkan’. Apabila kita membolehkan tag <a>, <b> dan tag <i> bagi variabel $komentar, karenanya penulisannya dapat dikerjakan menjadi:

Sedangkan bagi kegunaan htmlspecialchars(), kalau sahabat ingin karakter tanda kutip ( ) pun diubah menjadi named entity, kita dapat menam
bahkan 1 argumen optional bagi kegunaan htmlspecialchars(), dengan alternatif ENT_QUOTES. Sehingga pada contoh variabel $nama, kita dapat menulisnya menjadi:

Dengan demikian, kalau diinput:

Akan diproses menjadi:

Perhatikan bahwa karakter kutip ( ‘ ) diganti menjadi kode #039.


Mengenal Guna htmlentities()

Selain kegunaan htmlspecialchars() dan kegunaan strip_tags(), pada pembahasan mengenai validasi dan karakter entity HTML, PHP masih mempunyai 1 lagi kegunaan yang sering diaplikasikan, yakni kegunaan htmlentities().

Guna htmlentities() akan mengkonversi seluruh karakter khusus di pada sebuah string menjadi entity, tak hanya karakter <, >, dan ” seperti di kegunaan htmlspecialchars(). Guna htmlentities() akan memproses karakter khusus lain seperti: ™, ©, ®, atau Σ menjadi named entity.

Selaku contoh, berikut yakni hasil konversi kegunaan htmlentities():

Dan berikut yakni hasilnya:

 Seperti yang terlihat bahwa kegunaan htmlentities() akan mengubah seluruh karakter khusus menjadi named entity HTML.


Pada panduan kali ini, kita telah membahas pemakaian kegunaan htmlspecialchars(), kegunaan strip_tags() dan kegunaan htmlentities() bagi membuat form kita lebih aman. Pada panduan berikutnya, kita akan membahas trik pada menampilkan pesan kesalahan di halaman form.html, bukan di halaman proses.php seperti yang kita tampilkan di panduan ini dan panduan form PHP sebelumnya.


Sumber https://www.duniailkom.com/