SSR leads to 403 CSRF Token Mismatch with nuxt-content 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! 🙏

[Baroshem]

Hey, maybe @Morgbn will have an answer for that? Buddy, have you had a similar issue before?

[larsjkr]

@Baroshem @Morgbn Any idea how to fix this? Happy to share more context if needed. 🙂

[Morgbn]

Hello @larsjkr, did you try to disabled csrf protection for nuxt content routes?
See: https://github.com/morgbn/nuxt-csurf?tab=readme-ov-file#per-route-configuration ;)
I'm not very familiar with Nuxt content, but I think that POST /__nuxt_content is not called by users in their browser (not part of your public API), only triggered by Nuxt itself during SSR.
Otherwise, you may need to rewrite the logic of useContent to use $csrfFetch or useCsrf(), in order to add the CSRF token to the request headers

[larsjkr]

Thank you @Morgbn! Will try it out. :)