I’m working on a Napili based community where we want to display images that are stored in SF Files to unauthenticated users. For example, we have some articles stored in custom objects (Knowledge for Lightning not quite meeting our requirements yet), each of which has an image file for its header. So, we want to make that image publicly available.
I’ve seen questions such as this:
Display an image stored in ContentDocument (in lightning experience)
Which works for logged in users, and is similar to my solution, but doesn’t quite solve my issues.
My method was to make a Content Distribution for each image that we want to share. When an internal user uploads a File for use like this, a trigger creates the Content Distribution for them and saves the URL to the article record. The URL ends up being something like this:
Then, I can just use that as the src for an <img> tag.
Which is sort-of fine. But, we are also using these images in a Javascript carousel which rotates selected articles every few seconds. That carousel relies on the browser being able to cache the image, but the way the link above works, the browser does not cache the image. So, the image is being downloaded every few seconds.
This is bad for mobile users, and we suddenly have to care about the limit where only 20k downloads are allowed via Content Distribution per 24 hours.
I had a look at this question:
How to set public inline images in Knowledge Base Article
Which might give us an alternative to Content Distributions, but it would probably still be downloading the whole image every time for mobile users.
Is there a good way to deal with this scenario? We’re looking at bringing in a CDN to do the caching for us. It seems like some of these issues are a bit new to SF communities, so there might not be an answer inside SF. I’m interested to hear of any approaches that people have used….
Answers:
Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.
Method 1
No-one has had any better thoughts, so we have gone with using CloudFront as the CDN to do the caching for us.
The Salesforce Content Deliveries are created automatically by Apex, as suggested above. Then, we have registered the content URLs (https://c.cs84.content.force.com and so on) with CloudFront. The URL parameters are passed through from CloudFront to SF, so there’s no need to set anything up on a per-image basis. This means that where I was using a URL like this:
I now used the cached version like this:
Oddly, it seems that our carousel code is still downloading the image on every rotation when I look at the community through the “preview” button in community builder but does not do so on the published site.
So, this seems to solve our issues but doesn’t feel very tidy. I’ll leave the question open for a bit to see if there are better answers, otherwise I’ll take my solution as the best one we have for now.
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0