【web安全】深入淺出XSS攻擊

Colin_Mindset發表於2019-05-02
Web

在學習JS的過程中，你一定聽說過CSRF攻擊和XSS攻擊。關於CSRF攻擊，我已經在之前的文章中介紹過了，本文就來介紹一下XSS攻擊。

XSS定義和原理

發出請求時，XSS程式碼出現在url中，作為輸入提交到服務端，服務端解析後響應，XSS程式碼隨響應內容一起回傳給瀏覽器，最後瀏覽器解析並執行XSS程式碼。

XSS防禦措施

一般xss防禦措施有三種：

  • 編碼
  • 過濾：原樣顯示使用者輸入內容時，要把不合法的內容過濾掉。
    如dom屬性、style屬性、script節點、iframe節點等。
  • 校正
    使用dom parse轉換，校正dom標籤

XSS實戰

1. 構建一個express應用

對於沒有過node開發經驗的同學，我這裡簡單介紹一下建立express應用的步驟。

  1. 建立一個目錄mkdir xss
  2. 利用express命令，在當前目錄下建立一個express腳手架 express -e ./
  3. 安裝所有依賴 npm install
  4. 啟動服務 npm start
  5. 訪問 localhost:3000
2. 修改腳手架程式碼，使得url中引數隨響應內容回傳給瀏覽器
var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express', xss: req.query.xss});
});

module.exports = router;

<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
    <div>
      <%- xss %>
    </div>
  </body>
</html>
3. 引數中攜帶有攻擊性的指令碼

攜帶img標籤：
http://localhost:3000/?xss=<img src="null" onerror="alert(123)"
你會發現alert並沒有彈出來，並看到瀏覽器端報錯。
在這裡插入圖片描述
這是在響應頭裡預設加入了xss防禦檢查標誌，瀏覽器做了xss防禦保護。我們這裡先關閉。

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.set('X-XSS-Protection', 0)
  res.render('index', { title: 'Express', xss: req.query.xss});
});

module.exports = router;

此時可以看到alert彈窗就彈出來了。
在這裡插入圖片描述
此時，我們就成功進行了一次xss攻擊。
demo地址

參考

https://blog.csdn.net/Lxd_0111/article/details/78028889

為什麼要進行url編碼？
HTTP協議中引數的傳輸是“key=value”鍵值對的形式，如果要傳輸多個引數要用“&”符號進行分割。這樣伺服器在接收到這種字串的時候，會用“&”符號分割出每個引數，再用“=”分割出引數值。
現在有這樣一個問題：當引數中包含“=”或“&”等特殊字元時，伺服器解析字串就會出錯。所以，需要對特殊字元進行編碼。

相關文章