You need to sign in to do that
Don't have an account?
Sarah Dickinson
Images not rendered in Visualforce PDF
Hi,
I am having issues with the rendering of images in a Visualforce PDF.
ll my product images are stored on a server and are accessible at the URL http://images.metropuzzle.com/IMG2/[PRODUCT CODE]_IMG2_L.jpg
E.g. http://images.metropuzzle.com/IMG2/NPZPD1703_IMG2_L.jpg
When I try to use those URL in <apex:image> it does not render the image in the PDF...
As I am trying to track down the issue, I found something very odd.
For this simple test I am using one of my product image, and an image I found online, the URL is http://investor.salesforce.com/files/design/newlogo-company.png -- This URL seems to redirect to the URL http://s1.q4cdn.com/454432842/files/design/newlogo-company.png
I am building the PDF with the Visualforce code below:
It does not render my product image, and for the image I found online it only renders the first one, not the second one. But it is the same image!
Would someone have any idea why this is not working?
Thanks a lot!
I am having issues with the rendering of images in a Visualforce PDF.
ll my product images are stored on a server and are accessible at the URL http://images.metropuzzle.com/IMG2/[PRODUCT CODE]_IMG2_L.jpg
E.g. http://images.metropuzzle.com/IMG2/NPZPD1703_IMG2_L.jpg
When I try to use those URL in <apex:image> it does not render the image in the PDF...
As I am trying to track down the issue, I found something very odd.
For this simple test I am using one of my product image, and an image I found online, the URL is http://investor.salesforce.com/files/design/newlogo-company.png -- This URL seems to redirect to the URL http://s1.q4cdn.com/454432842/files/design/newlogo-company.png
I am building the PDF with the Visualforce code below:
<apex:page renderAs="PDF"> <div class="productGridContainer"> <div class="productGridItem"> <div> <apex:image value="http://images.metropuzzle.com/IMG2/NPZPD1703_IMG2_L.jpg"/> <apex:image value="http://investor.salesforce.com/files/design/newlogo-company.png"/> <apex:image value="http://s1.q4cdn.com/454432842/files/design/newlogo-company.png"/> </div> </div> </div> </apex:page>
It does not render my product image, and for the image I found online it only renders the first one, not the second one. But it is the same image!
Would someone have any idea why this is not working?
Thanks a lot!
1. Save Your Images in " Static Resource " and call From visualforce page like below
I Think This Code should help , Please let me know if you have any doubt's.
Regards,
Soundar
Thanks Soundar!
My issue is that all the product images live on a different server, and maitaining them on that server and as static ressources would be a lot of extra work.
I still don't understand why sometimes the image is displayed and sometimes not when using external URLS... There is not documentation from Salesforce on that issue.
1. Shopify: https://cdn.shopify.com/s/files/1/0337/5853/products/rgb-HP1361-3D2-1000px-300dpi_medium.jpeg
2. Company FTP: http://images.metropuzzle.com/tmp/rgb-HP1361-3D2-1000px-300dpi_medium.jpeg
3. Dropbox: https://www.dropbox.com/s/al3yzly3m4dqgzb/rgb-HP1361-3D2-1000px-300dpi_medium.jpeg?dl=1
The Shopify Image displays correctly but not the other two...
Why is that??
First image is displaying because it's came from "Content Delivery Network" . Sometimes Salesforce doesn't allowed external Link form Server.
A Best idea is , You could save that images in static resources and call through static resources. If you have More concern please contact via my whatsup Number +91 - 7418425418 (or) mail me @ sourajking@gmail.com
Regards,
Soundar.
Thanks Soundar! I also tried the same test with the same images hosted on Amazon S3, and the image is not dispayed.
If Salesforce does not allow some external URLs and allows others it would be nice to have that documented. Also, if you are not a premium support customer you cannot even create a case for that kind of issue, but I would really like to have Salesforce weighing in with a definite answer on that issue.
I can see that static resources is the solution in some instances, but we already store thousands of product images on a different server and would like to be able to re-use that to generate the PDFs. It would not make sense to replicate the whole image library in Salesforce as static resources, and I don't even think we would have enough storage for that...
The problem indeed looks a bit complex, as the complexity of the modern security mechanisms over the Internet protocols. Let's try to bite it!
First of all please make sure your CDN host is whitelisted in the Remote Site Settings under Setup > Security Controls. This will allow Salesforce to connect with the remote server for the resource.
There is however a 2nd mechanism called CORS that prevents using resources that the owner (in your case - images.metropuzzle.com) does not meant to reuse in other domains. This means by default you can use your images only in the same domain (metropuzzle.com) and Salesforce rendering engine may block them. To overcome this, try to reconfigure your HTTP server so as it responds with an additional header (you may even want to limit the list of servers to Salesforce):
Please let me know if this works for you!
As per your requirement the images to be displayed on VF PDF are stored as a attachement record in Salesforce system.
All you need to do to access the image is via the record ID using below URL format as below.
https://<your domain>/servlet/servlet.FileDownload?file=<recordID>
Please try the below code:
Thanks
Akshay
I'm having a similar issue except all my images are stored as contentVersions on the SF server. I'm trying to iterate and display all images with a linked Id matching the record Id.
@Sarah did you happen to get yours to work?
You should go with the static resource. Try the below code it will work. I hope you find the solution helpful. If it does, please mark as Best Answer to help others too.
Thanks,
Ajay Dubedi
We have had this issue in getting an image, saved as a file to load to visualforce page rendered as PDF. It now shows a broken link image.
We used the /sfc/servlet.shepherd/version/renditionDownload?rendition=THUMB720BY480&versionId=<ContentVersionId> URL in the src attribute of <apex:Image> tags to display images on the page, which unexpectedly stopped working. Images rendered with the above URL (with a valid ContentVersion ID) resulted in a broken image.
To resolve this, these links were replaced with /sfc/servlet.shepherd/version/download/<ContentVersionId>, which allowed the images to properly render on the page.
This started happeing late last week around 1/17/2020, there were no code changes.
Any feedback would be greatly appreciated.
Thanks
I too am having issues. A couple of external sites, dropped all components due to an update in Winter 20 relating to profiles which had Custom Meta Data. Once added to the profiles, this brought in elements back into the EOL Letter we are producing.
Having said this, one URL will pull through images into the document with no issue, however another URL isn't able to pull through their images into the same document. Any ideas one why this would be?
The URL's are correct in the remote site settings, but I am unaware of any other critical updates which may impact the image rendering when the Visualforce page built denotes "renderAs"=PDF
Any ideas would be apprecaited.
Cheers
Shaun
I've faced this problem recently and managed to solve it using "ContentDistribution" object. I will try to describe steps taken:
1. First modify your user/s profile and enable "Create delivery content" under administrative permissions
2. Create new contentDistribution object, associating your contentVersionId on the related field (same name)
3. Once created, this object will have fields with a public URL where you can access your file ("ContentDownloadUrl" and/or "DistributionPublicUrl")
Use publicURL on your VF and you'll see it is, at last, rendered.
It was a very tought problem for me to solve, but I've managed to get it working.
Regards,
Alex