Pernah dengar akun orang tiba-tiba kena hack cuma gara-gara ngeklik sebuah link? Atau lagi asyik buka web, eh malah dibombardir pop-up aneh? Selamat, Anda mungkin baru saja berpapasan dengan "hantu" di dunia web development: Cross-Site Scripting (XSS).

Sebagai developer, kadang kita terlalu sibuk bikin web yang aesthetic dan fungsional sampai lupa satu mantra suci keamanan: "Never trust user input!".

Kali ini, saya tidak cuma mau bahas teori yang membosankan. Kita akan langsung "nge-hack" aplikasi buatan sendiri untuk melihat seberapa mengerikan efek dari celah keamanan ini, dan pastinya, bagaimana cara menambalnya hanya dengan satu baris kode.

Analogi XSS: Mantra Hipnotis di Buku Tamu

Bayangkan Anda punya buku tamu di rumah. Harusnya sih, orang menulis nama dan pesan manis. Tapi, gimana kalau ada tamu iseng yang malah menulis teks hipnotis? Tamu-tamu berikutnya yang membaca buku itu bakal langsung terhipnotis tanpa sadar.

Nah, di dunia web, XSS bekerja persis seperti itu. Si peretas menyuntikkan script jahat (biasanya berupa JavaScript) ke dalam halaman web kita. Waktu user lain membuka web tersebut, browser mereka tanpa curiga langsung mengeksekusi script itu. Akibatnya? Cookie (yang berisi data login) bisa dicuri, akun dibajak, atau user dilempar ke situs penipuan (phishing). Ngeri, kan?

Sesi Eksperimen: Membuat Web yang "Sakit"

Biar lebih kebayang, saya bikin sebuah eksperimen kecil. Saya membuat aplikasi "Buku Tamu" pakai PHP yang sengaja saya coding secara ugal-ugalan agar rentan terhadap XSS.

Agar praktis, saya cukup menggunakan Session PHP untuk menyimpan komentarnya. Ini wujud kodenya:

<?php
session_start();
if (!isset($_SESSION['komentar'])) {
    $_SESSION['komentar'] = [];
}

// Bahaya: Menerima input form tanpa sanitasi sama sekali!
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['teks_komentar'])) {
    $_SESSION['komentar'][] = $_POST['teks_komentar'];
}
?>

<!-- ... Bagian form HTML dihilangkan agar ringkas ... -->

<h3>Daftar Pesan:</h3>
<ul>
    <?php
    foreach ($_SESSION['komentar'] as $komen) {
        // BOM WAKTU: Input langsung dimuntahkan ke layar
        echo "<li>" . $komen . "</li>";
    }
    ?>
</ul>

Perhatikan baris echo "<li>" . $komen . "</li>";. Kelihatannya sepele ya? Padahal di sinilah letak bom waktunya. Aplikasi menelan mentah-mentah apa pun yang diinput user dan memuntahkannya kembali ke layar browser.

Mengeksekusi Serangan

Oke, sekarang saya ganti topi menjadi hacker. Kalau pengguna normal nulis "Halo, webnya keren!", saya sengaja memasukkan payload (skrip mematikan) ini ke dalam kolom komentar:

<script>alert('Sistem Anda Rentan XSS!');</script>

Begitu saya klik "Kirim"…

None
Kondisi Website setelah diinput script

BOM! Sebuah pop-up alert muncul dengan congkaknya di layar saya.

Analisis: Kok bisa terjadi? Karena saya menginput tag <script>, browser mengira itu adalah instruksi program yang harus dijalankan, bukan sekadar teks biasa. Coba bayangkan kalau alert itu saya ganti dengan kode JavaScript diam-diam yang mencuri password Anda. Kelar hidup kita.

Mitigasi: Penawar Racun XSS

Senangnya sudah cukup, sekarang waktunya beres-beres. Gimana cara menambal celah ini? Kuncinya ada di Sanitasi Output. Kita harus "mendidik" browser biar pintar ngebedain mana teks biasa dan mana kode program.

Di PHP, kita punya pahlawan bernama htmlspecialchars(). Fungsi ajaib ini bakal mengubah karakter spesial HTML jadi entitas yang aman. Simbol < diubah jadi <, dan > jadi >.

Saya merombak kode yang bermasalah tadi menjadi seperti ini:

<h3>Daftar Pesan:</h3>
<ul>
    <?php
    foreach ($_SESSION['komentar'] as $komen) {
        // PENAWAR: Mengubah karakter khusus menjadi entitas HTML
        $komentar_aman = htmlspecialchars($komen, ENT_QUOTES, 'UTF-8');
        
        echo "<li>" . $komentar_aman . "</li>";
    }
    ?>
</ul>

Menguji Hasil Tambalan

Waktunya pembuktian. Saya me-reset data session, lalu kembali memasukkan payload yang sama persis: <script>alert('Sistem Anda Rentan XSS!');</script>.

Hasilnya?

None
Skrip terlihat sebagai teks biasa di halaman, pop-up tidak muncul

Magic! Pop-up menyebalkan tadi tidak muncul lagi. Skrip jahatnya sekarang cuma dirender sebagai teks biasa yang harmless (tidak berbahaya). Halaman web saya kembali aman dan damai.

Kesimpulan

Eksperimen singkat ini memberikan satu tamparan keras buat kita para pengembang web: bencana besar sering kali berawal dari keteledoran kecil. Lupa memberikan filter waktu mengeksekusi perintah echo bisa menjadi karpet merah bagi peretas untuk mengobrak-abrik privasi pengguna.

Baik Anda menggunakan PHP native, framework tebal seperti Laravel, atau pustaka modern seperti React (yang sebenarnya sudah kebal XSS secara default), memvalidasi dan membersihkan input pengguna adalah harga mati yang tidak bisa ditawar.

Jangan sampai fitur "Buku Tamu" Anda jadi senjata makan tuan.

Always filter your inputs, and sanitize your outputs!

Referensi:

  1. OWASP Foundation. (n.d.). Cross Site Scripting (XSS). Diakses dari OWASP: https://owasp.org/www-community/attacks/xss/
  2. PHP Manual. (n.d.). htmlspecialchars. Diakses dari PHP.net: https://www.php.net/manual/en/function.htmlspecialchars.php