由于最近开会接触到了前端安全渗透方面相关内容，对XSS攻击的一些内容了解还不是很透彻，所有查看了XSS攻击的相关内容，做了一些总结
Cross-Site Scripting（跨站脚本攻击）简称 XSS
XSS官方定义是 恶意攻击者往Web页面里插入恶意Script代码，当用户浏览该页之时，嵌入其中Web里面的Script代码会被执行，从而达到恶意攻击用户的目的。”
恶意代码未经过滤，与网站正常的代码混在一起；浏览器无法分辨哪些脚本是可信的，导致恶意脚本被执行。
举个栗子
页面中的搜索内容会在页面上显示，获取时
代码语言：txt复制 <script>
function test() {
var str = document.getElementById('text').value
document.getElementById('t').innerHTML =
"<a href='http://123.com/" str "' >testLink</a>"
}
</script>
<div id="t"></div>
<input type="text" id="text" value="" />
<button onclick="test()">OK</button>此时如果我们在输入框里输入
'onclick=alert(/xss/) //
点击页面上的testLink 就会弹出Xss攻击弹框
使用 '单引号将a href属性闭合，再插入点击事件。
此时html页面代码就是这样的
代码语言：txt复制<a href="http://123.com/" onclick="alert(/xss/)//'">testLink</a>
这里就需要我们对用户输入的内容进行校验。
除了这种方式，还会有别的形式内容
- 在html内嵌的文本，加入恶意的
script标签 - img onerror 注入不受控制的代码
- 在标签的 href、src 等属性中，包含 javascript: 等可执行代码。
- 在标签属性中，恶意内容包含引号，从而突破属性值的限制，注入其他属性或者标签。
开发人员如果将客户输入的内容不做处理的就显示在html中，是很容易产生漏洞的。
现在开发基本上很少拼接html 但是即使用vue框架也可能回使用到v-html的情况。
XSS分类
- 存储型XSS
- 反射型XSS
存储型XSS
- 攻击者会在输入时将恶意代码插入并提交到网站数据库
- 用户打开网站后，服务端返回的数据会解析，并将恶意代码执行
- 恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作
例如评论，留言，论坛可能会出现这类攻击
反射型XSS
- 攻击者构造出有恶意代码的url
- 用户点击链接时，网站会将恶意代码取出并执行。
- 恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作
存储型的XSS攻击危害更大一些，因为反射型的XSS还需要用户点击URL的动作
前端预防 XSS 攻击
DOM 型 XSS 攻击，实际上就是网站前端 JavaScript 代码本身不够严谨，把不可信的数据当作代码执行了。
在使用 .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，很容易产生安全隐患，请务必避免。
xss攻击练习
