How to access DAM image from /content/dam path returned in AEM GraphQL response?

[VijayRa10]

I'm building a block using EDS with XWalk, and I'm fetching content fragments via GraphQL in AEM as a Cloud Service. The image field in the response returns a DAM path like:

"image": {
"_path": "/content/dam/shared/en/contributor/ian_provo.jpg"
}

In my JavaScript, I'm using a helper (createOptimizedPicture) to render the image in a <picture> tag, which generates URLs like:

<img src="/content/dam/shared/en/contributor/ian_provo.jpg?width=750&format=jpg&optimize=medium">

The problem is: The base path /content/dam/... works fine, but adding query parameters like ?width=750&format=jpg causes a 404 error.

What I’ve Verified:

• The image is published and accessible in DAM.
• The GraphQL response includes the correct _path.
• There don’t appear to be any permission issues.

Looking for Guidance On:

• What’s the correct way to reference and optimize DAM images returned from a GraphQL query?
• Why do image URLs with query parameters like ?width=750&format=jpg result in 404 errors?
• Is there any specific configuration needed in AEM (or CDN) to support these optimized image requests?

Thanks in advance for any help!

Vijay

[giuseppebag]

hi @VijayRa10, by looking at this page the image element should have the following fields:

• _dynamicUrl is the URL to for image asset’s web-optimized delivery.
  • The _dynamicUrl does not include a AEM origin, so the domain (AEM Author or AEM Publish service) must be provided by the client application.
• _publishUrl is the full URL to the image asset on AEM Publish

The _dynamicUrl is the recommended URL to use for image asset delivery and should replace the use of _path, _authorUrl, and _publishUrl whenever possible.

Have you tried using the _dynamicUrl already?

[VijayRa10 · Accepted solution]

Hi, @giuseppebag 

Thanks for the reply! I actually found the solution in the Publishing pages with AEM Assets article.