I have a requirement that I need to create a PDF. For me the best way is to do it render html template and create a PDF with any third party lib. I have come across the solution which render HTML with ejs and create pdf with html-pdf. It works fine though but I had a problem with a page break.
There is a popular module pdfkit. But it uses it own concept and procedure to render pdf. For node it does not render html file but for python it does render html template.
Please tell me how can i render html template to pdf using pdfKit and also what is the best way to render html and convert to pdf ?
Thanks
Puppeteer is the best way for converting HTML to the PDF, and also for web scraping.
A short instruction for generating PDF from HTML You can see here
Also, the Chrome DevTools team maintains the library, so it is the best solution.
About the page-break. This issue can be solved in the HTML code. There is a style option for solving the issue.
style="page-break-after:always;"
The problem with using PDF converter libraries available on NPM like pdfkit is that, you gonna have to recreate the page structures again in your html templates to get the desired output.
One of the best approach to rendering html and convert to pdf is by using Puppeteer on NodeJs. Puppeteer is a Node library which provides a high-level API to control Chrome or Chromium over the DevTools Protocol. It can be used to generate screenshots and PDFs of html pages in your case.
I'm working on a tool "Resume Builder" using Vuejs. Is there any bettter way to generate pdf ( of resume ) from html with css . I have used jsPdf Library but not getting desired outcomes. I want to keep html "a" tag clickable in generated pdf. I have also tried html2canvas.js but in that "a" tag is not clickable due to image in pdf. jsPdf is generating pdf but not applying css.
I recommend you to investigate a bit different approach for generating PDF from HTML just because all the client-side libraries for HTML to PDF generation have lots of problems when generating really complex documents with lots of formatting etc.
The alternative way is to perform the PDF generation itself on the server-side. For example, you could make use of Headless Chrome managed by your backend for turning any HTML into PDF.
We used a very similar approach to implement pdf generation for this free resume builder service. The only downside we faced was that different browsers like Firefox or IE might occasionally display an HTML document a bit different than it's printed out as PDF bu Chrome. Good luck!
You might want to give Pdf Make a try.
PDF Make on Github
It has support for styling and links. But you have to do most of the styling yourself.
I found Kendo UI is the best api for pdf from DOM.
https://docs.telerik.com/kendo-ui/framework/drawing/drawing-dom
I have an html page which contains graph created with Amcharts
and I need to generate pdf of my html page. Amcharts have provided
this link for exporting html in javascript my question is there is any way to export a page from server-side i.e nodejs.
There is no such tutorial in a given site and so far I have tried phantomjs plugin but it didn't help.
Amcharts has a knowledgebase article showing how to do this. If you prefer an alternative you can try pdfmake and build up the pdf with the png's yourself.
Once you have the pdf you can serve the file over an endpoint on node pretty easily, eg using express.
I have successfully done code to display a PDF file in the browser instead of the "Open/Save" dialog. Now, I'm stuck trying to display a Word document in the browser. I want to display a Word document in Firefox, IE7+, Chrome etc.
Can any one help? I am always getting the "Open/Save" dialog while displaying the Word doc in browser. I want to implement this functionality using JavaScript.
No browsers currently have the code necessary to render Word Documents, and as far as I know, there are no client-side libraries that currently exist for rendering them either.
However, if you only need to display the Word Document, but don't need to edit it, you can use Google Documents' Viewer via an <iframe> to display a remotely hosted .doc/.docx.
<iframe src="https://docs.google.com/gview?url=http://remote.url.tld/path/to/document.doc&embedded=true"></iframe>
Solution adapted from "How to display a word document using fancybox".
Example:
JSFiddle
However, if you'd rather have native support, in most, if not all browsers, I'd recommend resaving the .doc/.docx as a PDF file Those can also be independently rendered using PDF.js by Mozilla.
Edit:
Huge thanks to cubeguerrero for posting the Microsoft Office 365 viewer in the comments.
<iframe src='https://view.officeapps.live.com/op/embed.aspx?src=http://remote.url.tld/path/to/document.doc' width='1366px' height='623px' frameborder='0'>This is an embedded <a target='_blank' href='http://office.com'>Microsoft Office</a> document, powered by <a target='_blank' href='http://office.com/webapps'>Office Online</a>.</iframe>
One more important caveat to keep in mind, as pointed out by lightswitch05, is that this will upload your document to a third-party server. If this is unacceptable, then this method of display isn't the proper course of action.
Live Examples:
Google Docs Viewer
Microsoft Office Viewer
The answers by Brandon and fatbotdesigns are both correct, but having implemented the Google docs preview, we found multiple .docx files that couldn't be handled by Google. Switched to the MS Office Online preview and works likes a charm.
My recommendation would be to use the MS Office Preview URL over Google's.
https://view.officeapps.live.com/op/embed.aspx?src=http://remote.url.tld/path/to/document.doc'
There are a few JS libraries that can handle .docx (not .doc) to HTML conversion client-side (in no particular order):
https://github.com/VolodymyrBaydalka/docxjs — works in the browser, docx only, complex layouts might be off, live demo
https://github.com/lalalic/docx2html (npm) — docx to html, most elements are supported, works in browser or nodejs
https://github.com/mwilliamson/mammoth.js — supports headings, lists, tables, endnotes, footnotes, images and text boxes
https://github.com/artburkart/docx2html — apparently, works in the browser
Note: If you are looking for the best way to convert a doc/docx file on the client side, then probably the answer is don't do it. If you really need to do it then do it server-side, i.e. with libreoffice in headless mode, apache-poi (java), pandoc etc.
A great solution if your data is confidential
Since the documents are confidential, they should not be processed on third-party resources.
This solution is open-source:
On the server-side: use Gotenberg to convert word & excel files to PDF.Note: Gotenberg works like a charm, it is based on the LibreOffice engine.
On the frontend: It's very easy to render the PDF file with javascript. (You can use libraries like: pdf.js, react-pdf, etc.)
ViewerJS is helpful to view/embed openoffice format like odt,odp,ods and also pdf.
For embed openoffice/pdf document
<iframe src = "/ViewerJS/#../demo/ohm2013.odp" width='700' height='550' allowfullscreen webkitallowfullscreen></iframe>
/ViewerJS/ is the path of ViewerJS
#../demo/ohm2013 is the path of your file want to embed
I think I have an idea.
This has been doing my nut in too and I'm still having trouble getting it to display in Chrome.
Save document(name.docx) in word as single file webpage (name.mht)
In your html use
<iframe src= "name.mht" width="100%" height="800"> </iframe>
Alter the heights and widths as you see fit.
If you wanted to pre-process your DOCX files, rather than waiting until runtime you could convert them into HTML first by using a file conversion API such as Zamzar. You could use the API to programatically convert from DOCX to HMTL, save the output to your server and then serve that HTML up to your end users.
Conversion is pretty easy:
curl https://api.zamzar.com/v1/jobs \
-u API_KEY: \
-X POST \
-F "source_file=#my.docx" \
-F "target_format=html5"
This would remove any runtime dependencies on Google & Microsoft's services (for example if they were down, or you were rate limited by them).
It also has the benefit that you could extend to other filetypes if you wanted (PPTX, XLS, DOC etc)
Native Documents (in which I have an interest) makes a viewer (and editor) specifically for Word documents (both legacy binary .doc and modern docx formats). It does so without lossy conversion to HTML. Here's how to get started https://github.com/NativeDocuments/nd-WordFileEditor/blob/master/README.md
PDFTron WebViewer supports rendering of Word (and other Office formats) directly in any browser and without any server side dependencies.
To test, try https://www.pdftron.com/webviewer/demo
You can also use some existing API's like GroupDocs.Viewer which can convert your document into image or html and then you will be able to display it in your own application.
Use Libre Office API
Here is an example
libreoffice --headless --convert-to html docx-file-path --outdir html-dir-path
I want to convert HTML content to pdf. It can be any content i.e. content of a div, table etc.
I have tried jspdf, iText for it but they are not effective.
Among the paid one's pdfcrowd is solving my purpose but I am looking for any open source solution which does not depend third party server.
Please suggest any open source solution to this which can convert html content to pdf effectively(Client Side will be preferable).
In Windows, Mac or Linux, install wkhtmltopdf. wkhtmltopdf is a command line utility to convert HTML to PDF using WebKit. You can download wkhtmltopdf from the linked webpage, or in many Linux distros it can be found in their repositories.
Examples
Convert a remote HTML file to PDF:
wkhtmltopdf http://www.google.com google.pdf
Convert a local HTML file to PDF:
wkhtmltopdf example.html example.pdf
wkhtmltopdf usage You can also display wkhtmltopdf help locally by running wkhtmltopdf -H.
You can try htmltopdf for convert HTML content into a pdf. I have used it and it fulfills my all requirements of converting HTML into pdf.
http://www.phpclasses.org/package/2905-PHP-Convert-HTML-to-PDF-using-Web-services.html
You can use TCPDF for converting HTML to PDF . its free and good features. I tried and its working perfectly even you can convert all html content like images ,or custom css into pdf without any problem by using TCPDF classes .
You can download form below link:
http://sourceforge.net/projects/tcpdf/files/
Regards,
Sanjeev Kumar Goswami