On an AEM 6.4 site, I am trying to allow authors to upload SVG images to an image component.
The dialog that accepts the image is:
The component simply takes the URL of the uploaded image and places it into an image element.
When the author uploads the image, it displays in the dialog fine, and the image uploads normally. However, when the component is rendered, or when the dialog is re-opened, Chrome throws an error loading the image if I use a full path to the asset. This is because either the image is served with the header: Content-Disposition: attachment or the request fails with a 500 (image type not supported) .I completely understand the role that the content-disposition filter plays in security of the DAM, and I don't want to disable it, but there doesn't appear to be a way to disable that security for a specific mime-type.
Here's what I've tried:
- Online, a lot of people talk about configuring the Apache Sling Content Disposition Filter. This does not work, because the filter does not permit wildcards, and I can't specify every path of every SVG asset that will be uploaded.
- I looked into the Adobe CQ DefaultAttachmentTypeBlacklistService, as it seems like it might be related, but removing SVG from the blacklist there did not resolve the problem.
- I tried using the built in image component, but it doesn't support SVGs.
- I tried using the default GET for images, like at the URL .../_jcr_content/par/al_container/al-container-par/al_image_content/al_image_content.img.png, I changed ".png" to ".svg": al_image_content.img.svg, but I get a 500 error saying the image type is not supported.
All I need is for an author to be able to upload an SVG and have AEM serve that SVG back properly. There must be a way to do this. Anyone have any ideas?
So i logged a day care ticket(#152132) and Adobe mentioned its a bug/known issue, SLING-7525 missing content-headers, they mentioned the response header is missing Content-Type,
Binary Provider Overlay servlet as workaround was suggested but it didn't help.
So suggestions provided by adobe:
- Upload PNG and reference PNG
- Modify code to work on similar to Image compoennt
I preferred using using rendition of svg
Hi there, I got the same problem.
When using SVG files in AEM 6.4, the image is not displayed in Chrome. In Firefox it displays correctly.
Chrome actually thinks it is a downloadable file instead of an image.
AEM should be returning “Content-Type:image/svg+xml” but it is actually returning “Content-Disposition: attachment; filename="yt.svg"”.
Is there any solution to this?
I know I can use PNG but it is an annoying problem. It is a very basic thing.
It looks like a bug in 6.4 , here are the suggestions i have received from adobe,since 6.4 rendered svg assets with OOTB image component(drag drop image to the component), mockup your component to do what image component does, or use png, i used the png/jpeg from the renditions folder