Fetching data using GhraphQL Query Api mode

Question

I have setup the sitecore Jss react app to my sitecore instance. I am using layout service api to get the data in JSON form. It is giving data properly. When I am using GhraphQL Query to fetch the of the item it giving CORS origin error as below: Access to fetch at 'http://sc910jss.local/sitecore/api/graph/items/master' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: 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.

I tried to set the header Access-Control-Allow-Origin and also mode to 'no-cors' but still getting same error. Please help me into this. Thanks in advance.

Answer 1

You must pass the SSC API key (the same one you use for JSS layout service) to the GraphQL endpoint, so that the API key's CORS configuration takes effect.

i.e. /end/point?sc_apikey=YOUR-API-KEY-HERE