Most used approach to generate a PDF report (JavaScript, node.js)?

Question

Can anyone who worked on something like this describe the general process? I'm very confused right now. By report I mean a visually appealing document with logo, tables, headers and footers, and the data will be retrieved dynamically.

The approaches I looked at are:

1. Use a server side library (node.js module) that generates the PDF. Send the string representation as response with Content-Type: application/pdf. Problem: I chose PDFKit, but it doesn't work and no content shows up at all. It uses PDF 1.3, which is old.

2. Generate PDF on client side. Problem: Most popular library seems to be jsPDF, but it's not very capable of producing sophisticated-looking documents.

3. Write template in PDF source code and fill in the data on server side. Problem: The encoding is weird, for example if I just do doc.text("1"), a lot of unrecognizable characters appear for just the string "1". I'm very confused about this.

Finally, it'll be super helpful if anyone provides a link that can help me understand the encoding! It's super confusing to me.

Any experience with similar tasks is much appreciated!

Solution 1

I haven't personally done this, but the first thing I would try would be:

1. On the server side dynamically build the appropriate HTML document and CSS
2. Use phantomJS to render that document
3. Tell phantomJS to convert that document to PDF, saved in a temp file
4. Send the PDF back as the HTTP response by writing the temp PDF file to the response body
5. Delete the temp file

If you are struggling with content-type, content-disposition, etc, you shouldn't have to worry about that if you have a valid pdf file on disk and just write that data to the HTTP response. With the right headers, you should be able to ask the browser to either display the PDF or treat it as a file to be saved as a download.

Solution 2

As the member of jsreport team, I would give it a shot.

jsreport platform provides multiple ways how to generate pdf reports. The most common included one is to transform html into pdf using headless chrome. jsreport will also compile and render handlebars or jsrender html templates if its specified, it can embed images, add header/footer, run custom javascripts and more.

You can play with the examples and see the options you have https://playground.jsreport.net

When you are done with playing, you can use jsreport online or download and install jsreport server to your company. Then you are ready to call its REST API and generate reports.

More to your question

• jsreport will provide correct content-type in the response for pdf or html. You can just let the browser to display the result
• data can be sent to jsreport api or retreived by custom script

Solution 3

I'm not sure what the most common approach is, but personally I like to create an HTML template, populate it in my server-side code, and then use wkhtmltopdf to convert the HTML into a PDF. If you're using .NET you should check out WkHtmlToXSharp (which is a .NET wrapper for wkhtmltopdf.)

Comments

[Dan Dascalescu]

See also JavaScript PDF generator library.

[jawath]

@DanDascalescu link's post has been removed

[Dan Dascalescu]

@jawath: that question was deleted by SO mods as "off topic", because just closing it wasn't enough. Please direct complaints to the moderators such as mureinik.

[Valentin H]

jsreport is a great tool, but unfortunately with very little documentation. I wonder, why are there no examples provided how to use it with curl or from another website. In particular I'm trying to deploy jsreport to run in the background, access it from my nodejs-based apps and deliver a pdf to the user.

[Nishchit]

How much it will take for 1000 html page with 1gb RAM ?

[Shinjo]

Can you please elaborate about the API? I don't seem to understand how to use the API to render report made in the editor, also how to import external API for the JSON data.

[Cristian Zumelzu]

Also only support NodeJS v16 or higher