定义:
后果
比如黑客可以通过恶意代码,拿到用户的cookie就可以去登陆了
分类
存储型
攻击者把恶意脚本存储在目标网站的数据库中(没有过滤直接保存)，当用户访问这个页面时，恶意脚本会从数据库中被读取并在用户浏览器中执行。比如在那些允许用户评论的网站, 用户越多,中招的越多
流程
反射型
攻击者通过构造恶意链接，诱使用户点击，恶意脚本随请求发送到目标网站服务器，服务器查看了链接以后以为用户要检索某些信息，并没有进行额外的过滤,服务器的数据库也不需要保存什么信息,就只是返回了对应的结果,浏览器只是把结果呈现在页面.
例子
反射型一般是利用网页的检索功能, 你输入的检索信息会显示在页面中
如果url加一个script标签, 也就注入网页成为内容的一部分,浏览器就会去执行这个js代码
DOM型
攻击者在url中插入恶意代码,前端直接从url中获取恶意代码并且输出到页面,导致恶码被执行, 跟反射型很像,但浏览器并未把恶意代码发送给服务器, 是前端直接执行的. 比如url中的hash部分是不会发送给服务器的,即url前面的部分服务器照常请求,也就是浏览器的渲染分了两步走,给黑客留下可以攻击的漏洞
“#”部分的更改不会重新发送请求, 此页面将hash注入到了页面,黑客就可以利用这个点往页面注入内容, 比如获取cookie等
也就是前端在处理用户输入时未正确验证、过滤或转义，导致恶意输入被解释为代码并执行 . 解决办法: 避免使用innerHTML、document.write, v-html、dangerouslySetInnerHTML 把不可信的数据作为 HTML 插到页面上，而应尽量使用 textContent、setAttribute() 等。
三者区别
DOM 型取出和执⾏恶意代码由浏览器端完成，不涉及将恶意脚本发送到服务器,属于前端JavaScript 自身的安全漏洞，而其他两种属于服务端的安全漏洞。
应对策略
对用户输入进行严格的验证和过滤
前端验证
- 通过h5表单属性,如pattern正则表达式模式,type字段的属性进行限制等;
- js中的动态验证: 通过对输入添加addevenlistener监听
服务端验证
无论客户端是否验证，都必须在服务器端再次验证输入。
可以使用后端语言的内置函数或正则表达式进行验证。
输入过滤
- 用户输入显示在网页上之前,将其中的特殊字符（如 <, >, &, ', "）转义，防止其被解释为脚本, 防止 XSS 攻击。
- URL 编码: 将 URL 中的特殊字符转换为 % 加上两位十六进制数的形式，以确保 URL 安全传输。
let userInput = 'hello world';
let encodedInput = encodeURIComponent(userInput);
console.log(encodedInput); // hello%20world
限制用户输入的长度
防止缓冲区溢出和资源滥用。
CSP
使用 CSP内容安全策略, HTTP 响应头设Content-Security-Policy，本质是建立一个白名单，告诉浏览器哪些外部资源可以加载和执行，从而防止恶意代码的注入攻击。
http-only
黑客本质是想获取cookie拿到客人信息, 而Cookie有一个http-only属性，表示只能被http请求携带,不能通过客户端js脚本访问cookie,
