XSS 的定义
Cross-Site Scripting（跨站脚本攻击）简称 XSS（用来区分样式 CSS） ，Web 页面被注入恶意代码，通常注入的是 JS 代码，带不限于 JS。
XSS 的注入方式
- 在 HTML 代码中以 script 标签注入，例：
<div><?php echo $_GET['sign'];?></div>
//通过浏览器GET传参 sign=<script>alert(1)</script> 即可触发JS片段
- 在内联的 JavaScript 中，拼接的数据突破了原本的限制（字符串，变量，方法名等）
<script>
let msg = '输出' + <?php echo $_GET['sign'];?>;
//通过浏览器GET传参 sign=alert(1) 即可触发JS片段
</script>
- 在标签属性中，恶意内容包含引号，从而突破属性值的限制，注入其他属性或者标签，例：
<input type="text" value="<?php echo $_GET['sign'];?>" />
//通过浏览器GET传参 sign="><script>alert(1)</script> 通过 "> 字符提前闭合Input标签来达到执行JS目的
- 在标签的 href、src 等属性中，包含 javascript: 等可执行代码，例：
<a href="<?php echo $_GET['sign'];?>">点击跳转</a>
//通过浏览器GET传参 sign=javascript:alert(1) 点击即可触发JS片段
- 在 onload、onerror、onclick 等事件中，注入不受控制代码
<button onclick="<?php echo $_GET['sign'];?>">点击触发</button>
//通过浏览器GET传参 sign=<script>alert(1)</script> 点击即可触发JS片段
XSS 的分类
- 存储型：恶意代码通过提交存储在网站数据库中，通过页面打开时触发
- 反射型：恶意代码通过 URL 传递，当页面打开时触发
- DOM型：恶意代码通过 URL 传递，当页面打开时触发，不同于其他类型是由服务的的漏洞引起，DOM 型是前端 JS 的安全漏洞
XSS 预防
通常对于 XSS 的解决方式是对输入内容进行过滤，严格限制输入的规则，而对恶意代码的预防有如下两种途径：
1.阻止恶意代码提交：
- 该方式由后端对输入数据进行过滤、转义后存入数据库
- 过滤不能放在前端，因为一旦绕过前端过滤机制，就可以直接提交恶意代码
- 后端返回前端的数据，除了明确使用场景的，不能直接返回转义的数据，因为转义后的代码无法通过JS直接作用vue模板、字符长度计算、alert等
2.阻止浏览器执行恶意代码
- 纯前端渲染，代码和数据分离，需要插入页面的数据全部采用 AJAX 来进行请求，通过 innerText 、setAttribute 、style 等明确告诉浏览器是文本数据，但该方式有性能局限性，后台业务可这样操作
- 对 HTML 做充分转义，对常见的 <>&/'" 字符进行转义，但无法阻止内联JS，跳转链接 src 等的攻击，这时候需要根据业务场景选择成熟的转义库，优化转义策略
3.DOM 型注入防御
相比前两种，该注入方式是通过前端 JS 代码不严谨造成的，在编码阶段，慎重使用 innerHTML、outHTML、document.write()，这些方法会不通过转义执行代码，应尽量使用 textContent、setAttribute等。另外 DOM 中的内联监听器，onclick、onerror，a 标签的 src 等都是会有注入风险，应谨慎使用。
网友评论