+ Start a Discussion
aq_devaq_dev 

renderas PDF does not render images

Hi All- 

I have a visualforce page with images that I need to render as a PDF. The images come from a formula field and display fine if I remove renderAs="pdf". However when I put it back, the PDF shows broken images. The VF page code is below. Note that the image field is actually a formula field that creates the entire html img element with src.
 
<apex:page standardController="Opportunity" recordSetVar="SelectedOpportunities"> 
    <apex:variable var="number" value="{!0}"/> 
    <apex:repeat value="{!selected}" var="SelectedOpportunity">
     <apex:outputText rendered="{!MOD(number,8)==0}"><p align="center" style="{!IF(number!=0,'page-break-before: always;','')}"></p></apex:outputText>
    <apex:variable var="number" value="{!number + 1}"/> 
    <apex:outputText rendered="{!MOD(number,2)==1}"><div style="width:350px; float:left; border:1px solid black">
<table><tr><td width="200px" height="200px"><apex:outputtext value="{!SelectedOpportunity.Student_Image__c}" escape="false" /></td>
    <td width="150px" height="200px"><span style="font-weight: bold"> {!SelectedOpportunity.Full_Name__c} </span> <br /> 
    {!SelectedOpportunity.City__c}, {!SelectedOpportunity.State__c}  {!SelectedOpportunity.Country__c}<br />
    {!SelectedOpportunity.Voyage_Code__c}</td></tr></table></div></apex:outputText>
    <apex:outputText rendered="{!MOD(number,2)==0}"><div style="width:350px; float:right; border:1px solid black">
<table><tr><td width="200px" height="200px"><apex:outputText value="{!SelectedOpportunity.Student_Image__c}" escape="false"/></td>
     <td width="150px" height="200px"><span style="font-weight: bold"> {!SelectedOpportunity.Full_Name__c} </span> <br /> 
    {!SelectedOpportunity.City__c},{!SelectedOpportunity.State__c}  {!SelectedOpportunity.Country__c}<br />
    {!SelectedOpportunity.Voyage_Code__c}</td></tr></table></div></apex:outputText>
</apex:repeat>
</apex:page>

Anyone have any ideas how to fix this? I've disabled the security checking for remote sites and that does not work either.
 
Andy BoettcherAndy Boettcher
When you use the PDF engine - any client-side processing is killed (javascript, DOM manipulation, etc,) - Can you try shifting your formula field to just be the URL to the image and put those in apex:image tags?
aq_devaq_dev
Hi thanks for the response. I've tried that as well and have the same results. Any other ideas?
Andy BoettcherAndy Boettcher
Are the link URLs relative or absolute?  You can try making them absolute and see if that helps?
aq_devaq_dev
They are absolute to an externally hosted image repository. I tried both http and https to no avail as well. What I can't understand is why they do show when the page renders as html but not when it renders as pdf.
Arunkumar RArunkumar R
Hi,
 
<apex:page standardController="Account" renderAs="pdf">

<apex:image url="http://investor.salesforce.com/files/design/newlogo-company.png"/>

<apex:image url="{!Account.Stundent_Image__c}"/>

</apex:page>

The above example, i have refered the public source image. Both are working, one is direct url and another is formula. Can you try some think like above?
aq_devaq_dev
Hi- Thanks for the reply. I tried a few things and I found that the image you posted above does work, but images coming from my domain don't. Is there something I need to do to allow pulls from my domain?
Arunkumar RArunkumar R
Hi,

Make sure, your images accessible by public or else try to upload the image in static resource and refer from there.
Lewis ReedLewis Reed
It is good practice to save all your images as a resource within salesforce, as the URLs can change and you may then lose your link to the image.

Plus its alot easier to keep track of everything that way too.

If your having any more problems with the render as PDF function let me know, (if your wanting to create a header and a footer etc.)
aq_devaq_dev
Thanks for the replies. If I make them static images I won't be able to access them easily outside salesforce. So I'm not sure that works. The pdf version worked in january. Does anyone know if something changed then? Also on permissions. I think they are fine based on the fact that the html version does show the images. If anyone is interested in helping and is on odesk.com please post your odesk Id so I can send a note.
Jaap ScheperJaap Scheper
Hi all,
You need the right link for each context. The PDF renderer is in another context than your browser (when you request the HTML);
Here's my solution:

Visualforce:
<img src="{!baseUrlContentContextAware}/servlet/servlet.FileDownload?file={!attachmentId}" class='myImage' />
or
<apex:image value="{!baseUrlContentContextAware}/servlet/servlet.FileDownload?file={!attachmentId}" styleClass='myImage' />
And here is the related controller code that make it work for both html and pdf, and for in or outside a site context:
public String siteName {
        get {
            return 'mySiteName';
        }
    }
    public String salesforceBaseUrl {
        get {
            return Url.getSalesforceBaseUrl().toExternalForm();
        }
    }
    public String baseUrlContextAware {
        get {
            String infix = UserInfo.getSessionId() == null ? siteName : '/apex';
            String url = salesforceBaseUrl + infix;
            return url;
        }
    }
    public String baseUrlContentContextAware {
        get {
            String url = baseUrlContextAware.replace('visual', 'content');
            return url.replace('/apex', '');
        }
    }