Investigating the use of HEIC assets in AEM | Adobe Higher Education
Skip to main content
Level 2
January 28, 2025
質問

Investigating the use of HEIC assets in AEM

  • January 28, 2025
  • 2 の返信
  • 742 ビュー

I want to investigate the use of HEIC assets in AEM. We would need the capability to upload/create renditions and render them on the page. I have uploaded the HEIC format images(eg: sample.heic) in AEM dam. But, I am unable to see the image. could you please help me to upload/create renditions and render them on the page in aem.

このトピックへの返信は締め切られました。

2 の返信

sarav_prakash
Community Advisor
Community Advisor
January 30, 2025

Please refer to this cheat sheet - https://experienceleague.adobe.com/en/docs/experience-manager-cloud-service/content/assets/file-format-support#image-support-dynamic-media

 

heic format is NOT supported by AEM and Dynamic media. And it is no surprise. HEIC is NOT a web-supported format. Even if AEM accepted and allowed to upload, browser donot support to render - https://stackoverflow.com/questions/51135568/image-heic-not-loaded-properly-on-browsers

 

Only option you have is to leave raw images in Creative Cloud, and only upload supported rastors by AEM. 

SekharBu1作成者
Level 2
February 5, 2025

are there any other ways by making changes in html or javascript or any AEM template changes to render the HEIC image on aem page?. Because they are asking to render HEIC image on the page without converting it to supporting formates like jpg, jpeg, png ... etc. Even I am using safari browser I can able to upload the HEIC image in AEM DAM but I am unable to preview or view or render the image. Please suggest any solution or at least provide explanation if not possible to render.

sarav_prakash
Community Advisor
Community Advisor
February 10, 2025

Got it. This is no-browser-support evidence. But if still required, will be slow experience, since you have to transform to compatible formats.

Found this js library that ll create a canvas and render.

https://github.com/catdad-experiments/libheif-js?tab=readme-ov-file

and example of how to run this library https://github.com/strukturag/libheif/blob/gh-pages/index.html

 

And another js library https://alexcorvi.github.io/heic2any/

 

Alternate, for java, refer here using ImageMagick. Examples are provided. So you ll write a transformer servlet similar to NamedImageTransformer.

Create servlet, that ll process image urls having specific extension like <image>.heictransform; the servlet will load the raw image into ImageMagick, transform and return jpg binary that can render on browser. 

 

I didn't find any direct adobe solution. But looks straight to use ImageMagick, transform and render. 

 

 

kautuk_sahni
Community Manager
Community Manager
February 10, 2025

@sekharbu1 Did you find the suggestion helpful? Please let us know if you need more information. If a response worked, kindly mark it as correct for posterity; alternatively, if you found a solution yourself, we’d appreciate it if you could share it with the community. Thank you!

Kautuk Sahni