富文本编辑器是黑客进行`xss`攻击的一个重要入口，因此不得不引起重视。本文就给出一个wangEditor编辑器在前端进行`xss`过滤的解决方案。 ---- 首先，编辑器本身将默认过滤在编辑源码模式下，用户输入的`<script>`标签，当然这是一个最基础的过滤手段。（如果你想关闭这个过滤，[点击这里](http://www.kancloud.cn/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); // 接下来便可保存数据... // ..... }); ```