XSS跨站脚本攻击漏洞解决

XSS(跨站脚本)攻击分类

1. 存储型
   存储型XSS，持久化，代码是存储在服务器中的，如在个人信息或发表文章等地方，插入代码，如果没有过滤或过滤不严，那么这些代码将储存到服务器中，用户访问该页面的时候触发代码执行。这种XSS比较危险，容易造成蠕虫，盗窃cookie
2. 反射型
   非持久化，需要欺骗用户自己去点击链接才能触发XSS代码（服务器中没有这样的页面和内容），一般容易出现在搜索页面
3. DOM型XSS
   不经过后端，DOM-XSS漏洞是基于文档对象模型(Document Objeet Model,DOM)的一种漏洞，DOM-XSS是通过url传入参数去控制触发的，其实也属于反射型XSS。

XSS解决
解决思路：
控制脚本注入的语法要素。比如:JavaScript离不开:“<”、“>”、“(”、“）”、“;”…等等，我们只需要在输入或输出时对其进行字符过滤或转义处理就即可。一般我们会采用转义的方式来处理，转义字符是会使用到HTML的原始码，因为原始码是可以被浏览器直接识别的，所以使用起来非常方便。允许可输入的字符串长度限制也可以一定程度上控制脚本注入。

前端解决方案：

// 使用正则表达式实现html编码
    function htmlEncodeByRegExp(str) {
      var s = '';
      if (str.length === 0) {
        return s;
      }
      return (s + str)
        .replace(/&/g, "&")
        .replace(/</g, "<")
        .replace(/>/g, ">")
        .replace(/ /g, " ")
        .replace(/\'/g, "&#39")
        .replace(/\"/g, """)
        .replace(/\//g, '&#x2F;');
    }

    // 使用正则表达式实现html解码
    function htmlDecodeByRegExp(str) {
      var s = '';
      if (str.length === 0) {
        return s;
      }
      return (s + str)
        .replace(/&/g, "&")
        .replace(/</g, "<")
        .replace(/>/g, ">")
        .replace(/ /g, " ")
        .replace(/&#39/g, "\'")
        .replace(/"/g, "\"")
        .replace(/&#x2F;/g, "\/");
    }

//转换编码
function encodeForHTMLAttrbute(str) {
    let encoded = '';
    for(let i = 0; i < str.length; i++) {
        let ch = hex = str[i];
        if (!/[A-Za-z0-9]/.test(str[i]) && str.charCodeAt(i) < 256) {
            hex = '&#x' + ch.charCodeAt(0) + ';';
        }
//.toString(16)
        encoded += hex;
    }
    return encoded;
}

//解编码
function encodeDecodeHTMLAttrbute(str){
    if(str === null || str == ''){
        return "";
    }

    for(let i =0;i<str.length;i++){
        if(str.indexOf('&#x') > 0){
            str = str.replace(/&#x(.*?);/,String.fromCharCode(str.match(/&#x(.*?);/)[1]))
        }else {
            return str;
        }
    }
}

参考文章：
XSS(跨站脚本)漏洞详解之XSS跨站脚本攻击漏洞的解决
web安全之XSS攻击原理及防范