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

今天小编给大家说说前端常见一些安全问题及解决方案，有兴趣的小伙伴可以了解一下！

一、CSRF安全漏洞

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

解决方案：

1、检查报头中的referer参数确保请求发自正确的网站
（但XHR请求课调用setRequestHeader方法来修改Referer报头）

2、对于任何重要的请求都需要重新验证用户的身份；

3、创建一个唯一的令牌（token），将其存在服务端的session中及客户端的cookie中，

对任何请求，都检查二者是否一致。

二、XSS安全漏洞

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

示例：

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

解决

使用正则匹配去除某些字符串、过滤域名
function filterXss(str, regExp){
  // let regex = /<(\S*?)[^>]*>.*?|<.*? \/>/gi;
  // 去除包含<>内容的，防止xss漏洞
  let filterValue = str.replace(/<.*?>/g,'');
  // 去除<开头类型的xss漏洞
  filterValue = str.replace(/<+.*$/g,'');

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

本期内容就到这里，下期我们再来讨论一下别的话题哈~

来源：oschina

链接：https://my.oschina.net/u/4355947/blog/4603620

标签

XHR

jsonp

javascript