⚡ Lab 05 Menengah

Cross-Site Scripting (XSS) Lab

Pelajari bagaimana hacker menyisipkan script jahat ke website dan cara mencegahnya!

⚠️
Database belum disiapkan! Jalankan setup.php terlebih dahulu.

📖 Apa itu XSS (Cross-Site Scripting)?

Cross-Site Scripting (XSS) adalah serangan di mana hacker menyisipkan kode JavaScript berbahaya ke dalam halaman website. Kode tersebut kemudian dijalankan di browser pengunjung lain yang membuka halaman tersebut.

Bayangkan ada buku tamu di website. Kamu menulis komentar: "Halo!". Tapi hacker menulis kode JavaScript di kolom komentar. Ketika orang lain melihat halaman itu, kode jahat tersebut berjalan di browser mereka!

⚠️
Dampak XSS: Mencuri cookie/session, mengubah tampilan website, redirect ke situs phishing, keylogging, dan mencuri data pengguna.

3 Jenis XSS:

1. Stored XSS

Script disimpan di database (misalnya di komentar). Setiap orang yang membuka halaman akan terkena.

2. Reflected XSS

Script dikirim via URL/form dan langsung ditampilkan kembali tanpa disimpan.

3. DOM-based XSS

Script mengubah DOM secara langsung di browser tanpa melibatkan server.

💀
VERSI RENTAN! Buku tamu ini SENGAJA tidak memfilter input. Coba sisipkan tag HTML atau JavaScript!

💀 Pencarian — Reflected XSS

Coba ketik: <script>alert('XSS!')</script> atau <img src=x onerror=alert('Hacked!')>

💀 Buku Tamu — Stored XSS

Tulis komentar! Coba sisipkan: <b>Teks Tebal</b> atau <h1 style="color:red">HACKED!</h1> atau bahkan <img src=x onerror=alert('XSS!')>

📋 Payload XSS untuk Dicoba:

// 1. Alert popup
<script>alert('XSS!')</script>

// 2. Mengubah tampilan halaman
<h1 style="color:red;font-size:50px">HACKED!</h1>

// 3. Image error handler
<img src=x onerror=alert('XSS!')>

// 4. Redirect (hati-hati!)
<script>document.title='Hacked by CyberSec Lab!'</script>

// 5. Cookie theft simulation
<script>alert('Cookie: '+document.cookie)</script>

// 6. Deface (visual)
<marquee><h2>Website ini telah di-hack!</h2></marquee>
🛡️
VERSI AMAN! Semua input di-escape menggunakan htmlspecialchars(). Coba sisipkan payload XSS yang sama — script tidak akan dieksekusi!

🛡️ Pencarian — AMAN dari Reflected XSS

Coba ketik payload XSS yang sama — kali ini akan ditampilkan sebagai teks biasa!

🛡️ Buku Tamu — AMAN dari Stored XSS

Coba sisipkan script! Input akan di-escape sehingga ditampilkan sebagai teks biasa.

📊 Perbandingan Kode: Rentan vs Aman

💀 Kode RENTAN

PHP - JANGAN DITIRU!
// ❌ Output TANPA escaping!
// Reflected XSS:
echo $_GET['q'];

// Stored XSS:
echo $row['message'];

// Input:
<script>alert('XSS!')</script>
// → Browser MENJALANKAN script!

🛡️ Kode AMAN

PHP - BEST PRACTICE
// ✅ Output DENGAN escaping!
// Reflected XSS:
echo htmlspecialchars(
  $_GET['q'], ENT_QUOTES, 'UTF-8');

// Stored XSS:
echo htmlspecialchars(
  $row['message'], ENT_QUOTES, 'UTF-8');

// Input: <script>alert('XSS!')</script>
// → Ditampilkan sebagai TEKS biasa!

htmlspecialchars() mengubah:

KarakterMenjadiKeterangan
<&lt;Mencegah tag HTML
>&gt;Mencegah tag HTML
&&amp;Escape ampersand
"&quot;Mencegah keluar dari atribut
'&#039;Mencegah keluar dari atribut

🔑 Cara Mencegah XSS:

  • Output Encoding — Selalu gunakan htmlspecialchars() saat menampilkan data user
  • CSP Header — Content Security Policy untuk membatasi sumber script
  • Input Validation — Validasi dan filter input (whitelist approach)
  • HttpOnly Cookie — Cegah JavaScript akses cookie session
  • Framework Modern — React, Vue, Angular auto-escape output by default