_island RecordCSRF攻击
CSRF（Cross-site request forgery），跨站请求伪造，指的是攻击者诱导用户点击链接，打开带有攻击的网站，利用用户当前在原网站的登录状态数据信息进去跨站请求。
CSRF攻击前提条件
- 攻击者想在网站内执行某一个操作，例如更改密码
- 攻击者可以知道/猜测网站对应所需要的参数及值
- 只能通过
cookie的方式来验证用户信息的网站
场景
例如你正在访问一个网站，点击了黑客为您所准备的点击事件（可能是点击了广告右上角的X，或者其他触发事件的元素），进入到一个新的页面
此时，恭喜你 被攻击了。
当你进入了这个网站时，它可能发生了下面这些事情
自动GET请求
例如点击的元素是这样子的
<img src="https://origin_web_site.com/get?user=island">在进入页面的时候，发送了以上的请求（包含了用户信息），如果服务器没用做用户信息校验的情况下，服务器就会认为这是一个正常用户的请求，允许进行事件操作（如，修改账号密码，银行转账等）
自动POST请求
攻击者填写了一份表单数据，同样携带用户cookie信息，让服务器误以为是一个正常用户在使用，允许进行事件操作。
诱导用户的GET请求
黑客的网站可能放着一个链接，诱导用户去点击它
<a href="https://website/get?user=island" taget="_blank">领取现金</a>点击后和自动发送get请求一样，携带着用户信息进行事件操作。
防范CSRF
Cookie.SameSite属性
使用sameSite标记的cookie，只有在同域名的情况下才会携带cookie信息
在chrome51之后，新增了sameSite属性，用来防止CSRF攻击
验证来源站点
Cookie的同源和浏览器同源策略有点区别
浏览器：协议、域名和端口都相同即同源 cookie：域名相同即同源
在http协议中，每个请求都会携带origin和Referer请求标头，用来标记来源域名
通常都是由浏览器自动带上的，前端无法修改它，服务器在接收后可以判断这两个header来确定来源的域名信息
WARNING
如果这两个头部都不存在，应该直接阻止，特别是没有使用CSRFToken作为二次检测。
CSRFToken
CSRFToken是用来防止攻击者直接伪装我们的请求发送攻击的，它是一个令牌，例如上面我们提到的在当前网站放上url?user=island，携带着参数发送到对应的网站攻击者就能拿到你的用户信息
现在，如果在传输传输上面新出一个参数CSRFToken，当服务器端在接收数据的时候，发现该参数缺失的，或者是错误的，那么服务器就无法处理当前的请求了，达到保护用户信息安全的目的
XSS攻击
XXS即（Cross Site Scripting），跨站脚本，为什么不是叫CSS呢？原因是为了CSS（Cascading Style Sheets）做出区分。
是最普遍的Web应用安全漏洞
指的是在浏览器中执行恶意脚本，获取用户数据信息并执行对应的操作
XSS一般可以操作一下事件
- 窃取
Cookie，因为它会在浏览器发送请求时自动发出 - 监听用户行为，通过植入脚本方式，获取用户行为发送到目标服务器（攻击者）
- 修改
Dom，伪造登录表单，植入iframe - 在页面中生成广告
- 在访问量较大的网站上的
XSS可以攻击一些小型网站，实现DDos攻击
XSS也分为三种方式
存储型
存储型（又称持久型）指的是将数据储存起来，将一段恶意脚本代码存储到网站的数据库中，在后续客户端执行的时候就会直接执行这一段脚本代码，达到攻击效果
例如在评论区页面的提交输入框输入<script>alter('我是攻击代码')</script>，提交的时候如果前后端都没有做好处理，当下次浏览器渲染评论区内容时就会直接执行该代码。
像现在主流的Vue框架都会对代码做出转义工作，详情请查阅
反射型
反射性指的是将恶意脚本作为网络请求的一部分
例如浏览器发出一个带有query参数的请求
http://192.168.0.29/api/get?num=<script>alert("我是攻击代码")</script>服务器拿到这个参数时候，再返回给客户端，此时浏览器解析的时候就会执行对应的内容，达到攻击效果
因为通过了浏览器->服务器->浏览器->解析执行，所以被命名为反射型
文档型
文档型指的是通过“中间人”的方式进行攻击，在客户端与服务器端进行数据传输的时候通过劫持网络数据包，修改里面的内容。
如何防范XSS
转义
不要相信任何一方提供的输入，都要对其进行转义工作
例如1 < 2，转义为1 < 2
防范存储型和反射型
存储型和反射型都是从服务器端取出恶意代码之后，将其插入到html被浏览器执行的。
常见的预防方法有
- 改成纯前端渲染，把代码和数据进行分开
- 具体做法是
- 浏览器先加载一个静态的
html，与不包含业务的数据 - 通过
js网络请求数据，调用DomApi更新到页面上
- 对
HTML进行转义操作- 常见的模板引擎都会对
HTML内容进行转义（& < > " ' /）
- 常见的模板引擎都会对
拓展 CSP
CSP（Content Security Policy，浏览器中的内容安全策略）是一个额外的安全层，用于检测并削弱某些特定类型的攻击，包括跨站脚本（XSS）和数据注入攻击等。无论是数据盗取、网站内容污染还是恶意软件分发，这些攻击都是主要的手段
你可以设定你的网站所有数据来源于一个源，例如：
Content-Security-Policy: default-src 'self'严格的CSP在XSS的防范中可以起到以下的作用：
- 禁止加载外域代码，防止复杂的攻击逻辑
- 禁止外域提交，网站被攻击后，用户的数据不会泄露到外域
- 禁止内联脚本执行
- 禁止未授权的脚本执行
- 合理使用上报可以及时发现
XSS，利于尽快修复问题
限制用户输入长度
对于不受信任的输入，应该规定一个合理的长度，虽然无法完全方式XSS攻击，但可以增加XSS攻击的难度
设置Http-only
禁止js读取cookie，攻击者在植入脚本后无法窃取cookie数据
CSRF攻击与XSS区别
和XSS相比，CSRF无需向客户端服务端注入恶意脚本进行攻击，而是跳入新的页面中利用用户的登录态模拟用户的操作