Behaviour of Image component.
COMPONENT DESCRIPTION :
We have overlayed the Image Component from AEM core components ( resourceSuperType = core/wcm/components/image/v1/image) in our own project under /apps/bmc/components/content/image folder. It uses
<img src="${image.src}"
title="${image.title}"/>
to display Image on page load .
ISSUE REPORTED : The Image component does not render images on the page and is only displaying title if added. The links on view source are as below :
PUBLISH environment link --> /content/projectfolder/taxonomy1/taxonomy2/taxonomy3//../../../asset2.html.img.jpeg/1562307241129/ss-asset-web-750x400-1.jpeg
Author environment link --> /content/projectfolder/taxonomy1/taxonomy2/taxonomy3/../../../../../ss_asset2.img.jpeg/1580828984432/ss-asset-web-750x400-1.jpeg
The publish environment image component <img src=""> links have ".html.img.jpe" appended which is causing images to not load. If we remove the .html it should work fine.
The component works fine on AEM 6.3.3 environment and is failing on 6.5.3 only.
NOT A DISPATCHER ISSUE :
It turns out this problem can indeed be reproduced on pages that are not served through the dispatcher/apache stack.
AFTER CHANGING TO V2 IMAGE COMPONENT : We tried replacing resourceSuperType from resourceSuperType = core/wcm/components/image/v1/image) to resourceSuperType = core/wcm/components/image/v2/image) it still fails , however If we replace the <img src="${image.src}" > to <img src="${image.fileReference}" , i.e pointing images directly to DAM links , it works fine, But Images are not loaded with proper renditions and this is not a viable solution.
. The custom link checker in our project does not handle any<img> tag specifically and is designed to work on <a href> only. Could this be because we are missing any configuration in Out of the box LinkChecker in AEM 6.5.3
Let me know if you need any more details.
Thanks,
Samiksha.
Solved! Go to Solution.
Topics help categorize Community content and increase your ability to discover relevant content.
Views
Replies
Total Likes
But i want to use <img src="${image.src}"> tag instead of <img src="${image.fileReference}"> , will the solution work for this as well.
Views
Replies
Total Likes
Views
Replies
Total Likes
Views
Likes
Replies
Views
Likes
Replies
Views
Likes
Replies