前端安全（XSS、CSRF防護）

時間 2019-11-07

標籤前端安全 xss csrf 防護欄目系統安全简体版

原文原文鏈接

1、網絡安全

OWASP：開放式Web應用程序安全項目（OWASP，Open Web Application Security Project）

OWASP是一個開源的、非盈利的全球性安全組織，致力於應用軟件的安全研究。 http://www.owasp.org.cn/

2、XSS攻擊

一、總述

二、XSS攻擊原理

XSS攻擊（Cross-Site Scripting）跨站腳本攻擊。被OWASP評爲十大安全漏洞中的第二威脅漏洞。

特色：能注入惡意的HTML/JavaScript代碼到用戶瀏覽的網頁上，從而達到Cookie資料竊取、會話劫持、釣魚欺騙等攻擊。<攻擊代碼不必定（非要）在 <script></script> 中>

緣由：a：Web瀏覽器自己的設計不安全。瀏覽器能解析和執行JS等代碼，可是不會判斷該數據和程序代碼是否惡意。

b：輸入和輸出是Web應用程序最基本的交互，並且網站的交互功能愈來愈豐富。若是在這過程當中沒有作好安全防禦，很容易會出現XSS漏洞。

c：程序員水平良莠不齊，並且大都沒有過正規的安全培訓，沒有相關的安全意識。

d：XSS攻擊手段靈活多變。

三、防護XSS攻擊

a：HttpOnly 瀏覽器禁止頁面的JS訪問帶有HttpOnly屬性的Cookie。

b：輸入檢查 XSS Filter 對輸入內容作格式檢查，相似「白名單」，可讓一些基於特殊字符的攻擊失效。在客戶端JS和服務器端代碼中實現相同的輸入檢查（服務器端必須有）。

c：輸出檢查在變量輸出到html頁面時，可使用編碼或轉義的方式來防護XSS攻擊 HtmlEncode：將字符轉成HTMLEntities，對應的標準是ISO-8859-1。

& --> & < --> < > -->> " --> " ' --> ' / --> /

JS中可使用JavascriptEncode。須要對「\」對特殊字符轉義，輸出的變量的必須在引號內部。

d：XSS的本質是「HTML注入」，用戶的數據被當成了HTML代碼一部分來執行，從而混淆了本來的語義，產生了新的語義。

在Html標籤中輸出：<div>$var</div> 在標籤中輸出的變量，若是未作任何處理，都能致使直接產生XSS：構造一個<script>標籤，或者是任何可以產生腳本執行的方式：<div><script>alert(/XSS/)</script></div> 或者 <a href=# ><img src=# onerror=alert(1) /></a>

防護方法：對變量使用HtmlEncode。

在Html屬性中輸出：<div id="abc name="$var"></div> 攻擊方法：<div id="abc" name=""><script>alert(/XSS/)</script><""></div>

防護方法：採用HtmlEncode。在OWASP ESAPI中推薦了一種更嚴格的HtmlEncode：除了字母、數字外，全部的特殊字符都被編碼成HTMLEntities。

在<script>標籤中輸出：<script>var x = "";alert(/XSS/);//";<script>

防護方法：使用JavascriptEncode。

在事件中輸出：與在<script>標籤中輸出相似：<a href=# onclick="funcA('');alert(/XSS/);//')">test</a>

防護方法：使用JavascriptEncode。

在CSS中輸出：方式多樣

防護方法：儘量禁止用戶可控制的變量在"<style>標籤"、"html標籤的style屬性"、"CSS文件"中輸出。若是必定有此需求，則推薦使用 OWASP ESAPI 中的encodeForCSS()函數。除了字母、數字外的全部字符都被編碼成十六進制形式「\uHH」。

在地址中輸出：比較複雜。通常是在URL的path(路徑)或者search(參數)中輸出，使用URLEncode便可。

