07-安全問題：CSRF和XSS
#前言
面試中的安全問題，明確來說，就兩個方面：
-
CSRF：基本概念、攻擊方式、防御措施
-
XSS：基本概念、攻擊方式、防御措施
這兩個問題，一般不會問太難。
有人問：SQL注入算嗎？答案：這個其實跟前端的關系不是很大。
#CSRF
問的不難，一般問：
-
CSRF的基本概念、縮寫、全稱
-
攻擊原理
-
防御措施
如果把攻擊原理和防御措施掌握好，基本沒什么問題。
#1、CSRF的基本概念、縮寫、全稱
CSRF（Cross-site request forgery）：跨站請求偽造。
PS：中文名一定要記住。英文全稱，如果記不住也拉倒。
#2、CSRF的攻擊原理
用戶是網站A的注冊用戶，且登錄進去，於是網站A就給用戶下發cookie。
從上圖可以看出，要完成一次CSRF攻擊，受害者必須滿足兩個必要的條件：
（1）登錄受信任網站A，並在本地生成Cookie。（如果用戶沒有登錄網站A，那么網站B在誘導的時候，請求網站A的api接口時，會提示你登錄）
（2）在不登出A的情況下，訪問危險網站B（其實是利用了網站A的漏洞）。
我們在講CSRF時，一定要把上面的兩點說清楚。
溫馨提示一下，cookie保證了用戶可以處於登錄狀態，但網站B其實拿不到 cookie。
舉個例子，前段時間里，微博網站有個api接口有漏洞，導致很多用戶的粉絲暴增。
#3、CSRF如何防御
方法一、Token 驗證：（用的最多）
（1）服務器發送給客戶端一個token；
（2）客戶端提交的表單中帶着這個token。
（3）如果這個 token 不合法，那么服務器拒絕這個請求。
方法二：隱藏令牌：
把 token 隱藏在 http 的 head頭中。
方法二和方法一有點像，本質上沒有太大區別，只是使用方式上有區別。
方法三、Referer 驗證：
Referer 指的是頁面請求來源。意思是，只接受本站的請求，服務器才做響應；如果不是，就攔截。
#XSS
#1、XSS的基本概念
XSS（Cross Site Scripting）：跨域腳本攻擊。
接下來，我們詳細講一下 XSS 的內容。
預備知識：HTTP、Cookie、Ajax。
#XSS的攻擊原理
XSS攻擊的核心原理是：不需要你做任何的登錄認證，它會通過合法的操作（比如在url中輸入、在評論框中輸入），向你的頁面注入腳本（可能是js、hmtl代碼塊等）。
最后導致的結果可能是：
-
盜用Cookie
-
破壞頁面的正常結構，插入廣告等惡意內容
-
D-doss攻擊
#XSS的攻擊方式
- 1、反射型
發出請求時，XSS代碼出現在url中，作為輸入提交到服務器端，服務器端解析后響應，XSS代碼隨響應內容一起傳回給瀏覽器，最后瀏覽器解析執行XSS代碼。這個過程像一次反射，所以叫反射型XSS。
- 2、存儲型
存儲型XSS和反射型XSS的差別在於，提交的代碼會存儲在服務器端（數據庫、內存、文件系統等），下次請求時目標頁面時不用再提交XSS代碼。
#XSS的防范措施（encode + 過濾）
XSS的防范措施主要有三個：
1、編碼：
對用戶輸入的數據進行HTML Entity編碼。
如上圖所示，把字符轉換成 轉義字符。
Encode的作用是將$var等一些字符進行轉化，使得瀏覽器在最終輸出結果上是一樣的。
比如說這段代碼：
<script>alert(1)</script>
若不進行任何處理，則瀏覽器會執行alert的js操作，實現XSS注入。
進行編碼處理之后，L在瀏覽器中的顯示結果就是<script>alert(1)</script>，實現了將$var作為純文本進行輸出，且不引起JavaScript的執行。
參考鏈接：4類防御XSS的有效方法
2、過濾：
-
移除用戶輸入的和事件相關的屬性。如onerror可以自動觸發攻擊，還有onclick等。（總而言之，過濾掉一些不安全的內容）
-
移除用戶輸入的Style節點、Script節點、Iframe節點。（尤其是Script節點，它可是支持跨域的呀，一定要移除）。
3、校正
-
避免直接對
HTML Entity進行解碼。 -
使用
DOM Parse轉換，校正不配對的DOM標簽。
備注：我們應該去了解一下DOM Parse這個概念，它的作用是把文本解析成DOM結構。
比較常用的做法是，通過第一步的編碼轉成文本，然后第三步轉成DOM對象，然后經過第二步的過濾。
還有一種簡潔的答案：
首先是encode，如果是富文本，就白名單。
#CSRF 和 XSS 的區別
面試官還可能喜歡問二者的區別。
區別一：
-
CSRF：需要用戶先登錄網站A，獲取 cookie。
-
XSS：不需要登錄。
區別二：（原理的區別）
-
CSRF：是利用網站A本身的漏洞，去請求網站A的api。
-
XSS：是向網站 A 注入 JS代碼，然后執行 JS 里的代碼，篡改網站A的內容。
#其他
#XSS
關於XSS，推薦幾個網站：
里面列出了很多XSS的例子，可以長見識。如果你專門研究XSS，可以看看。
比如，他的第一篇文章就講到了XSS的原理分析與解剖。有句話摘抄如下：彈窗只是測試xss的存在性和使用性。
比如，這個人還有篇文章寫自動化檢測CSRF（第一章）。大公司做網站，一般會做嗅探服務（比如自動化工具做CSRF的檢測、自動化的方式控制安全風險）。
另外，可能還有些工具，可以掃描代碼本身有沒有一些安全問題。
這是GitHub上的一個德國組織。
上面的項目都跟安全相關，有些倉庫是可以直接運行的。如果你不需要定制，就可以直接用別人的，沒必要自己寫XSS庫、XSS的過濾之類的，避免麻煩。