前端如何配合后端实现 CSRF 的 Session 绑定验证？

锦锦提问于 2026-03-11 16:24:22 阅读 4

安全

我最近在做登录功能，后端说要用 Session 绑定的方式来防 CSRF，但我搞不太明白前端要怎么配合。是不是每次请求都要带一个 token？

我看后端在登录成功后往 Session 里存了个 csrf_token，那我是不是得在页面加载时把这个值取出来？可 Session 不是存在服务端的吗，前端根本拿不到啊……

难道要后端额外返回一个字段？比如登录接口同时返回用户信息和 csrfToken？像这样：

{
  "user": { "id": 123 },
  "csrfToken": "a1b2c3d4"
}

但这样和直接用 Cookie + SameSite 有啥区别？我试过在表单里加隐藏字段，但刷新页面 token 就失效了，体验很差。到底该怎么弄才对？

我来解答赞 2 收藏

反馈

1 条解答

Code°娇娇 Lv1

Session 绑定csrf_token不是让你从后端接口去取的。后端渲染页面时，从 Session 读取 token 注入到隐藏字段或 meta 标签里，前端提交时再带上去。

比如后端模板里这样注入：

或者：

前端用 axios 的话设置全局拦截器：

axios.interceptors.request.use(config => {
const token = document.querySelector('meta[name="csrf-token"]').content;
config.headers['X-CSRF-Token'] = token;
return config;
});

刷新页面不会失效，每次后端渲染都会重新从 Session 拿 token 注入。你之前 token 失效可能是用了接口返回的方式但没在每次渲染时更新。

2026-03-11 17:03