整個URL都被用戶徹底控制時，URL的Protocal(http://) 和Host (www.evil.com)部分不能使用URLEncode，可能會構造僞協議實施攻擊：

防護方法：先檢查變量是否以」http「開頭（若是不是則自動添加），以保證不會出現僞協議類的XSS攻擊。在此以後，再對變量進行URLEncode。

e：處理富文本網站容許用戶提交一些自定義的HTML代碼，稱之爲」富文本「。好比用戶在論壇裏發帖，帖子的內容有圖片、視頻、表格等，這些」富文本「的效果都須要經過HTML代碼來實現。

防護方法：與輸入檢查的思路一致。使用"XSS Filter"：「事件」應該被嚴格禁止；一些危險的標籤：<iframe>、<script>、<base>、<form>等也應嚴格禁止；在標籤、屬性、事件的選擇上，應該使用白名單，避免使用黑名單。好比，只容許<a>、<img>、<div>等比較「安全」的標籤存在。可以使用一些開源項目：Anti-Samy 是OWASP上的一個開源項目，可以使用於Java、.NET等。 HTMLPurify可以使用於PHP中。

f：防護DOM Based XSS 若是是輸出到事件或腳本，要作一次javascriptEncode；若是是輸出到HTML內容或者屬性，要作一次HtmlEncode。

處理XSS注入的時候，不只僅要轉義或刪除特殊的 HTML 標記和符號，如尖括號<>，如script，如iframe等，還須要過濾 JavaScript 事件所涉及的大量屬性，前端通常使用XSS Filter 設置「白名單」。過濾的事件大體以下：

屬性	當如下狀況發生時，出現此事件
onabort	圖像加載被中斷
onblur	元素失去焦點
onchange	用戶改變域的內容
onclick	鼠標點擊某個對象
ondblclick	鼠標雙擊某個對象
onerror	當加載文檔或圖像時發生某個錯誤
onfocus	元素得到焦點
onkeydown	某個鍵盤的鍵被按下
onkeypress	某個鍵盤的鍵被按下或按住
onkeyup	某個鍵盤的鍵被鬆開
onload	某個頁面或圖像被完成加載
onmousedown	某個鼠標按鍵被按下
onmousemove	鼠標被移動
onmouseout	鼠標從某元素移開
onmouseover	鼠標被移到某元素之上
onmouseup	某個鼠標按鍵被鬆開
onreset	重置按鈕被點擊
onresize	窗口或框架被調整尺寸
onselect	文本被選定
onsubmit	提交按鈕被點擊
onunload	用戶退出頁面

3、CSRF攻擊

一、總述

二、攻擊原理

CSRF攻擊跨站請求僞造。本質：重要操做的全部參數都是能夠被攻擊者猜想到的。攻擊者預測出URL的全部參數與參數值，才能成功地構造一個僞造的請求。

三、防護CSRF攻擊

防護方法：驗證碼、 Referer Check 檢查請求是否來自合法的源（可被僞造）。

通用方法：Token 使用Anti-CSRF Token 在URL中保持原參數不變，新增一個參數Token。Token的值是隨機的（必須使用足夠安全的隨機數生成算法，或者採用真隨機數生成器），其爲用戶與服務器所共同持有，能夠放在用戶的Session中，或者瀏覽器的Cookie中。注意保密，儘可能把Token放在表單中（構造一個隱藏的input元素），以POST提交，避免Token泄露。

注意：若是網站有XSS漏洞或者一些跨域漏洞，可能致使Token泄露。

在XSS攻擊下，讀取Token值，而後再構造出一個合法的請求，能夠稱爲：XSRF。

4、HTML5安全

HTML5新增的一些標籤和屬性，使XSS攻擊產生了新的變化，若是原來的XSS Filter是用的「黑名單」，就會致使攻擊者用HTML5新增的標籤來進行攻擊，若是用的「白名單」，這方面的隱患就會少一些。

5、常見前端框架對XSS攻擊的防範

React 默認會轉義全部字符串。

AngularJS 使用AngularJS中的SCE來防護XSS攻擊。

6、Web安全掃描器

商業軟件：IBM Rational Appscan、WebInspect、Acunetix WVS

免費軟件：W3AF、SkipFish

--------------------------------------------------------------------------------------------

參考資料：《白帽子講Web安全》吳瀚清