+ Start a Discussion
Michael Clarke 16Michael Clarke 16 

Unable to display external image on vf page

I have photos in Google Photos and have whitelisted https://photos.google.com and https://photos.app.goo.gl.

On the object Plant_Image__c I have a field Photo_URL__c that contains the URL of the photo that is shared in Google Photos.

I am building a vf page to add to a lightning record page for the Plant Image object.

How can I get the image in Google Photos to show on the vf page?
I have tried iFrame with image and image on its own.
<apex:page standardcontroller="Plant_Image__c" showHeader="False">
    <apex:image alt="{!Plant_Image__c.Plant_Name__c}" height="400" url="{!Plant_Image__c.Photo_URL__c}"/><br/>
</apex:page>

User-added image
ANUTEJANUTEJ (Salesforce Developers) 
Hi Michael,

Can you try checking the below link that shows an implementation of showing an image from an external source in a visualforce page, please find the code in the link below for quick reference:

Link: http://dhawalsaiya-salesforce.blogspot.com/2012/01/displaying-images-in-visual-force-page.html#:~:text=The%20image%20can%20be%20displayed,%3A%20%22%20%2Fservlet%2Fservlet.
Controller:

public with sharing class ImageController {
 public String imageURL{get;set;}
   
  public ImageController()
  {
    imageURL='/servlet/servlet.FileDownload?file=';
    List< document > documentList=[select name from document where 
                                    Name='SamplePic'];
   
    if(documentList.size()>0)
    {
      imageURL=imageURL+documentList[0].id;
    }
  }
}



Visualforce page:

<apex:page controller="ImageController" showheader="false" sidebar="false">
 
    <apex:form>
      <apex:image url="{!imageURL}">
    </apex:image></apex:form>
 
</apex:page>

I hope this helps and in case if this comes handy can you please choose this as best answer so that it can be useful for others in the future.

Regards,
Anutej
Abhishek BansalAbhishek Bansal
Hi Michael,

Please use the value tag in image tag like this:
<apex:image value="{!Plant_Image__c.Plant_Name__c}" height="400" /><br/>

Let me know if this works for you.

Thanks,
Abhishek Bansal.