SVG in core image component used in XF - doesn't load.

[brwayne]

Hi all,

Facing an issue, with svgs.

Scenario: using image component in XF, with an SVG.

the image loads fine in author and view as published. but when checked in dispatcher it doesn't load.

The path is - 

/content/experience-fragments/abc/en/site/header/master/_jcr_content/root/image.coreimg.svg/1724821385787/abc-logo.svg

it gets a 404 in the network console.

I tried all the usual dispatcher allow rules. nothing works.

/0152 { /type "deny" /method '(POST|OPTIONS)' /url "/content/_cq_graphql/*/endpoint.json" }

/0153 { /type "allow" /method "GET" /url "/content/experience-fragments/.*/.*\\.svg"}

/0107 {/type "allow" /method "GET" /url "/content/experience-fragments/.*/.*\\.svg"}

/0021 { /type "allow" /path "/content/experience-fragments/.*/_jcr_content/.*" /selectors '(img|coreimg)' /method "GET" /extension '(png|svg|gif|jpg|jpeg)' /suffix '.*(jpg|jpeg|png|gif|svg)' }

/0021 { /type "allow" /path "/content/experience-fragments/*" /method "GET" /extension '(png|svg|gif|jpg|jpeg)' }

/0021 { /type "allow" /url "/content/experience-fragments/*" /extension '(png|svg|gif|jpg|jpeg)' }

Can anyone shed some light on this? is there some other thing im missing? is there a limitation with AEM?

Thanks in advance.

[MukeshYadav_]

Hi,

It is giving a 404 error which means not found.
Click on this request and try to see the path which it is trying to access and check:

• check whether it is accessible in publisher or not, if not that means experience fragment is not published. Please publish and check again.
• If it's already published and can be accessed at the publisher then dispatcher is blocking it. Check dispatcher logs and allow it.

You may cross check the rule is not overridden by any other rule as rules are processed in order.

Also to ensure the content is not served from cache , clear dispatcher cache and try in different browser with some query params like 

/content/experience-fragments/abc/en/site/header/master/_jcr_content/root/image.coreimg.svg/1724821385787/abc-logo.svg?q=something

Thanks

[brwayne]

Hi @MukeshYadav_ ,

Publisher works fine, the SVG even loads.

have tried cache busting, with query params. still doesnt work

these are my logs from dispatcher

 "GET /content/experience-fragments/abc/en/site/header/master/_jcr_content/root/image.coreimg.svg/1724821385787/abc-logo.svg" 302 936ms [publishfarm/0] [actionnone] publish-abc.com

 "GET /content/experience-fragments/abc/en/site/header/master/_jcr_content/root/image.coreimg.svg/1725327323350/abc-logo.svg" - 1101ms [publishfarm/0] [actionmiss] publish-abc.com

"GET /content/experience-fragments/abc/en/site/header/master/jcr:content/root/image.coreimg.svg/1725327323350/abc-logo.svg" - 1063ms [publishfarm/0] [actionmiss] publish-abc.com

[arunpatidar]

Hi @brwayne 
above rules look fine, can you check the dispatcher debug logs

or try with global allow  just for testing 

 /0001  { /type "allow" /url "*"  }

[brwayne]

Thanks @arunpatidar ,

will try that config.

one thing I noticed though

when i use any other image format other than svg, the image path i get is from dynamic media.

like: /adobe/dynamicmedia/deliver/dm-aid--d6cb7d68-1cd7-4a3e-95ac-34044513bb25/abc-logo.png?preferwebp=true&quality=85

and the above works in all envs, author, publish, dispatcher

only when i use svg i get this other format of link

[arunpatidar]

Hi @brwayne 
Thanks for sharing. Dynamic media is delivered through a CDN, so there's no dispatcher involved, and it's a separate system from AEM. However, in your case, the SVG is being delivered directly from AEM.

[brwayne]

hi @arunpatidar ,

I've noticed, that we automatically get the dynamic media link, when the option to "enable web optimised images" is checked for the image component policy, in the template. (core component)

if we uncheck it, it goes back to the 

/content/abc/en/page1/_jcr_content/root/image.coreimg.svg/1724821385787/abc.jpg

which again doesnt load.

Also, with SVG, we never get the dynamic media link. whether the option is checked or not.

I saw the documentation for dynamic media, where I dont see SVG is supported.

https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/assets/file-form...

trying to understand the behaviour here. should I raise a github issue or an adobe support ticket to investigate this?

thanks.

[arunpatidar · Accepted solution]

Hi @brwayne 
You can open a support ticket for SVG Dynamic Media support if needed, but since the SVG is loading correctly on the publisher, it indicates that the issue lies with the dispatcher. Before contacting Adobe Support for dispatcher-related issues, try modifying the filter settings and check the request logs. It's possible that Adobe rewrite rules are affecting the image URL.

[brwayne]

@arunpatidar ,

thanks, this is fixed now. you were right.

rewrites.

had to add this - 

#All page paths (/content/abc/en urls without a full stop) redirected to base path
RewriteCond %{REQUEST_URI} !\..*$

RewriteRule ^/content/experience-fragments/abc - [L]

if anyone comes in the future with the same problem.