PDF - Steps (that a low code user understands) to create a pdf using a 3rd party

Wappler General How To
, , ,
#1

I’ve been using Wappler for a couple of years now and it is an excellent low code development tool. I have for the past year or so been trying to work out how to generate a pdf from a webpage / report that i have created that is built from a significant number (10+) server connects, images and charts.
Whenever the subject of pdf generation is raised in the community it normally gets a response that there are a number of third parties / APIs that will do the job.
An observation is that the experts who respond suggesting 3rd parties seem to be quite expert and at least from my perspective start talking about things that I am not very aware/proficient at. One of the reasons i like wappler and use it is the low code promise but in this case at least my perspective is that trying to get a 3rd party to generate a pdf with data being generated from mysql db queries is beyond my low code capability.

My ask - is it possible for someone to spell out exactly the steps that are required to generate a pdf from a web page that has the following components:

  • multiple server connects
  • ApexChart - charts
  • images (from a sql query)
  • reasonable level of security as the data will be company confidential
  • im using nodejs, heroku, mysql and the latest wappler version

I suspect that if a guide which covers all the steps that a low code user (like myself) can understand and create would remove the background rumble of pdf questions and requests.

As an indication of what Ive tried:

  • server side API action
  • server side EJS to PDF (adding puppeteer)
  • client side API - Action, Data Source and Form
  • 3rd parties - DocRaptor, PDFMonkey and others

Would really love to find a way to do this.

Thanks in advance

#2

For generating PDF invoice I used

PDF make might look complicated (which is true to be honest) but instead you will get a lot more customization options.

For instance:

  • Footer and header options
  • Watermarks
  • Automatic page counter
  • Programmable options (like insert fooder and header only from page 2)
  • pdfmake has a great playground where you can test and visually see all your PDF - http://pdfmake.org/playground.html
#3

Thanks , very happy to try another 3rd party but do you have or could you create a step by step guide on how to do this?

As an example what should the report/template (that you want to convert to a pdf) look like - can you use multiple queries to populate it? should you use the API Form which i tried and it generated probably over a 100 fields but then i got lost !!

#4

What I wrote above is not about converting WEB page to PDF it is generating PDF based on Wappler APIs outputs.
Unfortunately there is no step-by-step instruction which will lead do desired result.

I would suggest you to read how to create custom extension in Wappler - Writing Custom Modules and Formatters (NodeJS)

#5

Your question seems a bit confusing.
you want a server side PDF generator?
You want to include Apex which is a client side technology?

#6

Hi Brian,

Thanks, from your response i can now rule out using server side PDF generation, but the ask is still the same.
I have a number of reports/web pages - see attached screenshot / example of the type of pdf i would like to automatically generate, adding header, footer etc information.

Thanks

report160922
report160922377×843 81 KB

#7

I confess, unless there was a huge number to generate i would create the page, flag non printed elements from printing and then simply use the print to PDF feature of OSX/Windows and manually email to clients but I guess you need a fully automated solution

#8

I do really…although the stop gap is to have a help button which informs clients that they can get a pdf of the report by using the browser print capability but this cant be a long term solution.

#9

It could be a long term solution if done correctly. The print button for each browser is in a different location. Therefore it is best to create a print button that emulates the browser’s print button by adding onclick="window.print();return false to the button.

To format a printed page, use the CSS3 Paged Media (@page rule).

The problem is that not all browser have incorporated Paged Media. The uptake is about 70% which is too low for general use.

Along comes Page.js a polyfill for non-complying browsers.

For more,
https://ashok-khanna.medium.com/beautiful-pdfs-from-html-9a7a3c565404

This is what a dynamically created PDF-preview looks like in Wappler

image
image1920×1049 123 KB

If you want to try it out, don’t forget to add async when loading the polyfill for a dynamic page.

<script async src="https://unpkg.com/pagedjs/dist/paged.polyfill.js" defer></script>
2 Likes
#10

Excellent many thanks Ben … Will give it a go

#11

hav eyou tried using this - you can pass URL of your page to generate a PDF from it. depending on your page load time, you can add wait time as well within the custom module code.

its not fully no-code solution. but with little effort you can have nice solution. we’ve used this for complex chart based PDF generation with images being fetched from private S3 source - works well.

1 Like
#12

Thanks Nishkarsh, will give it a go

#13

Hello,

If you can install libraries on your server try out wkhtmltopdf.

It is probably the most widely used tool to convert html to pdf. It also has command line interface so you can do shell execute on server.

https://wkhtmltopdf.org/

I have never used it directly but there are a few open source EPRs build in Python that use this extensively.

HTH