Stories

Detail Return Return

前端必知的跨站腳本攻擊(XSS)示例與解決方案 - Stories Detail

跨站腳本攻擊(Cross-Site Scripting,通常縮寫為XSS)是一種常見的網絡安全漏洞,它允許攻擊者將惡意腳本注入到其他用户會瀏覽的頁面中。

XSS攻擊的示例代碼可以幫助我們瞭解攻擊者可能使用的技術。但請注意,瞭解這些示例的目的是為了更好地防禦XSS攻擊,而不是用於惡意目的。

XSS 攻擊通常分為三種類型

1. 反射型XSS:攻擊者誘使用户點擊一個鏈接,該鏈接包含惡意腳本,當用户點擊時,惡意腳本被髮送到服務器,然後立即反射回用户的瀏覽器執行。

2. 存儲型XSS:惡意腳本被存儲在目標服務器上(例如在數據庫中),當其他用户訪問存儲了惡意腳本的頁面時,腳本會被執行。

3. DOM-based XSS:當頁面的Document Object Model(DOM)被惡意腳本修改,並且這些修改導致瀏覽器執行了惡意操作時發生的XSS攻擊。

XSS 示例

1. 反射型XSS示例:

反射型XSS通常發生在應用程序接收輸入並將其作為響應的一部分返回給用户時,而沒有進行適當的處理。

假設有一個搜索功能的URL如下:

http://example.com/search?query=<script>alert('XSS')</script>

如果網站沒有對輸入進行適當的過濾和轉義,那麼當用户點擊這個鏈接時,<script> 標籤內的JavaScript代碼就會在用户的瀏覽器中執行。

易受攻擊的服務器端代碼示例(偽代碼):

$query = $_GET['search'];
$result = doSearchQuery($query); // 執行搜索
echo "Search results for: " . $query;

2. 存儲型XSS示例:

如果一個網站允許用户在留言板上發佈消息,並且沒有對用户輸入進行過濾,攻擊者可以發佈如下消息:

<script>alert('XSS')</script>

這條消息被存儲在數據庫中,之後每當有其他用户訪問留言板頁面時,這條消息中的JavaScript代碼就會被執行。

易受攻擊的服務器端存儲和顯示代碼示例(偽代碼):

$comment = $_POST['comment'];
saveCommentToDatabase($comment); // 存儲評論到數據庫

// 其他用户查看評論
$comment = getCommentFromDatabase(); // 從數據庫獲取評論
echo "Comment: " . $comment;

3. DOM-based XSS示例:

如果一個網頁有一個JavaScript函數,它使用document.location來獲取當前頁面的URL,並且沒有對URL進行適當的處理,那麼攻擊者可以通過修改頁面的URL來執行惡意腳本:

<a href="javascript:alert('XSS')">Click me</a>

如果原始頁面的JavaScript代碼是這樣的:

var currentUrl = document.location;

攻擊者可以通過修改頁面URL來注入JavaScript代碼。

易受攻擊的JavaScript代碼示例:

var userContent = document.getElementById('userInput').value;
document.getElementById('content').innerHTML = userContent;

攻擊者可以通過以下方式利用這個漏洞:

<span id="userInput"><script>alert('XSS')</script></span>

瞭解了攻擊,那需要如何防禦 XSS 攻擊呢,作為有經驗的程序員是必須要懂滴。

XSS 解決方案

  1. 輸入過濾:對所有用户輸入進行過濾,不允許<script><iframe>等潛在危險的HTML標籤被輸入。
  2. 輸出編碼:在將用户輸入的數據輸出到頁面時,進行HTML編碼,將<、>等字符轉換成HTML實體。
  3. 使用HTTP-only Cookies:設置HTTP-only標誌,使得Cookie不能通過客户端腳本訪問。
  4. 內容安全策略(CSP):通過CSP可以限制網頁可以加載哪些資源,減少XSS攻擊的機會。
  5. 使用安全的框架和庫:現代Web框架和庫通常提供了自動的XSS防護。
  6. 避免直接內聯JavaScript:儘量避免在HTML中直接內聯JavaScript代碼,使用外部JavaScript文件可以更容易地管理權限和內容。
  7. 使用自動化工具:使用自動化工具來檢測和修復XSS漏洞。
  8. 錯誤處理:確保錯誤信息不會暴露敏感信息,並且不執行用户輸入的腳本。

通過這些措施,可以顯著降低XSS攻擊的風險,保護用户和網站的數據安全。

下面是防禦XSS攻擊的代碼示例

以下是一些基本的防禦措施,用於防止XSS攻擊。

輸入過濾示例(HTML特殊字符編碼):

$safeQuery = htmlspecialchars($_GET['search'], ENT_QUOTES, 'UTF-8');
echo "Search results for: " . $safeQuery;

輸出編碼示例(HTML特殊字符編碼):

echo "Comment: " . htmlspecialchars($comment, ENT_QUOTES, 'UTF-8');

使用內容安全策略(CSP):

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'">

使用現代Web框架的自動轉義功能:

{{ user_input|escape }}

JavaScript中避免直接插入HTML:

var userContent = document.getElementById('userInput').value;
// 使用textContent而不是innerHTML來防止HTML注入
document.getElementById('content').textContent = userContent;

請記住,這些示例僅用於説明目的,實際應用中需要根據具體情況選擇合適的防禦策略。

最後

O了,看破就是要説破,我是V哥,一個永遠18的程序員,喜歡廣交天下志同道合的朋友,喜歡分享技術經驗,講真,這會促進我的荷爾蒙分泌,所以會一直堅持下去,歡迎關注威哥愛編程,技術路上我們一起成長。

user avatar shuirong1997 Avatar werbenhu Avatar crow_5c1708a9c847d Avatar fanjiapeng Avatar zhanglei_5b040a0fa2e41 Avatar sigui_5f58bd7ced379 Avatar chen_6016206b422ca Avatar
Favorites 7 users favorite the story!
Favorites

Add a new Comments

Some HTML is okay.