Looking for a solution to generate a PDF embedded on the client


#1

I am currently using the nilsdannemann:pdfmake package to generate a pdf on the client and this works fairly well, minus a bit of styling limitations which I worked around. This works really great for my use case where I generated a PDF for a sales tag that can be opened in a new window and printed.

For another use case, I was looking for something similar to this but that will display the PDF embedded on the page rather than opening in a new window. I have looked into quite a few resources including PDF.js and Phantomjs…which make my head spin a little to be honest. I also like the pascoual:pdfkit, but it says it only works on server-side…which I assume would only be able to download the PDF not display it on the client. So I was hoping for something that comes as a meteor package and easy to use. But if there is a really detailed tutorial out there I could follow that would help a lot, but I haven’t found anything yet that helps out someone at my level :wink:

Does anyone have any suggestions for how to embed a PDF onto a page on the client?


#2

Check out http://pdfmake.org/playground.html for an example

If you look at the source code of that page, what it does is basically

pdfMake.createPdf(dd).getDataUrl(function(outDoc) {
  document.getElementById('pdfV').src = outDoc;
});

That means, there should be a getDataUrl(callback) functionon createPdf which gives you a dataUrl which you can provide as the src of an iframe which is basically embedding a pdf on your page.


#3

It worked! Thank you! :slight_smile:


#4

Did you have to display PDFs for users on mobile as well? and if so I’m curious how that worked out with the iframe.

Sorry for necropost


#5

We did that and it doesn’t work well. Now we use PDFs from Mozilla which works much better but needs some work to function.


#6

Did you use a meteor package or an NPM module?


#7

Custom included the code because we did not find a good and stable package. You will get some issues with the worker, that needs to be out of reach for the Meteor javascript parser. Or use a CDN.


#8

Is the performance horrendous with large documents (on mobile)?


#9

Not for us but we only have quite small documents with a few pages. In other cases it might be an issue. You can just test it, there are demo’s online to get the idea.