富文本編輯器是黑客進行`xss`攻擊的一個重要入口，因此不得不引起重視。本文就給出一個wangEditor編輯器在前端進行`xss`過濾的解決方案。 ---- 首先，編輯器本身將默認過濾在編輯源碼模式下，用戶輸入的`<script>`標簽，當然這是一個最基礎的過濾手段。（如果你想關閉這個過濾，[點擊這里](http://www.hmoore.net/wangfupeng/wangeditor2/113983)） ---- 接下來，針對更加高級、復雜的`xss`過濾，我們可以借用一個工具——http://jsxss.com/zh/index.html ，畢竟『術業有專攻』，還是用專業搞這項工作的庫，比較靠譜。 如何下載使用，可參見它的官方網站。它的`API`很簡單，網站首頁就有一個樣例，如下： ```html <!--引入 xss.js 文件--> <script src="https://raw.github.com/leizongmin/js-xss/master/dist/xss.js"></script> <script> // 通過一個全局的 filterXSS 函數來過濾 console.log(filterXSS('<a href="#" onclick="alert(/xss/)">click me</a>')); </scsript> ``` ---- 下面寫一個完整的示例 ```html <div id="div1"> <p>請輸入內容...</p> </div> <button id="btn1">獲取內容</button> <!--這里引用jquery--> <!--這里引用wangEditor.js--> <!--這里引用xss.js--> <script type="text/javascript"> var editor = new wangEditor('div1'); editor.create(); $('#btn1').click(function () { // 獲取編輯器區域完整html代碼 var html = editor.$txt.html(); // 過濾 xss 攻擊 html = filterXSS(html); // 接下來便可保存數據... // ..... }); ```