Expand my Community achievements bar.

SOLVED

Cors error react - graphql

Avatar

Level 2

I am unable to consume response from AEM to React application.

React App - AEM Headless Example | Adobe Experience Manager

Access to fetch at 'http://localhost:4504/content/graphql/global/endpoint.json' 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.

1 Accepted Solution

Avatar

Correct answer by
Level 2

I am able to consume response with help of below configuration

 

Adobe Granite CSRF filter - Excluded path 

Add cutom graphql endpoint - for example - /content/_cq_graphql/myproject/endpoint.json

 

 

View solution in original post

3 Replies

Avatar

Employee Advisor

Hi @sathyaprakash 

Please check below link to configure your CORS policy and Sling Refferer Filter on AEM to enable GraphQL Endpoints accessible to external application

https://www.albinsblog.com/2021/10/how-to-deliver-headless-content-through-graphql-api-and-content-f...

 

Avatar

Correct answer by
Level 2

I am able to consume response with help of below configuration

 

Adobe Granite CSRF filter - Excluded path 

Add cutom graphql endpoint - for example - /content/_cq_graphql/myproject/endpoint.json

 

 

Avatar

Employee Advisor

@sathyaprakash @kautuk_sahni 
Can you please mark the correct answer, so people would know the result of this query.