1.引言

每逢前端面試，80%的候選人都會被問到這個問題。這問題確確實實是一道八股文。為了應(yīng)付面試，我自己也是反反復(fù)復(fù)背了好幾次，但是記了又忘，忘了又記，如此優(yōu)雅的惡性循環(huán)讓我痛下決心去搞定其中的枝枝葉葉。廢話不多說，上車吧。

2.常見前端攻擊策略

• SQL注入
• XSS攻擊
• CSRF攻擊

3.攻擊策略解釋

3.1 SQL注入

sql注入通常是在url頭或者表單內(nèi)部通過拼接sql語句實現(xiàn)攻擊。

它的原理比較簡單，當瀏覽器url頭或者表單提交數(shù)據(jù)到后端時，后端會進行數(shù)據(jù)庫操作，如果未經(jīng)過處理請求參數(shù)，那么攻擊者會通過任意sql語句獲取關(guān)鍵敏感數(shù)據(jù)從而實現(xiàn)攻擊。

3.2 XSS攻擊

xss攻擊也是十分經(jīng)典的，在前端發(fā)展歷程中也是打不死的小強，現(xiàn)在已經(jīng)衍生出了許多xss攻擊策略。

• 存儲型：經(jīng)過后端+經(jīng)過數(shù)據(jù)庫

存儲型攻擊通常指攻擊者在前端的表單上輸入惡意腳本代碼，后端將表單數(shù)據(jù)保存到數(shù)據(jù)庫，之后通過讀取數(shù)據(jù)庫信息顯示在前端。

如下所示，假設(shè)該表單是一個評論功能，后端將表單內(nèi)容保存到數(shù)據(jù)庫后展示在界面上。如果前端解析表單內(nèi)容是通過innerHTML,那用戶的cookie信息就會被竊取。

• 反射型：經(jīng)過后端+不經(jīng)過數(shù)據(jù)庫

反射型攻擊有個十分經(jīng)典的案例，用過qq的小伙伴都知道每年都會爆料某誘騙鏈接偽造qq登錄騙取用戶登錄信息造成個人數(shù)據(jù)泄露。這類誘導(dǎo)鏈接十分有趣，我本人也上當過。它的標題經(jīng)常是"什么，你竟然和同班xxx一起合過影"等刺激信息誘騙用戶點擊進而輸入個人賬號信息。然后攻擊者后端會收到用戶輸入的賬號和密碼進而盜竊。

• Dom型：前端

談到dom型攻擊，也是十分簡單。根據(jù)名稱就知道和dom元素相關(guān)。此類攻擊方式是建立在dom節(jié)點上。如下例子

//正確的鏈接
<img src='http://www.baidu.com'/>
//錯誤的鏈接
<img src="http://error.com"/ onerror=()=>{alert(document.cookie())}>

看了上面的例子，相比有的小伙伴有了點頭緒，攻擊者修改img標簽的src，并給dom添加錯誤觸發(fā)事件，當圖片無法加載就會觸發(fā)腳本代碼從而獲取用戶信息。

3.3 CSRF攻擊

csrf攻擊又稱為跨站偽造攻擊，具體解釋就是你在訪問淘寶頁面，此時一個yellow網(wǎng)站的彈窗突然出現(xiàn)，由于你經(jīng)受不住好奇心，于是想一探究竟。然后你就進入這個yellow網(wǎng)站，由于你在淘寶頁面有了登錄狀態(tài)，前端自動保存了cookie信息，當你在進入yellow網(wǎng)站時已經(jīng)向它的后端發(fā)起了http請求，此時cookie身份信息就被這個yellow網(wǎng)站竊取了。

4.攻擊防御的正確姿勢

4.1 SQL注入防御

此處我們只是討論前端在sql注入的防御措施，通常我們在表單提交時對sql語句的特殊變量進行轉(zhuǎn)譯，這樣可以將其作為普通字符串處理而組織獲取敏感信息。

4.2 XSS防御

• 針對登錄方式的，可以采取掃碼和動態(tài)驗證碼等結(jié)合方式
• 針對竊取用戶cookie的，我們可以在后端設(shè)置httponly防止前端讀取用戶的cookie
• 不相信用戶輸入的任何數(shù)據(jù)，所有輸入的數(shù)據(jù)應(yīng)該在前端進行轉(zhuǎn)譯和限制，減少innerHTML的使用

4.3 CSRF防御

看了上面的CSRF攻擊方式，我們可以總結(jié)以下防御手段

• 后端設(shè)置secure,這個字段保證了只有是https的網(wǎng)站才會將cookie攜帶，因為https都是經(jīng)過安全認證的，一般不會存在問題
• 后端設(shè)置SameSites字段是Strict，這個字段稱為嚴格模式，它會校驗當前發(fā)起后端請求的網(wǎng)站是不是自己站點的，如果不符合不會攜帶cookie,有效的避免了危機。
• token驗證機制，這個很有意思啊，有個面試官曾經(jīng)問過這么一個問題，聽過token可以防止csrf攻擊，那你token放在哪里？是cookie還是localstorage上？這個要好好考慮，這個必須是放在localstorage上，如果放在未經(jīng)后端嚴格設(shè)置的cookie上，還是會被第三方通過cookie獲取到你的token密鑰。由于localstorage在瀏覽器上存在同源機制，第三方打死都無法獲取你localstoarge的值，除非第三方偷你電腦。所以我們可以將token放到localstorage上預(yù)防csrf攻擊。

以上就是前端面試之對安全防御的理解分析的詳細內(nèi)容，更多關(guān)于前端面試安全防御的資料請關(guān)注腳本之家其它相關(guān)文章！

最新評論