Does any one have idea about how to display image from files(in Lightning & API name is ContentDocumentLink)/* attachment in salesforce clasis*/ on Lightning component.

3 Answers 3


Yes, you can!

To give a brief idea how to do that,

You have to fetch the ID of the attachment from a server call and store it a aura:attribute.

<aura:attribute name="attchid" type="String" default="00P900000115nZx"/>

I defaulted it to 00P900000115nZx.

Once you have it, you can do the following.

<img src="{!'/servlet/servlet.FileDownload?file='+v.attchid}"/>
  • I am getting this error in console "lightningstrikers2016-dev-ed.my.salesforce.com/servlet/… Failed to load resource: the server responded with a status of 500 (Server Error)"
    – Shilpa
    Nov 14, 2016 at 12:17
  • if I click on that link It gives this error "Unable to Access Page The value of the "file" parameter contains a character that is not allowed or the value exceeds the maximum allowed length. Remove the character from the parameter value or reduce the value length and resubmit. If the error still persists, report it to our Customer Support team. Provide the URL of the page you were requesting as well as any other related information"
    – Shilpa
    Nov 14, 2016 at 12:19
  • Okay, make sure 06941000000SKtyAAG is the id of the Attachment record. And try to open the link in browser and see if the image opens or not, ideally it should. Nov 14, 2016 at 12:24

They way that you show Files is different than the way you show attachments. I have had success using

<img src='/sfc/servlet.shepherd/version/renditionDownload?rendition=THUMB720BY480&amp;versionId={!ContendVersionId}' />

This particular one shows a thumbnail version, which you can find more documentation about here.

  • Thumbnail URL is not working in one org, showing No preview available, any idea what is missing, same image working fine in other orgs. Sep 18, 2019 at 13:33

Another way is to first create a formula field on the Salesforce File object and query that for the image thumbnail using the parent object's ID. It's a very handy trick and can be used in a number of contexts. To do so:

  1. Navigate to Setup → Object Manager → Content Version → Fields and Relationships → New

  2. Create a new formula Field called (for example) "Field Image URL" with the following code:

    LEFT($Api.Enterprise_Server_URL_100, FIND( ".com", $Api.Enterprise_Server_URL_100 ) + 4)& "sfc/servlet.shepherd/version/renditionDownload?rendition=THUMB720BY480&versionId=" & Id & "&operationContext=CHATTER"

  3. In a query, use the dot syntax to go from the ContentDocumentLink Object up through ContentDocument through LatestPublishedVersion to retrieve the custom formula.

    SELECT ContentDocument.Latestpublishedversion.Field_Image_URL__c FROM ContentDocumentLink WHERE LinkedEntityId = '[YOUR_OBJECT_ID]'

  4. And you will have a handy image of the photo, PDF, Word Document, etc. in the file. (The same one used in previews of the document in other contexts.) And you can use it most anywhere.

Note rendition in the formula field specifies the size of the thumbnail to be generated.

Available Sizes:

  • THUMB120BY90
  • THUMB240BY180
  • THUMB720BY480

If you want to get the actual file (and not a thumbnail), modify the formula as follows:

LEFT( $Api.Enterprise_Server_URL_100, FIND( ".com", $Api.Enterprise_Server_URL_100 ) + 4)& "sfc/servlet.shepherd/version/download/" & Id

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.