How to Retrieve a GraphQL Response in EDS Using XWalk?

[VijayRa10]

Hi Everyone,

I'm currently working on an Edge Delivery Services (EDS) project using XWalk and trying to fetch data from an AEM GraphQL endpoint. Here’s the simplified JavaScript logic I’m using:

const isAuthor = window.location.hostname.includes('adobeaemcloud');
const domain = isAuthor ? '' : 'publish-p1234-e454334.adobeaemcloud.com';
const endpoint = '/graphql/execute.json/eds-dummy/faqs';
const url = domain ? https://${domain}${endpoint} : endpoint;

const response = await fetch(url);
const data = await response.json();

I also followed the steps outlined in the Publishing pages with AEM Assets article and applied the following changes:

• Updated paths.json:

{
  "mappings": [
    "/content/eds-dummy/:/"
  ],
  "includes": [
    "/content/eds-dummy/",
    "/content/dam/eds-dummy/"
  ]
}

• Set Cloud Configuration for the DAM folder (/content/dam/eds-dummy/):
  • Went to Assets → /content/dam/eds-dummy/
  • Opened Properties → Cloud Services
  • Set the Cloud Configuration to /conf/eds-dummy and saved.

After applying these configurations, I'm now encountering a CORS error when trying to fetch the GraphQL response.

Access to fetch at 'https://publish-p1234-e454334.adobeaemcloud.com/graphql/execute.json/eds-dummy/faqs'
from origin 'https://main--eds-dummy--iamhelium.aem.live' has been blocked by CORS policy:
The 'Access-Control-Allow-Origin' header contains multiple values
'https://main--eds-dummy--iamhelium.aem.live,*', but only one is allowed.

This results in a failed request: 

GET https://publish-p1234-e454334.adobeaemcloud.com/graphql/execute.json/eds-dummy/faqs net::ERR_FAILED 200 (OK)

This issue didn't occur previously, so I suspect it might be related to the recent update I made to the Cloud Configuration of the DAM folder—especially since the content fragment referenced in the GraphQL query is also located within that same folder.

My questions:

• Is this the correct approach for fetching GraphQL data in an EDS project using XWalk?
• Does this CORS error suggest a misconfiguration on the AEM side (e.g., misused Access-Control-Allow-Origin)?
• Are there any additional configurations needed—either in paths.json, AEM, or elsewhere—to allow GraphQL access from EDS?

Any insights, suggestions, or best practices would be greatly appreciated!
Thanks in advance!

Vijay

[arunpatidar · Accepted solution]

Hi @VijayRa10 

I would recommended not to expose the direct publish URL. Instead, you should route requests through a reverse proxy.

For example, instead of accessing:

https://publish-p1234-e454334.adobeaemcloud.com/graphql/execute.json/eds-dummy/faqs

use https://www.my.site/graphql/execute.json/eds-dummy/faqs

You can configure your CDN to forward requests starting with /graphql to the publish instance:

This approach keeps your infrastructure secure and abstracts internal URLs from the public.

[Supriya_Savre]

Hi @VijayRa10,

Did the shared solution help you out? If yes, kindly consider marking the most suitable answer as ‘correct’.

If you’re still facing any challenges, please feel free to continue the conversation here. We’re happy to support further.

[VijayRa10]

Hi @arunpatidar,

Thanks for the suggestion — that makes sense.

Could you please share how to configure the CDN to forward requests like /graphql to the publish instance? I'd really appreciate it if you could point me to any documentation or reference material for setting that up.

[arunpatidar]

Hi @VijayRa10 

Please refer below if your are using AEM Fastly CDN

https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/implementing/con... 

Example

- name: replace-jpg-with-jpeg
        when:
          reqProperty: path
          like: /mypath
        actions:
          - type: transform
            reqProperty: path
            op: replace
            match: (.*)(\.jpg)$
            replacement: "\1\.jpeg"