前端開發中如何做到頁面安全，防止 xss ，csrf 這樣的欺騙及偽造？

01-14

涉及安全問題，最好從攻擊者視角來看問題，而不是看這個問題是前端處理還是後端處理。

後端能解決的是常駐的xss，如果頁面存在XSS而非常駐式（典型案例就是url中xss可以被執行）後端就愛莫能助了。

而這種url中的XSS漏洞最為「危險」，因為大家對它能造成的危害嚴重低估。

當第三方的JS腳本能夠在你的根域上執行，首當其衝的就是cookie大門打開了，

其次，它也就掌握了頁面上一切內容的操作權。

CSRF的問題也類似，如果網站存在XSS，防禦CSRF就無從談起，

而沒有XSS的情況下，在攻擊者嚴重CSRF的安全就只是依賴token的偽造成本高低之分。

像xss，csrf這樣的問題，雖然我覺得應該更多是後端應該考慮的問題。。。

簡單依次說一下

1.xss

防範xss的關鍵是過濾所有的『&<』和『&>』字元，確保從後端而來的數據並不帶有任何的html標籤，xss的危險在於有不可預料的前端腳本，但是值得注意的是，不單只有script標籤是可以運行腳本的，任何的html標籤都可以加上類似onclick，onload這樣的事件也都可以運行腳本，所以需要過濾所有的『&<』和『&>』字元。

假如，從後端而來的數據一定需要帶上html標籤（比如編輯器的富文本），且內容並不能保證是安全的（並不是可靠的人員錄入的），就需要有合適的規則去「凈化」它們。這個有現成的工具，比如HTML Purifier。http://htmlpurifier.org/

2.csrf

防範csrf的前提是首先避免xss，xss如果都不能防止，那防止csrf就扯蛋了。。。

防範csrf的第一點是對於資料庫的更改操作（insert、update和delete），表單必須使用post請求。這是為了防止類似於在一個img和src裡面寫一個路徑，讓用戶錯誤訪問改動資料庫的問題。

做完第一點還不夠，因為html表單的action是可以跨域提交的，用戶在一個網站提交到另一個網站，可能他還不知情，這就需要確保用戶的來源表單是可信的，一般的做法是在表單裡面添加一段隱藏的唯一的token，像sessionId那樣可以驗明用戶的身份，接收表單的同時確認這個token的有效性。

關於他們兩者的詳細信息請參考wiki

http://en.wikipedia.org/wiki/Cross-site_scripting

http://en.wikipedia.org/wiki/Cross-site_request_forgery

前端無法完全避免，得在後端配合處理.

頁面展示數據的時候全部用textContent寫入，不要用innerHTML，少數需要用html的，就特殊處理

唔，最近開始研究安全，還是剛跨進門的菜鳥。

這個問題怎麼說呢，就像是你做數學題目一樣，你覺得自己對的，會的同學或者理解很深入的人就可能會覺得你不對。

了解安全方面一樣的，你自己需要先知道基本的Web知識，然後這些攻擊方式、具體的實現方式、利用方式，然後才能夠自己處理。