Pengantar

Cross-Site Scripting (XSS) merupakan salah satu jenis kerentanan keamanan web yang paling sering ditemukan pada aplikasi modern. Serangan ini memungkinkan penyerang menyisipkan skrip berbahaya ke dalam halaman web sehingga dapat dijalankan di browser korban. Dampaknya pun beragam, mulai dari pencurian cookie, pembajakan sesi (session hijacking), hingga manipulasi tampilan aplikasi.

Di antara berbagai jenis XSS, DOM-Based XSS sering kali menjadi tantangan tersendiri bagi pengembang maupun tim keamanan. Berbeda dengan Stored XSS dan Reflected XSS, serangan ini tidak bergantung pada respons yang dikirimkan oleh server. Sebaliknya, eksploitasi terjadi sepenuhnya di sisi browser melalui manipulasi Document Object Model (DOM) menggunakan JavaScript.

Karena prosesnya berlangsung di sisi klien (client-side), DOM-Based XSS sering luput dari pengujian keamanan tradisional yang hanya berfokus pada komunikasi antara browser dan server. Oleh sebab itu, memahami cara kerja serta langkah mitigasinya menjadi hal yang penting dalam membangun aplikasi web yang aman.


Apa Itu DOM-Based XSS?

Pengertian DOM-Based XSS

DOM-Based Cross-Site Scripting (DOM-Based XSS) adalah jenis kerentanan XSS yang terjadi ketika JavaScript pada halaman web mengambil data dari sumber yang dapat dikendalikan pengguna (source) dan memasukkannya ke dalam elemen DOM (sink) tanpa proses validasi atau sanitasi yang memadai.

Berbeda dengan XSS lainnya, payload berbahaya pada DOM-Based XSS tidak pernah diproses oleh server. Browser pengguna langsung menjalankan skrip tersebut ketika JavaScript memanipulasi DOM menggunakan data yang tidak terpercaya.

