富文本编辑器防xss攻击

在平时的开发中,有时需要引入富文本编辑器,由用户来输入信息并保存入数据库。而这也给项目留下了潜在的隐患,如果不在开发时就做好防范,则很容易受到相应的攻击。
对于常见的web安全问题,可以参考 web安全(入门篇)

现在针对富文本编辑器如何防止xss攻击,给出几点建议,也供自己以后查找:

  • 推荐使用UEditor

  • 使用ESAPI


推荐使用UEditor

在多个项目中使用了UEditor,在使用上比较顺手,而且它一直在更新维护,最重要的是它注重修复其潜在的xss漏洞。这将有效的防止xss攻击。

使用ESAPI

针对不同的开发语言,ESAPI有多个不同版本相对应。比如Java,PHP,.NET,Python,Classic ASP,Cold Fusion,Node

以node为例

node-esapi is a minimal port of the ESAPI4JS (Enterprise Security API for JavaScript) encoder.

-Installation

$ npm install node-esapi

-Usage

var ESAPI = require('node-esapi');
ESAPI.encoder().encodeForHTML('<p>This is a test</p>');

-Encoder Functions

The encoder() returns an object with the following main functions:

encodeForHTML
encodeForCSS
encodeForJS = encodeForJavaScript = encodeForJavascript
encodeForURL
encodeForHTMLAttribute
encodeForBase64

-Middleware

The ESAPI has a function for creating express middleware to serve client side scripts of ESAPI.

app.use(ESAPI.middleware());

// Now in your HTML you can do
<script src="/esapi/esapi.js"></script>
<script src="/esapi/resources/i18n/ESAPI_Standard_en_US.properties.js"></script>
<script src="/esapi/resources/Base.esapi.properties.js"></script>
<script>
    org.owasp.esapi.ESAPI.initialize();
    //Here you have access to the $ESAPI object and can do
    $ESAPI.encoder().encodeForHTML('<p>This is a test</p>');
</script>

node防xss还有一个可选用的插件 –xss

-安装
NPM

$ npm install xss

Bower

$ bower install xss

或者

$ bower install https://github.com/leizongmin/js-xss.git

-使用方法
-在Node.js中使用

var xss = require('xss');
var html = xss('<script>alert("xss");</script>');
console.log(html);

-在浏览器端使用
Shim模式(参考文件 test/test.html):

<script src="https://raw.github.com/leizongmin/js-xss/master/dist/xss.js"></script>
<script>
// 使用函数名 filterXSS,用法一样
    var html = filterXSS('<script>alert("xss");</scr' + 'ipt>');
    alert(html);
</script>

AMD模式(参考文件 test/test_amd.html):

<script>
    require.config({
      baseUrl: './',
      paths: {
        xss: 'https://raw.github.com/leizongmin/js-xss/master/dist/xss.js'
      },
      shim: {
        xss: {exports: 'filterXSS'}
      }
    });
    require(['xss'], function (xss) {
      var html = xss('<script>alert("xss");</scr' + 'ipt>');
      alert(html);
    });
</script>
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值