前端过滤XSS攻击

日常开发过程中,对于存在用户交互的一些门户网站等,过滤xss攻击是必不可少的。

此处主要记录下我在工作过程中的简单处理方法。

前端过滤XSS攻击, 我这里用的是开源工程 js-xss,官网地址:http://jsxss.com/zh/index.html

查看官网可发现,与其他的js库一样,使用js-xss,只需(下载)引入xss.js文件到页面即可。

 注意 : xss.js中主要使用到的方法为 filterXSS()

由于我在开发过程中,提交数据多是以表单序列化直接提交的,所以我重写了一下表单序列化的函数,如下所示:

//序列化表单数据,返回k=v&k=v格式的字符串,查看jquery.js源文件,可发现此处主要是改写了一下$(form).serialize()方法
function serializeForm(id) {
    var form;
    if(typeof id == 'string') {
        form = $("#" + id);
    } else if(typeof id == 'object') {
        form = id;
    }
    var array = form.serializeArray();
    for(var i = 0; i < array.length; i++) {
        array[i].value = filterXSS(array[i].value,{   
            stripIgnoreTagBody :['script','iframe'],
            stripIgnoreTag  :true
        });;
    }
    return $.param(array);
}

或者如下方法,返回json对象

//序列化表单数据,返回json对象
function getFormData(id) {
    var form;
    if(typeof id == 'string') {
        form = $("#" + id);
    } else if(typeof id == 'object') {
        form = id;
    }
    var array = form.serializeArray();
    var json = {};
    for(var i = 0; i < array.length; i++) {
        json[array[i].name] =  filterXSS(array[i].value,{
            stripIgnoreTagBody :['script','iframe'],
            stripIgnoreTag  :true
        });
    }
    return json;
}

在进行ajax请求时,在提交表单数据时直接调用上面的其中之一即可(不需再调用$(form).serialize())

到此,前端过滤xss就完成了。

原文地址:https://www.cnblogs.com/yinz/p/5890271.html