SSR leads to 403 CSRF Token Mismatch with nuxt-security module

[larsjkr]

Hello everyone 👋

I'm not entirely sure if this is actually a question or potentially a bug, but I'm getting a CSRF Token Mismatch error during server-side rendering when running the nuxt-security module with csrf: true.

security: {
  csrf: true,
  enabled: true,
  removeLoggers: false,
},

I've prepared a minimal reproducible example that demonstrates my current implementation and the the issue.

So the question is: How to fix this error and get CSRF to work with nuxt-content?

Many thanks for your support! 🙏

[yudin-s]

CSRF protection should usually be enforced on browser-originated mutating requests, not on the internal read path Nuxt Content uses during SSR.

The likely issue is that SSR is making a server-side request to a content endpoint without the browser CSRF token/header pair that nuxt-security expects. That makes sense from the CSRF module's perspective, but it is not the request class you actually need to protect.

I would try one of these approaches:

1. Exclude Nuxt Content's internal/read-only endpoints from CSRF checks.
2. Apply CSRF only to unsafe methods (POST, PUT, PATCH, DELETE) and your own mutation routes.
3. If you intentionally fetch a protected API during SSR, forward the relevant cookie/header from the incoming request with useRequestHeaders().

For content pages, option 1 or 2 is usually the cleanest. Markdown/content reads are not a CSRF target in the same way a state-changing form submission is, and forcing CSRF onto SSR content fetching can break perfectly valid server-rendered requests.