前端常见安全问题及解决方案

1、XSS安全漏洞

通过URL带入的，这种带入主要是前端解析url中的参数，并对数参数执行了 innerHTML 或者 html 或者 append 操作。在将参数html()或者append()到html文件中时，会执行其中的js代码，被错误用户获取到cookie等信息。

示例：

原始链接 ： https://xx.xxx.com/index.html?nick=aa
被XSS注入以后的链接 ： https://xx.xxx.com/index.html?nick=qqqa<img src=1 onerror=alert(document.cookie)>

解决方案：(使用正则匹配去除某些字符串、过滤域名)

function filterXss(str, regExp){
  // var regex = /<(\S*?)[^>]*>.*?|<.*? \/>/gi;
  // 去除包含<>内容的，防止xss漏洞
  var filterValue = str.replace(/<.*?>/g,'');
  // 去除<开头类型的xss漏洞
  filterValue = str.replace(/<+.*$/g,'');

  if(regExp && !regExp.test(filterValue)){
    filterValue = '';
  }
  return filterValue;
}

2、CSRF安全漏洞（跨站请求伪造）

CSRF是通过 仿造客户端的请求 获取信息的，对于jsonp的请求，客户端确实可以仿造，但是因为对于ajax的请求，有同源策略限制，已经做了域名过滤，所以一般不会有问题。

解决方案：

1、检查报头中的Referer参数确保请求发自正确的网站
（但XHR请求课调用setRequestHeader方法来修改Referer报头）
2、对于任何重要的请求都需要重新验证用户的身份；
3、创建一个唯一的令牌（token），将其存在服务端的session中及客户端的cookie中，
对任何请求， 都检查二者是否一致。