Cross-Origin Resource Sharing (CORS) configuration

CAUTION
If caching in the Dispatcher has been enabled then the CORS Filter is not needed, and so this section can be ignored.
NOTE
For a detailed overview of the CORS resource sharing policy in AEM see Understand Cross-Origin Resource Sharing (CORS).

To access the GraphQL endpoint, a CORS policy must be configured and added to an AEM Project that is deployed to AEM via Cloud Manager. This is done by adding an appropriate OSGi CORS configuration file for the desired endpoint(s). Multiple CORS configurations can be created and deployed to different environments. Examples can be found in the WKND Reference Site

The CORS configuration must specify a trusted website origin alloworigin or alloworiginregexp for which access must be granted.

The configuration file must be named like: com.adobe.granite.cors.impl.CORSPolicyImpl~appname-graphql.cfg.json where appname reflects the name of your application.

For example, to grant access to the GraphQL endpoint /content/cq:graphql/wknd/endpoint and persisted queries endpoint for https://my.domain you can use:

{
  "supportscredentials":false,
  "supportedmethods":[
    "GET",
    "HEAD",
    "POST"
  ],
  "exposedheaders":[
    ""
  ],
  "alloworigin":[
    "https://my.domain"
  ],
  "maxage:Integer":1800,
  "alloworiginregexp":[
    ""
  ],
  "supportedheaders":[
    "Origin",
    "Accept",
    "X-Requested-With",
    "Content-Type",
    "Access-Control-Request-Method",
    "Access-Control-Request-Headers"
  ],
  "allowedpaths":[
    "/content/cq:graphql/wknd/endpoint.json",
    "/graphql/execute.json/.*"
  ]
}

If you have configured a vanity path for the endpoint, you can also use it in allowedpaths.

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab