chore: add CSRF middleware for server functions

Merged
SE
4mo ago
+10-2

Adds the recommended CSRF middleware to src/start.ts to silence the TanStack Start warning:

TanStack Start server functions are not protected by the CSRF middleware.

const csrfMiddleware = createCsrfMiddleware({
  filter: ctx => ctx.handlerType === 'serverFn',
});
// composed with the existing Sentry request/function middleware

Is it actually needed?

For this site the risk is low ā€” the only server function is the read-only docs page loader (no auth, no mutations, no user state), so a forged cross-site request could only fetch public docs. But the fix is one line, it's the framework's recommended default, and it protects any state-changing server function added later. So: worth doing to resolve the warning properly rather than suppressing it.

The middleware validates same-origin (Sec-Fetch-Site / Origin, with a Referer fallback) only for serverFn requests; legitimate same-origin calls pass unchanged.

Verified

  • āœ… build + lint pass.
  • āœ… The CSRF warning no longer appears.
  • āœ… Docs pages still load (the server function works under the middleware).

šŸ¤– Generated with Claude Code

https://claude.ai/code/session_01HhaZ2zL7bAqT3c8mRWTSs9

Summary by cubic

Add CSRF middleware for TanStack Start server functions to block cross-site calls and remove the framework warning. Uses createCsrfMiddleware from @tanstack/react-start, scoped to serverFn requests and composed after the Sentry request middleware so Sentry sees any CSRF rejections.