![6d9b7e8b63f5feca6439cd13ef150784.png](https://i-blog.csdnimg.cn/blog_migrate/5cb7955dc5473c9326f0cd2c54a7edf9.png)
XSS介绍
跨站脚本攻击指的是自己的网站运行了别的网站里面的代码
攻击原理是原本需要接受数据但是一段脚本放置在了数据中:
![a8eec654b651dce87610b2dee8501bf3.png](https://i-blog.csdnimg.cn/blog_migrate/4b6726384389f32374591404f64f41c0.jpeg)
该攻击方式能做什么?
- 获取页面数据
- 获取Cookies
- 劫持前端逻辑
- 发送请求到攻击者自己的网站实现资料的盗取
- 偷取网站任意数据
- 偷取用户密码和登陆状态
- 改变按钮的逻辑
XSS攻击类型
其实XSS的种类非常的多尤其是变种的特别多,大致可以分为两种反射型:是通过URL参数直接注入,一般是使用alert来探测站点是否防御,直接攻击的使用src来引入自己的脚本
http://localhost:1521/?from=<script>alert(1)</script>bing
存储型:存储到DB后读取时注入(危害很大)在评论的时候写script标签,这样数据就是存储在数据库中的,如果该页面要读取出这条有script标签的信息那么将这个网址发给别人别人也会中招。
XSS攻击注入点:
html节点内容:如果一个节点是动态生成的,有可能这个节点的数据有脚本(用户输入信息)
html属性:某个html的属性是由用户输入的,输入的内容可能有脚本
<img src="1" onerror="alert(1)"/>
1" onerror="alert(1) // src被提前关闭
js代码:js代码中存在后台注入的变量或者用户输入的信息
localhost:1521/?from=google";alert(1);"
富文本:其实是一大段的html,我们需要保留格式又要去掉script标签,这是比较麻烦的
富文本得保留HTML,HTML有XSS就有攻击风险
实际上浏览器有着XSS的部分防御机制,可以通过
ctx.set('X-XSS-Protection',0); // 0-disable 1-enable
来进行关闭,浏览器的防御很有限,只能是反射型的参数并且出现在html节点和属性中才会进行防御,在js和富文本中是不会拦截的。
五种防御方式
HTML节点内容的XSS防御
转义掉<<和>> 即转义掉<>即可,转义的时机有两种,一种是写入数据库的时候进行转义,另一种实在解析的时候进行转义。
这里是在显示的时候转义
var escapeHtml = function(str){
str = str.replace(/>/g, '<');
str = str.replace(/>/g, '>');
return str;
}
escapeHtml(content);
HTML属性的XSS防御
转义”&quto; 即转义掉双引号,'转义掉单引号,(另一个要注意的是实际上html的属性可以不包括引号,因此严格的说我们还需要对空格进行转义,但是这样会导致渲染的时候空格数不对,因此我们不转义空格,然后再写html属性的时候全部带上引号)这样属性就不会被提前关闭了
var escapeHtmlProperty = function(str){
str = str.replace(/"/g, '&quto;');
str = str.replace(/'/g, ''');
str = str.replace(/ /g, ' ');
return str;
}
escapeHtml(content);
其实以上这两个函数可以合并成一个函数,这样不管是内容还是属性都可以使用一个函数来过滤了:
HTML转义函数
var escapeHtmlProperty = function(str){
if(!str) return '';
str = str.replace(/&/g, '&');
str = str.replace(/>/g, '<');
str = str.replace(/>/g, '>');
str = str.replace(/"/g, '&quto;');
str = str.replace(/'/g, ''');
return str;
}
escapeHtml(content);
js转义
转义””或者替换成json
var escapeForJs = function(str){
if(!str) return '';
str = str.replace(//g,'');
str = str.replace(/"/g,'"');
}
这里的解决方式并不完整,因为还有可能是单引号或者其他形势包裹的,这里最保险的方法其实很简单,就是对数据做一次JSON.stringify即可
富文本
由于需要完整的HTML因此不太容易过滤,一般是按照白名单进行保留部分标签和属性来进行过滤,除了允许的标签和属性,其他的全部不允许(也有黑名单的方式,但是由于html复杂效果比较差,原理就是之前的正则替换)
其实可以用别人写好的XSS组件就叫做xss,直接
npm install xss
白名单-使用第三方库XSS,支持指定白名单
var xssFilter = function(html){
if(!html) return '';
var xss = require('xss');
var ret = xss(html, {
whiteList:{
img: ['src'],
a: ['href'],
font: ['size', 'color']
},
onIgnoreTag: function(){
return '';
}
});
console.log(html, ret);
return ret;
};
本文作者熊冰,个人网站:
Bing的天涯路zhuanlan.zhihu.com转载请注明出处。