xss防范小知识

Posted 2020-12-18 shuhe-nd

一、背景

在Web安全中，xss攻击绝对算是一种非常常见的攻击方式了，它能够窃取用户的隐私信息，比如cookie，也能够做一些非用户意图的操作来达到攻击目的。

 

二、原理

xss攻击是一种非法脚本的插入与执行攻击，全称为 cross site script ,即跨站脚本攻击。

通常我们访问一个安全的网站时，浏览器会认为从该站点来的所有内容都是安全的，并按照html或者js等脚本的内容去如实执行。但是当某个网站存在安全漏洞时，它便有可能被hacker利用起来，类似于SQL注入一般注入js脚本，这时候，浏览器访问该站点时，得到的内容便存在着安全隐患，执行的脚本便会出现问题。

因此，本质上，xss攻击就是一种js脚本注入攻击，以达到非法操作的目的。

 

三、分类

1、反射型攻击

它是指浏览器在访问某个地址时，通过参数的方式，在请求中添加了非法脚本内容，服务端在接受到参数并处理完之后，将这些非法的用户输入响应到前端作为html一部分，前端最终执行了非法的脚本。

2、存储型攻击

这种类型的攻击，常见于存在用户输入的展示，比如说留言，评论，如果在这些内容中加入了非法脚本，那么浏览器在访问这些内容时，便会执行非法脚本。

3、DOM型攻击

同样,通过在url中构建非法的脚本作为参数，前端直接获取这些参数并进行展示时，便会不自觉地执行了非法的脚本。

 

四、举例子

1、前端直接取url中的参数，并拼接到页面进行展示

<input type="text" value="<%= getParameter("keyword") %>">
<button>搜索</button>
<div>
  您搜索的关键词是：<%= getParameter("keyword") %>
</div>

假设我们访问的页面是：baidu.com?keyword=<script>alert(‘xss‘)</script>

那么上述的页面内容便成为了：

<input type="text" value="<%= getParameter("keyword") %>">
<button>搜索</button>
<div>
  您搜索的关键词是：<script>alert(‘xss‘)</script>
</div>

这时候，浏览器便会弹框‘xss’，也就不自觉地执行了我们注入的脚本。

2、用户点击触发脚本

通常，对于第一种例子，我们会想到对用户的输入进行特殊字符的转义，然后再展示，但是这种方式并不能完全阻止脚本的注入与执行.

例如对于a标签，如果它的href地址为：

<a href="<%= escapeHTML(getParameter("redirect_to")) %>">跳转...</a>

那么当我们访问的地址为：

baidu.com?redirect_to=javascript:alert(‘XSS‘)

哪怕进行了特殊字符的转义，这时候html中的实际内容为：

<a href="javascript:alert(&#x27;XSS&#x27;)">跳转...</a>

我们在点击该标签时，还是会触发脚本。

因此，对于转义，并不能够完全的杜绝脚本的注入，我们对于不同的场景，要对用户的输入内容进行不同程度的转义操作。

 

五、防范

一个总的原则是需要对用户的输入进行过滤，认为用户输入的内容总是不可靠的。

1、对于后端

如果后端响应的数据需要拼接到html中，那么我们需要对响应的数据进行转义，通常是对 & < > / " ‘ 等几个字符进行转义。

2、对于前端

使用纯前端渲染、将页面代码和数据进行分离。

1、前段先加载静态页面

2、前端通过ajax获取数据

3、通过DOM api将数据插入到页面

在使用 .innerHTML、.outerHTML、document.write() 时要特别小心，不要把不可信的数据作为 HTML 插到页面上，而应尽量使用 .textContent、.setAttribute() 等。

如果用 Vue/React 技术栈，并且不使用 v-html/dangerouslySetInnerHTML 功能，就在前端 render 阶段避免 innerHTML、outerHTML 的 XSS 隐患。

DOM 中的内联事件监听器，如 location、onclick、onerror、onload、onmouseover 等，<a> 标签的 href 属性，JavaScript 的 eval()、setTimeout()、setInterval() 等，都能把字符串作为代码运行。如果不可信的数据拼接到字符串中传递给这些 API，很容易产生安全隐患，请务必避免。

 

参考：

美团前端安全系列：https://tech.meituan.com/2018/09/27/fe-security.html