Geek Answers Handbook

Create a PDF file from a web application

I need to create a pdf file from the current screen in my webapp. Some kind of screenshot, but I ran into serious difficulties.

The main problem is that the view contains a grid created using jQuery Gridster; and some widgets contain complex elements such as tables, charts, etc.

So plugins like jsPDF or html2canvas cannot display my page in PDF format. They always generate emptiness.

This is what the page looks like. You can / move the size of each element: (Sorry for the CIA style, but there is business data there)

img

Some ideas I came up with but don't work:

  • Using the print-to-pdf browser function is programmatic. (Can not)
  • Use phantomjs . (but questions about the state of the page, therefore ...)

I believe that the solution to this problem can be widely accepted by anyone who is trying to create an img PDF file from the current screen in a web application. Pretty unresolved issue.

This is normal if it only works on Google Chrome.

Many thanks.

EDIT:

One of the possible solutions may be to find a way to present the current state of the layout with the object and save it with and id.

Then retrieve this object using the url parameter with identifier and apply the saved layout to the original page.

That way I could take a screenshot with phatomjs , but to me it seems rather complicated. Any alternative?

+6
source share
1 answer

Based on the fact that you are struggling with capturing dynamic content, I think that at this point you need to take a step back and see that you may need to change your approach. Is the reason these plugins fail because they will only work with HTML before interaction?

Why not convert HTML to .pdf on the server side? But the key part is here: send the current HTML back. By sending it back, do you send the updated static HTML back to the server, which will be displayed in PDF format? I have used HTML in the PDF format from the server side before, and it works fine, so I don’t understand why this is not suitable.

For more information on the HTML server side on the PDF side, see.

+3
source

More articles:


All Articles