[SalesForce] Combine two different PDFs in single Visualforce page

I have used below visualforce code to display two pdf in a single page but in the result, I am getting two different PDFs with two sections with iframe.

Is it possible to combine these two PDFs in single PDF ?

mainPage

<apex:page renderAs="pdf">
    <apex:include pageName="POC_PDF1"/>
    <apex:include pageName="POC_PDF2"/>
</apex:page>

POC_PDF1

<apex:page >
    This is PDF1
</apex:page>

POC_PDF2

<apex:page Controller="xyzController">
    <iframe src="data:application/pdf;base64,{!pdf}" height="1000px" width="100%"/>
</apex:page>

Apex code :

public class xyzController {

   public xyzController(ApexPages.StandardController controller){}

   public ContentVersion conVersion {
       get {
           conVersion = [SELECT VersionData, FileType FROM ContentVersion WHERE ContentDocument.Title = 'PDF_081108' AND IsLatest = true];
           return conVersion;
       }
       private set;
   }

   public String pdf {
       get {
           return EncodingUtil.base64encode(conVersion.VersionData);
       }
   }
}

Best Answer

Added based on comments

You need not use iframe. Instead you can return the url based on ContentVerionId and render image/pdf:

pdf2 page:

<apex:page controller="poc" renderAs="pdf" >
    <div style="background:red;color:white;">
        This is PDF page 2
    </div>
    <img style="width:600px" src="{!pdfImgUrl}" />
</apex:page>

its apex controller:

public ContentVersion conVersion {
    get {
        conVersion = [SELECT Id, VersionData, FileType FROM ContentVersion WHERE ContentDocument.Title = 'PDF_081108' AND IsLatest = true];
        return conVersion;
    }
    private set;
}

public String pdfImgUrl {
    get {
        return '/sfc/servlet.shepherd/version/renditionDownload?rendition=ORIGINAL_Jpg&versionId='+conVersion.Id;
    }
}

OLD ANSWER

iframe will not work as it creates totally separate DOMs. You should use apex:include which will:

The entire page subtree is injected into the Visualforce DOM at the point of reference and the scope of the included page is maintained.

You can try with 2 options:

OPTION 1: Join 2 pages and then render as PDF

MainPage.vfp:

<apex:page renderAs="pdf" >
    <apex:include pageName="POC_pdf1"/>
    <apex:include pageName="POC_pdf2"/>
</apex:page>

POC_pdf1.vfp:

<apex:page  >
    <div style="background:blue;color:white;">
        This is PDF page 1
    </div>
</apex:page>

POC_pdf2.vfp:

<apex:page  >
    <div style="background:red;color:white;">
        This is PDF page 2
    </div>
</apex:page>

OPTION 2: Create 2 separate PDFs and join them in main page:

MainPage.vfp:

<apex:page >
    <apex:include pageName="POC_pdf1"/>
    <apex:include pageName="POC_pdf2"/>
</apex:page>

POC_pdf1.vfp:

<apex:page renderAs="pdf" >
    <div style="background:blue;color:white;">
        This is PDF page 1
    </div>
</apex:page>

POC_pdf2.vfp:

<apex:page renderAs="pdf" >
    <div style="background:red;color:white;">
        This is PDF page 2
    </div>
</apex:page>
Related Topic