Apakah itu Cross-Site Scripting (XSS) dan bagaimana anda mencegahnya?

Question

Accepted Answer

**Cross-Site Scripting (XSS)** ialah kerentanan di mana penyerang menyuntik **JavaScript** berniat jahat ke dalam halaman web yang dilihat oleh pengguna lain — yang berjalan dalam pelayar mereka untuk mencuri data, merampas sesi, atau melakukan tindakan sebagai mereka. Ia adalah kerentanan web yang biasa dan berbahaya, boleh dicegah dengan pengendalian output yang betul. ## Bagaimana XSS berfungsi ```text When user input is rendered into a page WITHOUT proper escaping, injected SCRIPTS run: ``` ```html

Welcome, <%= userInput %>

``` Skrip yang disuntik berjalan dalam pelayar mangsa **seolah-olah daripada laman yang dipercayai** — membenarkan penyerang mencuri kuki/token sesi, merampas akaun, menangkap ketukan kekunci, atau melakukan tindakan sebagai pengguna. ## Jenis-jenis XSS ```text STORED → malicious script SAVED on the server (e.g. in a comment) → served to all viewers REFLECTED → script in a request (e.g. a URL parameter) reflected back in the response DOM-based → client-side JS unsafely puts untrusted data into the DOM ``` ## Pencegahan ```text ✓ ESCAPE/ENCODE output → render user data as TEXT, not HTML (the key defense): → frameworks (React, Angular, Vue) auto-escape by default → use them properly → escape based on context (HTML, attribute, JS, URL) ✓ AVOID dangerous APIs → innerHTML, dangerouslySetInnerHTML, eval with untrusted data ✓ SANITIZE HTML if you must allow it (e.g. DOMPurify for rich text) ✓ Content Security Policy (CSP) → restricts what scripts can run (defense in depth) ✓ HttpOnly cookies → JS can't read them (limits cookie theft via XSS) ``` ## Mengapa ia penting Memahami XSS dan cara mencegahnya adalah penting kerana ia merupakan **kerentanan web yang biasa dan berbahaya** yang membenarkan penyerang menjalankan skrip berniat jahat dalam pelayar pengguna, jadi ia adalah pengetahuan keselamatan yang mesti diketahui bagi pembangun web. Memahami **cara ia berfungsi** — bahawa menyampaikan input pengguna ke dalam halaman tanpa escaping yang betul membenarkan **JavaScript yang disuntik berjalan dalam pelayar pengguna lain dalam konteks laman yang dipercayai**, membolehkan penyerang mencuri kuki dan token sesi, merampas akaun, dan bertindak sebagai pengguna — adalah perlu untuk mengenali dan mencegah kerentanan ini. XSS berbahaya kerana ia menjejaskan sesi dan data pengguna, dan ia adalah biasa dalam aplikasi web yang memaparkan kandungan yang dijana pengguna. Memahami **jenis-jenisnya** (stored XSS — skrip berniat jahat yang disimpan pada pelayan dan disampaikan kepada semua penonton, yang paling berbahaya; reflected XSS — skrip yang dipantulkan daripada permintaan; DOM-based XSS — manipulasi DOM tidak selamat di sebelah klien) membantu mengenali pelbagai vektor serangan. Memahami **pencegahan** adalah penting: **escaping/encoding output** (menyampaikan data pengguna sebagai teks, bukan HTML — pertahanan utama, yang dilakukan secara automatik oleh rangka kerja moden seperti React secara lalai apabila digunakan dengan betul), **mengelakkan API berbahaya** (innerHTML, dangerouslySetInnerHTML, eval dengan data tidak dipercayai — sumber XSS yang biasa), **menyaring HTML** apabila kandungan kaya mesti dibenarkan (cth. DOMPurify), **Content Security Policy** (menyekat pelaksanaan skrip sebagai pertahanan berlapis), dan **kuki HttpOnly** (menghalang JS daripada membacanya). Memahami bahawa rangka kerja melakukan escaping automatik (jadi menggunakannya dengan betul mencegah kebanyakan XSS, manakala memintas escapingnya memperkenalkan semula XSS) adalah penting secara praktikal. Memandangkan XSS ialah kerentanan biasa dan berbahaya yang menjejaskan sesi dan data pengguna, terutamanya dalam aplikasi yang memaparkan kandungan pengguna, dan memandangkan memahami cara ia berfungsi dan cara mencegahnya (escaping output, mengelakkan API berbahaya, CSP, lalai rangka kerja) adalah penting bagi pembangun web, memahami XSS dan pencegahannya ialah pengetahuan keselamatan yang penting dan mesti diketahui — kerentanan web asas untuk dipertahankan, di mana pengendalian output yang betul (escaping, menggunakan lalai rangka kerja, mengelakkan API berbahaya) ialah pengetahuan kritikal untuk melindungi pengguna daripada kelas serangan yang meluas.