Menurut OWASP, DOM-Based XSS terjadi sepenuhnya di sisi klien sehingga perubahan yang menyebabkan kerentanan hanya berlangsung di lingkungan browser, bukan pada respons HTML yang dikirim server (dikutip dari: https://owasp.org/www-community/attacks/DOM_Based_XSS).

baca juga : Code Obfuscation: Teknik Menyamarkan Kode Program untuk Mencegah Reverse Engineering


Bagaimana Cara Kerja DOM-Based XSS?

DOM-Based XSS umumnya melibatkan tiga komponen utama:

  • Source, yaitu sumber data yang dapat dimanipulasi pengguna, seperti URL, parameter query, atau location.hash.
  • JavaScript, yang mengambil data dari source.
  • Sink, yaitu fungsi atau properti DOM yang menampilkan data tanpa validasi.

Alur sederhananya adalah sebagai berikut:

  1. Pengguna mengakses URL yang berisi parameter tertentu.
  2. JavaScript membaca parameter tersebut.
  3. Nilai parameter dimasukkan ke dalam DOM.
  4. Browser mengeksekusi skrip yang telah disisipkan penyerang.

Karena seluruh proses berlangsung di browser, server tidak mengetahui bahwa serangan sedang terjadi.


Contoh Sederhana DOM-Based XSS

Misalkan sebuah aplikasi memiliki kode JavaScript berikut:

<div id="message"></div>

<script>
document.getElementById("message").innerHTML =
location.hash.substring(1);
</script>

Jika pengguna membuka URL berikut:

https://example.com/#<img src=x onerror=alert('XSS')>

Nilai setelah tanda # akan dimasukkan langsung ke dalam innerHTML. Browser kemudian menjalankan atribut onerror, sehingga kode JavaScript penyerang berhasil dieksekusi.

Contoh tersebut menunjukkan bahwa kerentanan muncul bukan karena server mengirimkan kode berbahaya, melainkan karena JavaScript memperlakukan input pengguna sebagai HTML yang dapat dijalankan.


Perbedaan DOM-Based XSS dengan Jenis XSS Lainnya

Sering kali pengembang menyamakan semua jenis XSS, padahal masing-masing memiliki mekanisme yang berbeda.

Jenis XSS Karakteristik
Stored XSS Payload disimpan di server, misalnya pada database.
Reflected XSS Payload dikirim melalui request dan langsung dipantulkan oleh server.
DOM-Based XSS Payload diproses sepenuhnya di browser tanpa melibatkan perubahan respons server.

Perbedaan utama DOM-Based XSS terletak pada lokasi terjadinya eksploitasi, yaitu di sisi klien (client-side), sehingga sering kali lebih sulit dideteksi menggunakan pemindaian keamanan konvensional.


Source dan Sink yang Sering Menyebabkan DOM-Based XSS

Source (Sumber Input)

Beberapa sumber input yang sering digunakan dalam eksploitasi antara lain:

  • location.href
  • location.hash
  • location.search
  • document.URL
  • document.referrer
  • window.name

Seluruh data tersebut dapat dimodifikasi oleh pengguna sehingga tidak boleh langsung dipercaya.


Sink (Tujuan Penulisan Data)

Kerentanan biasanya muncul ketika data dari source dimasukkan ke fungsi yang dapat menjalankan HTML atau JavaScript, seperti:

  • innerHTML
  • outerHTML
  • document.write()
  • insertAdjacentHTML()
  • eval()
  • setTimeout() dengan string
  • setInterval() dengan string

Penggunaan fungsi-fungsi tersebut tanpa validasi meningkatkan risiko terjadinya DOM-Based XSS.

baca juga : TCP Three-Way Handshake Deep Dive: Memahami Proses Koneksi TCP dari SYN hingga ACK


Dampak DOM-Based XSS

Jika berhasil dieksploitasi, DOM-Based XSS dapat menyebabkan berbagai dampak serius, di antaranya:

  • Pencurian cookie sesi pengguna.
  • Pengambilalihan akun (Account Takeover).
  • Pengalihan pengguna ke situs phishing.
  • Manipulasi tampilan halaman web.
  • Pencurian token autentikasi.
  • Eksekusi JavaScript berbahaya di browser korban.

Besarnya dampak bergantung pada hak akses yang dimiliki korban saat mengakses aplikasi.


Cara Mencegah DOM-Based XSS

Gunakan textContent atau innerText

Jika hanya ingin menampilkan teks, gunakan:

element.textContent = userInput;

Pendekatan ini lebih aman dibandingkan menggunakan innerHTML karena browser tidak akan menginterpretasikan input sebagai HTML.


Hindari Penggunaan innerHTML

Sebisa mungkin hindari memasukkan input pengguna langsung ke dalam innerHTML.

Jika memang harus menampilkan HTML dinamis, lakukan sanitasi menggunakan pustaka yang terpercaya.


Validasi dan Sanitasi Input

Seluruh data yang berasal dari pengguna harus dianggap tidak terpercaya.

Lakukan:

  • Validasi format input.
  • Sanitasi karakter berbahaya.
  • Escape karakter HTML sebelum ditampilkan.

Terapkan Content Security Policy (CSP)

Content Security Policy (CSP) membantu mengurangi dampak XSS dengan membatasi sumber skrip yang boleh dijalankan oleh browser.

Menurut Mozilla Developer Network (MDN), CSP merupakan mekanisme keamanan tambahan yang dapat membantu mendeteksi dan memitigasi berbagai jenis serangan, termasuk Cross-Site Scripting (XSS), melalui pembatasan sumber konten yang diizinkan (dikutip dari: https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP).


Hindari Fungsi JavaScript Berisiko

Sebaiknya hindari penggunaan fungsi seperti:

  • eval()
  • document.write()
  • setTimeout() dengan string
  • setInterval() dengan string

Gunakan alternatif yang lebih aman agar input pengguna tidak dieksekusi sebagai kode JavaScript.


Mengapa DOM-Based XSS Sulit Dideteksi?

Tidak seperti Reflected XSS atau Stored XSS, DOM-Based XSS tidak mengubah respons HTTP yang dikirim server.

Akibatnya:

  • Payload tidak terlihat pada respons HTML.
  • Banyak web vulnerability scanner gagal mendeteksinya.
  • Pengujian memerlukan analisis JavaScript di browser.
  • Kerentanan sering baru ditemukan saat manual penetration testing atau menggunakan alat seperti Burp Suite DOM Invader.

Inilah alasan mengapa pengujian keamanan aplikasi modern tidak cukup hanya berfokus pada sisi server, tetapi juga harus mencakup perilaku JavaScript di browser.


Best Practice Mengamankan Aplikasi dari DOM-Based XSS

Beberapa praktik terbaik yang dapat diterapkan oleh pengembang meliputi:

  • Jangan pernah mempercayai input pengguna.
  • Gunakan textContent untuk menampilkan teks.
  • Hindari penggunaan innerHTML jika tidak diperlukan.
  • Terapkan Content Security Policy (CSP).
  • Lakukan sanitasi HTML menggunakan pustaka yang terpercaya.
  • Gunakan framework modern yang memiliki proteksi bawaan terhadap XSS.
  • Lakukan pengujian keamanan secara berkala menggunakan alat otomatis maupun manual.

Pendekatan keamanan berlapis akan membantu meminimalkan risiko eksploitasi DOM-Based XSS pada aplikasi web.

baca juga : OAuth State Parameter: Benteng Kecil yang Mencegah Serangan Besar pada Login OAuth


Kesimpulan

DOM-Based XSS merupakan salah satu jenis Cross-Site Scripting yang terjadi sepenuhnya di sisi browser akibat manipulasi Document Object Model (DOM) menggunakan data yang tidak terpercaya. Karena tidak melibatkan perubahan pada respons server, kerentanan ini sering kali lebih sulit dideteksi dibandingkan Stored XSS maupun Reflected XSS.

Untuk mengurangi risiko eksploitasi, pengembang perlu menerapkan praktik keamanan seperti menghindari penggunaan innerHTML untuk input pengguna, memanfaatkan textContent, melakukan validasi dan sanitasi data, serta mengaktifkan Content Security Policy (CSP). Dengan memahami cara kerja DOM-Based XSS dan menerapkan langkah mitigasi yang tepat, keamanan aplikasi web dapat ditingkatkan secara signifikan.