[SOLVED] Access to fetch at 'http://localhost:4000/graphql' from origin 'http://localhost:3000' has been blocked by CORS policy

Access to fetch at 'http://localhost:4000/graphql' from origin 'http://localhost:3000' has been blocked by CORS policy

app.register(fastifyCors, {
  origin: 'http://localhost:3000',
  methods: "GET,HEAD,PUT,PATCH,POST,DELETE",
});

This is my CORS configuration for my fastify and graphql-helix server code. Even after using this in the client side I get this error "Access to fetch at 'http://localhost:4000/graphql' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled."

This is the version I am using:

"@fastify/cors": "^8.0.0",
"fastify": "^4.0.0",

Is there any issue in the configuration since I have tried almost all the possible approaches but the result is the same.

Important: I don't want to use fastify-express :)

Solution

Oops, I got what my mistake was, i just needed to add the following in the graphql-helix configuration

res.raw.setHeader('Access-Control-Allow-Origin', '*')