Next.js 15 CSRF 防护 SameSite Double Submit 与 Server Actions 校验实践

概览CSRF 防护通过限制第三方上下文的 Cookie 携带与验证请求中的防伪 Token 来实现可信提交。结合 SameSite 与 Double Submit，可在不依赖状态存储的情况下实现稳健校验。生成 Token 与设置 Cookieapp/login/page.tsximport { cookies } from 'next/headers' export default async function Login() { const token = crypto.randomUUID() cookies().set('csrf', token, { httpOnly: true, sameSite: 'lax', path: '/' }) return ( <form action={action}> <input name="email" /> <input type="hidden" name="csrf" value={token} /> <button>提交</button> </form> ) } async function action(formData: FormData) { 'use server' const cookie = cookies().get('csrf')?.value const token = String(formData.get('csrf') || '') if (!cookie || cookie !== token) { throw new Error('Invalid CSRF') } return { ok: true } } 治理要点设置 Cookie `SameSite=lax`，避免跨站上下文自动携带；对敏感场景使用 `strict` 并配合跳转策略。Double Submit 不依赖服务端会话存储；对高安全场景可采用会话存储或一次性 Token。与 HTTPS、CSP、Trusted Types 等协同，形成系统性防护。验证与指标浏览器：现代浏览器；Next.js：15.0+跨站提交被拦截；可信来源提交通过，错误场景反馈清晰