XSS簡介
跨站指令碼攻擊指的是自己的網站運行了別的網站裡面的程式碼
攻擊原理是原本需要接受資料但是一段指令碼放置在了資料中：
XSS攻擊原理
XSS攻擊能做什麼？
獲取頁面資料
獲取Cookies
劫持前端邏輯
傳送請求到攻擊者自己的網站實現資料的盜取
偷取網站任意資料
偷取使用者密碼和登陸狀態
改變按鈕的邏輯
XSS攻擊型別
其實XSS的種類非常的多尤其是變種的特別多，大致可以分為兩種
反射型：是透過URL引數直接注入，一般是使用alert來探測站點是否防禦，直接攻擊的使用src來引入自己的指令碼
http：//localhost：1521/？from=bing
儲存型：儲存到DB後讀取時注入（危害很大）在評論的時候寫script標籤，這樣資料就是儲存在資料庫中的，如果該頁面要讀取出這條有script標籤的資訊那麼將這個網址發給別人別人也會中招。
XSS攻擊注入點：
html節點內容：如果一個節點是動態生成的，有可能這個節點的資料有指令碼（使用者輸入資訊）
html屬性：某個html的屬性是由使用者輸入的，輸入的內容可能有指令碼
1“ onerror=”alert（1） // src被提前關閉
js程式碼：js程式碼中存在後臺注入的變數或者使用者輸入的資訊
localhost：1521/？from=google“；alert（1）；”
富文字：其實是一大段的html，我們需要保留格式又要去掉script標籤，這是比較麻煩的
富文字得保留HTML，HTML有XSS就有攻擊風險
實際上瀏覽器有著XSS的部分防禦機制，可以透過
ctx。set（‘X-XSS-Protection’，0）； // 0-disable 1-enable
來進行關閉，瀏覽器的防禦很有限，只能是反射型的引數並且出現在html節點和屬性中才會進行防禦，在js和富文字中是不會攔截的。
五種防禦方式
HTML節點內容的XSS防禦
轉義掉<<和>> 即轉義掉<>即可，轉義的時機有兩種，一種是寫入資料庫的時候進行轉義，另一種是在解析的時候進行轉義。
這裡是在顯示的時候轉義
var escapeHtml = function（str）{ str = str。replace（/>/g， ‘<’）； str = str。replace（/>/g， ‘>’）； return str；}escapeHtml（content）；
HTML屬性的XSS防禦
轉義”&quto； 即轉義掉雙引號，‘轉義掉單引號，（另一個要注意的是實際上html的屬性可以不包括引號，因此嚴格的說我們還需要對空格進行轉義，但是這樣會導致渲染的時候空格數不對，因此我們不轉義空格，然後再寫html屬性的時候全部帶上引號）這樣屬性就不會被提前關閉了
var escapeHtmlProperty = function（str）{ str = str。replace（/“/g， ’&quto；‘）； str = str。replace（/’/g， ‘’‘）； str = str。replace（/ /g， ’ ‘）； return str；}escapeHtml（content）；
其實以上這兩個函式可以合併成一個函式，這樣不管是內容還是屬性都可以使用一個函式來過濾了：
HTML轉義函式
var escapeHtmlProperty = function（str）{ if（！str） return ’‘； str = str。replace（/&/g， ’&‘）； str = str。replace（/>/g， ’<‘）； str = str。replace（/>/g， ’>‘）； str = str。replace（/”/g， ’&quto；‘）； str = str。replace（/’/g， ‘’‘）； return str；}escapeHtml（content）；
js轉義
轉義”\”或者替換成json
var escapeForJs = function（str）{ if（！str） return ’‘； str = str。replace（/\\/g，’\\\\‘）； str = str。replace（/“/g，’\\”‘）；}
這裡的解決方式並不完整，因為還有可能是單引號或者其他形勢包裹的，這裡最保險的方法其實很簡單，就是對資料做一次JSON。stringify即可
富文字
由於需要完整的HTML因此不太容易過濾，一般是按照白名單進行保留部分標籤和屬性來進行過濾，除了允許的標籤和屬性，其他的全部不允許（也有黑名單的方式，但是由於html複雜效果比較差，原理就是之前的正則替換）
其實可以用別人寫好的XSS元件就叫做xss，直接
npm install xss
白名單-使用第三方庫XSS，支援指定白名單
var xssFilter = function（html）{ if（！html） return ’‘； var xss = require（’xss‘）； var ret = xss（html， { whiteList：{ img： ［’src‘］， a： ［’href‘］， font： ［’size‘， ’color‘］ }， onIgnoreTag： function（）{ return ’‘； } }）； console。log（html， ret）； return ret；}；
本文作者熊冰，個人網站［Bing的天涯路］，轉載請註明作者和出處。
