11

I need to view/generate PDF in Lightning component. How can I achieve that?

Do I have to user VF page with "renderAs" attribute inside Lightning Component? Or is there any other way to achieve this?

4 Answers 4

12

There are two methods to show a PDF in Lightning Component.

  • First, you can create a Visualforce page and embed it in the Lightning component. See detailed example here

  • Second is, usage of PDF.JS library to directly use lightning component to display the PDF. See details here .Entire source code can be found here.

Let me know if this helps!

4
  • How can I embed VF page in lightning? I am unable to see any output when I use <iframe> tag to include VF page.
    – user36778
    Commented Jan 18, 2018 at 9:23
  • Example at this link didn't help? vermanshul.com/2017/07/… Commented Jan 18, 2018 at 9:28
  • The link was helpful. But how can I use it in lightning components? The example you mentioned makes use of lightning component in VF page. What I need is to generate/view PDF from lightning component.
    – user36778
    Commented Jan 18, 2018 at 11:15
  • What abt second option? Commented Jan 18, 2018 at 13:17
3

You can embed a vfPage (renderas="pdf") in lightning component and utilize the component in required place.

<aura:component implements="flexipage:availableForAllPageTypes,force:hasRecordId" access="global" >
<iframe src="{! '/apex/pdfPage'}" width="100%" height="500px;" frameBorder="0"/>

Hope it helps!

0

As of 2020, I'm having good results with the lwc viewer at github.com/annyhe/pdfViewer Doesn't require visualforce

1
  • While this may theoretically answer the question, it would be preferable to include the essential parts of the answer here, and provide the link for reference.
    – identigral
    Commented Jan 21, 2021 at 2:15
0

You can also check the below PDF viewer which works well in all scenarios.

https://hellosnl.blogspot.com/2019/10/pdf-reader-as-salesforce-lightning-web-component.html

This is based on PDF.js library to render a PDF document inside an iframe. Code is provided in the github repo, the link of which you can get in the blog post.

3
  • Tried using this solution and it doesn't seem to work. Posted the question about same here salesforce.stackexchange.com/questions/354812/…. Would love to have some guidance regarding this
    – N_H1922
    Commented Aug 24, 2021 at 9:35
  • This still works. Please check your code again.
    – nica
    Commented Aug 27, 2021 at 17:55
  • Whilst this may theoretically answer the question, it would be preferable to include the essential parts of the answer here, and provide the link for reference.
    – identigral
    Commented Oct 27, 2023 at 18:27

You must log in to answer this question.

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