对于前端安全，你了解多少？说说你对XSS和CSRF的理解

我了解前端安全的重要性，以及XSS和CSRF等常见攻击方式。它们对用户和网站都构成严重威胁。以下是我对XSS和CSRF的理解：

XSS (Cross-Site Scripting - 跨站脚本攻击)

原理: 攻击者将恶意脚本注入到被攻击网站的页面中，当其他用户访问该页面时，恶意脚本会在用户的浏览器中执行。
危害: 窃取用户Cookie、会话信息、修改DOM元素、重定向到恶意网站、进行钓鱼攻击等。
类型:
- 存储型XSS (Persistent XSS): 恶意脚本被持久化存储在服务器端，例如数据库、评论区等。所有访问该页面的用户都会受到攻击。危害最大。
- 反射型XSS (Reflected XSS): 恶意脚本通过URL参数等方式传递给服务器，服务器将其反射回客户端。用户需要点击带有恶意脚本的链接才会受到攻击。
- DOM型XSS (DOM Based XSS): 恶意脚本完全在客户端执行，不经过服务器。攻击者利用客户端JavaScript的漏洞，将恶意脚本注入到DOM中。
防御:
- 输入编码/转义: 对用户输入进行HTML编码、JavaScript编码、URL编码等，防止恶意脚本被浏览器解析执行。
- 输出编码/转义: 根据输出的上下文进行相应的编码，例如在HTML属性中使用HTML实体编码，在JavaScript代码中使用JavaScript字符串转义。
- 设置HTTPOnly Cookie: 防止JavaScript读取Cookie，降低Cookie被窃取的风险。
- 使用CSP (Content Security Policy): 限制页面可以加载的资源，例如脚本、图片、样式表等，防止恶意脚本的加载和执行。
- 使用合适的框架和库: 一些前端框架和库提供了内置的安全机制，可以帮助开发者更方便地防御XSS攻击。

CSRF (Cross-Site Request Forgery - 跨站请求伪造)

原理: 攻击者诱导用户在已经登录目标网站的情况下，访问攻击者控制的网站，该网站会向目标网站发送恶意请求，利用用户的登录状态进行未经授权的操作。
危害: 修改用户资料、发布恶意信息、盗取账户资金等。
类型: 主要通过表单提交、链接点击、JavaScript等方式发起伪造请求。
防御:
- 使用SameSite Cookie属性: 限制Cookie在跨站请求中发送，可以有效防止CSRF攻击。
- 验证Referer头: 检查请求的Referer头是否来自合法的域名，但Referer头可以被伪造或被浏览器屏蔽，因此不能完全依赖此方法。
- 添加CSRF Token: 在表单中添加一个随机生成的Token，服务器端验证Token的有效性，防止伪造请求。这是最常用的防御方法。
- 双重Cookie验证: 将CSRF Token存储在Cookie中，同时在表单中也包含该Token，服务器端验证两者是否一致。