12

Can you embed or implement a visualforce page inside of a lightning component?

For example I do a load of HTML, Javascript and angular and embedding inside a visualforce, then however with a lightning component implement the visualforce page inside of the lightning component?

So when I put the lightning component into the salesforce1 app - I can then see all the code for the visualforce page?

2

3 Answers 3

10

Yes you can. The linked post gives a wider tutorial, but the code you likely need is below. Note, here I have added recordId to my example as it is common that the VF page needs a reference to the record. Other parameters can be passed in a similar way.

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,force:hasRecordId" access="global">
    <iframe src="{! 'https://my-demo--c.eu11.visual.force.com/apex/MyVisualforcePage?Id=' + v.recordId }" width="100%" height="500px;" frameBorder="0"/>
</aura:component>
6

You can use iframe to expose your visualforce pages within a lightning component.

you can check out this link for more details:

UPDATED Link(thanks to @Trevor): https://github.com/salesforcejeff/jargon/blob/master/articles/iFramecomponent.md

I would recommend doing this only if you have an existing visualforce page that you want to reuse, but if you're starting from scratch might as well use a full lightning implementation.

1
0

If the iframe turns out blank it might be Salesforce's clickjack protection in settings.

https://help.salesforce.com/articleView?id=siteforce_clickjacking_enable.htm&type=5

You can temporary turn it off to test by going to Setup -> Session Settings -> Clickjack Protection.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .