Cara Mencegah JavaScript Injection di Website: Panduan Keamanan Production

JavaScript injection adalah salah satu serangan umum di website modern, termasuk XSS (Cross-Site Scripting). Jika tidak ditangani, serangan ini dapat mencuri data pengguna, merusak tampilan website, atau bahkan mengambil alih akun.

Artikel ini membahas penyebab, risiko, dan cara mencegah JavaScript injection secara praktis.

---

1. Apa Itu JavaScript Injection?

JavaScript injection terjadi ketika kode JavaScript berbahaya disisipkan ke dalam website oleh attacker, lalu dijalankan di browser user.

1.1 Jenis Umum

1. Stored XSS
   • Kode berbahaya tersimpan di server (database, komentar, form)
   • Dieksekusi setiap kali user membuka halaman
2. Reflected XSS
   • Kode berbahaya dikirim melalui URL atau form
   • Dieksekusi hanya saat user membuka URL khusus
3. DOM-based XSS
   • Manipulasi DOM client-side → kode berbahaya dieksekusi di browser

1.2 Dampak

• Pencurian cookie atau token session
• Mengubah tampilan website
• Redirect user ke website berbahaya
• Pengambilalihan akun atau hak akses

---

2. Validasi Input

Validasi input adalah lapisan pertama defense terhadap JavaScript injection.

2.1 Server-side Validation

• Selalu validasi input di server → tidak hanya di client

// PHP example
$name = filter_input(INPUT_POST, 'name', FILTER_SANITIZE_STRING);

// Node.js example
const name = req.body.name.replace(/[<>]/g, '');

• Batasi jenis input: string, angka, email, dsb
• Cek panjang maksimal input

2.2 Client-side Validation

• Gunakan untuk pengalaman user, bukan pengganti server-side
• HTML5 input type, regex pattern:

<input type="text" pattern="[A-Za-z0-9 ]{1,50}">

---

3. Output Encoding / Escaping

• Saat menampilkan data user, escape karakter khusus agar tidak dieksekusi

3.1 HTML Escape

echo htmlspecialchars($user_input, ENT_QUOTES, 'UTF-8');

• & → &
• < → <
• > → >
• " → "

3.2 JavaScript Escape

const safe = JSON.stringify(user_input);
document.getElementById('output').innerHTML = safe;

3.3 Attribute Escape

<input value="<?= htmlspecialchars($user_input, ENT_QUOTES, 'UTF-8'); ?>">

---

4. Content Security Policy (CSP)

CSP membatasi sumber script yang boleh dijalankan oleh browser → mencegah JavaScript injection.

add_header Content-Security-Policy "default-src 'self'; script-src 'self' https://cdn.example.com;";

• default-src 'self' → hanya izinkan konten dari domain sendiri
• script-src 'self' https://cdn.example.com → hanya script dari domain & CDN tertentu
• Menangkal inline script injection

---

5. Hindari Inline JavaScript

• Jangan gunakan onclick, onload atau javascript: di HTML
• Gunakan event listener di file JS terpisah:

document.getElementById('btn').addEventListener('click', function() {
    alert('Safe!');
});

---

6. Gunakan Framework Modern

• Framework modern (React, Angular, Vue) otomatis escape output
• React: {userInput} → aman secara default
• Hindari dangerouslySetInnerHTML kecuali benar-benar sanitasi

---

7. Sanitasi Library / Tool

• Gunakan library untuk sanitasi input & output:
  • DOMPurify → bersihkan HTML input
  • validator.js → validasi input Node.js
  • HTMLPurifier → PHP HTML sanitizer

const cleanHTML = DOMPurify.sanitize(userInput);

---

8. Perlindungan Cookie & Session

• Gunakan HttpOnly cookie → tidak bisa diakses oleh JavaScript

Set-Cookie: sessionId=abc123; HttpOnly; Secure; SameSite=Strict

• Gunakan SameSite=Strict/Lax → mencegah CSRF

---

9. Monitoring & Logging

• Pantau log untuk pola mencurigakan → URL dengan <script> atau parameter aneh
• Gunakan WAF (Web Application Firewall) → filter XSS, SQL Injection, dan serangan umum

---

10. Best Practices Mencegah JavaScript Injection

1. Server-side input validation
2. Output encoding / escaping
3. Content Security Policy (CSP)
4. Hindari inline JavaScript
5. Gunakan framework modern → otomatis escape output
6. Gunakan library sanitasi → DOMPurify, HTMLPurifier
7. Gunakan HttpOnly cookie & SameSite
8. Monitoring log & WAF untuk deteksi dini
9. Jangan eval atau innerHTML tanpa sanitasi

---

11. Kesimpulan

JavaScript injection adalah ancaman serius yang bisa merusak website dan mencuri data pengguna. Strategi preventif yang efektif meliputi:

• Validasi input → server-side wajib, client-side optional
• Output escaping → HTML, JS, Attribute
• CSP & security headers → batasi eksekusi script
• Sanitasi library → bersihkan HTML user-generated
• Hindari inline JS → gunakan event listener terpisah
• Cookie & session → HttpOnly & SameSite

Dengan menerapkan best practices ini, website production bisa aman dari JavaScript injection sambil tetap performa tinggi dan user-friendly.