Add an image on External Document formats like EXCEL/PDF/WORD
Overview: This Blog holds the solution related to a problem of adding/displaying an image on External Documents like EXCEL/PDF/WORD from any image stored in documents of your Salesforce ORG.
Problem: While adding an image on any of the formats above mentioned, the image was not displayed, instead, an error message is displayed, “This Image cannot be displayed”.
Solution: The possible solution was that the image while after being referenced in the external the document requires authentication outside our Salesforce Org. Explanation: I came across a requirement, for adding an image to the external document like EXCEL/PDF/WORD that has been saved in DOCUMENTS of a Salesforce Org. The very common idea is to use the URL of the image stored in Documents and attach it in “<apex: image>” tag. But while using URL of the image stored in Documents, I came across an error. “This Image cannot be displayed”.
While code was:
<apex: image url =https://c.ap5.vIsual.force.com/resource/1520943880000/Img1 .png alt=”No Image”/>
Reason for Error:
For any document saved in Documents in our Salesforce Org, for accessing that particular file, we need to have authentication from the Salesforce Org itself. Because if we open the same URL of the document on some other browser, we are asked for LOGIN ID and PASSWORD, which very well explains the above-quoted reason, how authentication is required outside your Salesforce Org.
Solution:
For any document saved in our Salesforce Org in Documents, for accessing that particular file externally on a document, follow the step by step procedure.
Conclusion:
Hence, to access any uploaded file in Documents of the org, can be accessed public-ally, i.e. outside our Salesforce Org. To remove the authentication problem all we need is to use the “oid” or Organization ID along with the URL of the file to be accessed.
Problem: While adding an image on any of the formats above mentioned, the image was not displayed, instead, an error message is displayed, “This Image cannot be displayed”.
Solution: The possible solution was that the image while after being referenced in the external the document requires authentication outside our Salesforce Org. Explanation: I came across a requirement, for adding an image to the external document like EXCEL/PDF/WORD that has been saved in DOCUMENTS of a Salesforce Org. The very common idea is to use the URL of the image stored in Documents and attach it in “<apex: image>” tag. But while using URL of the image stored in Documents, I came across an error. “This Image cannot be displayed”.
While code was:
<apex: image url =https://c.ap5.vIsual.force.com/resource/1520943880000/Img1 .png alt=”No Image”/>
Reason for Error:
For any document saved in Documents in our Salesforce Org, for accessing that particular file, we need to have authentication from the Salesforce Org itself. Because if we open the same URL of the document on some other browser, we are asked for LOGIN ID and PASSWORD, which very well explains the above-quoted reason, how authentication is required outside your Salesforce Org.
Solution:
For any document saved in our Salesforce Org in Documents, for accessing that particular file externally on a document, follow the step by step procedure.
- Open Documents on your Salesforce Org
- Select whichever file is to be used externally
- Now either press “Ctrl + Shift + I” to open “Inspect Element” or right click on the Image and click on INSPECT. After opening INSPECT Element you’ll come across a page like : –
- Now copy the URL from “src” attribute given in the “<img>” tag, as this URL contains a unique “oid”, which is ORGANIZATION ID. This “oid” provides an authentication to access the image file outside org.
- Now in codes, we can use image Url either directly in “<apex: image>” tag, by passing the above-selected Url from Inspect Element in “URL” attribute of “<apex: image>” tag or using “<img>” tag and passing URL directly in “src” attribute.
<img src=”https://c.ap5.content.force.com/servlet/servlet.ImageServer?id=0157F0000002hDx&oid=00D7F000005VpIm&lastMod=1520949532000″/>
<apex: image url=”https://c.ap5.content.force.com/servlet/servlet.ImageServer?id=0157F0000002hDx&oid=00D7F000005VpIm&lastMod=1520949532000″/>
- Another method to access is using getter/setter: –
ImgStatic = ‘https://c.ap5.content.force.com/servlet/servlet.ImageServer? id=0157F0000002hDx&oid=00D7F000005VpIm&lastMod=1520949532000’;
Conclusion:
Hence, to access any uploaded file in Documents of the org, can be accessed public-ally, i.e. outside our Salesforce Org. To remove the authentication problem all we need is to use the “oid” or Organization ID along with the URL of the file to be accessed.
