graphql/yoga-server/docs/features/csrf-prevention

[giscus[bot]]

graphql/yoga-server/docs/features/csrf-prevention

If you have CORS enabled, almost all requests coming from the browser will have a preflight request - however, some requests are deemed "simple" and don't make a preflight.

https://the-guild.dev/graphql/yoga-server/docs/features/csrf-prevention

[n1ru4l]

Hey @enri90, I saw that you downvoted this page. Is there any specific reason for this? Is this page not teaching what you expected? Is there anything we can improve?

[enri90]

I understand the problem but I don't know how to tell yoga in the option request to response with the csrf token header

export const yoga = createYoga({
  
context:  
initialContext.res.setHeader('x-csrf-token', tokens.create(secret));

  
const server = createServer(yoga);

server.listen(port, () => {
  console.info(`Server is running on http://localhost:${port}`);
});

[enri90]

i tried to build with a plugin in yoga
now the challenge stays in urql it doesn't read me the token from the request option

import { ServerAdapterPlugin } from '@whatwg-node/server';

import csrf from 'csrf';
const tokens = new csrf();
const secret = process.env.SECRET_CSRF as string;

declare global {
  interface Request {
    tokenCsrf: string;
  }
}

export function useCSRF<TServerContext>(): ServerAdapterPlugin<TServerContext> {
  return {
    onRequest({ request }) {
      request.tokenCsrf = request.headers.get('X-CSRF-Token') || '';
    },
    onResponse({ request, response }) {
      if (request.method === 'OPTIONS') {
        response.headers.set('X-CSRF-Token', tokens.create(secret));
      }
    },
  };
}