面试题：Vue项目中针对CSRF攻击的加固策略

Question

CSRF（跨站请求伪造）攻击可能会对Vue项目造成严重影响。请详细说明在Vue项目开发中，你会如何识别并实施有效的策略来防范CSRF攻击，包括但不限于前后端协作的方式。

Answer 1

识别CSRF攻击

1. 异常请求行为：观察请求频率、请求来源、请求参数等是否异常。例如，短时间内大量来自陌生IP且参数奇怪的请求，可能是CSRF攻击。
2. 用户行为分析：监测用户正常操作流程与当前请求是否匹配。若用户未进行相关操作却产生请求，可能存在攻击。

防范策略

1. 前后端协作 - 使用CSRF Token
   • 后端生成Token：用户登录成功后，后端为用户生成一个唯一的CSRF Token，通常存储在用户的会话（session）中。
   • 前端获取并携带：前端在页面加载时从后端获取该Token，例如在Vue组件的created钩子函数中通过API获取。并在后续所有需要保护的请求（如POST、PUT、DELETE等）的请求头或请求参数中携带该Token。
   • 后端验证：后端接收到请求时，从请求头或参数中提取Token，并与存储在会话中的Token进行比对。若一致，则请求合法；否则，拒绝请求。
2. Same - Site Cookie属性
   • 设置Cookie属性：后端在设置用户相关的Cookie时，将Same - Site属性设置为strict或lax。strict模式下，只有在同源请求时才会发送Cookie，能有效防止CSRF攻击，但可能影响一些跨站操作；lax模式相对宽松，允许部分安全的跨站请求发送Cookie，例如从第三方网站链接到本站的GET请求。
3. 验证Referer字段
   • 后端验证：后端检查请求的Referer字段，确认请求来源是否为合法的本网站页面。若Referer不是本网站域名，则拒绝请求。不过，该方法存在局限性，因为Referer字段可能被伪造。
4. 前端限制请求
   • 限制请求源：在前端代码中，使用CSP（Content - Security - Policy）策略限制资源的加载来源，防止恶意脚本注入。例如，设置default - src'self'，只允许从本域名加载资源，减少攻击风险。
   • 绑定事件：在Vue项目中，确保表单提交、按钮点击等操作与特定的用户交互绑定，避免自动触发请求。例如，通过v - on:click等指令绑定真实用户操作。