0

Currently I am testing html-pdf module to generate pdfs from html. And I have successfully generated one. But the issue is that the text/data in the html is fixed at the moment.

What I am trying to do is have an html form on the front-end which the user fills and then generate a pdf which includes the content the user typed.

What I have done so far:

app.post('/pdf',function(req, res) {

  pdf.create(html, options).toFile('./businesscard.pdf', function(err, res) {
   if (err) return console.log(err);
     console.log(res);
   });

});

Is this possible using html-pdf? Any help will be greatly appreciated.

Skywalker
  • 4,984
  • 16
  • 57
  • 122
  • why not generate the pdf on the time of save click ? – CodingDefined Oct 06 '16 at 09:58
  • @CodingDefined Yes I could do that but still how would I pass the users data to the `pdf.create` which takes a `html` file as an argument to convert to pdf. Do you get what I mean? – Skywalker Oct 06 '16 at 10:00
  • Why not take a scree shot of the web page when the user click on save. Take a look at http://www.codingdefined.com/2016/01/capture-screen-of-web-pages-through-url.html – CodingDefined Oct 06 '16 at 10:16
  • // please check solution here https://stackoverflow.com/questions/70889057/how-to-generate-pdf-from-dynamic-html-and-upload-it-to-aws-s3-bucket-without-dow/73166410#73166410 – Ajay Prajapati Aug 01 '22 at 14:04

3 Answers3

0

Unfortunately, html-pdf module can't handle the dynamic data. You can take a look at the phantomjs which does the screen capture.

In fact, html-pdf module uses "phantomjs" at background. However, it uses the small feature of phantomjs.

notionquest
  • 37,595
  • 6
  • 111
  • 105
0

You can check dynamic-html-pdf

Just follow the steps:

  1. Install using this command npm install dynamic-html-pdf --save

  2. Create html template

  3. Create pdf with below code:

    var fs = require('fs');
    var pdf = require('dynamic-html-pdf');
    
    var html = fs.readFileSync('template.html', 'utf8');
    
    pdf.registerHelper('ifCond', function (v1, v2, options) {
    if (v1 === v2) {
        return options.fn(this);
     }
     return options.inverse(this);
    })
    
    var options = {
     format: "A3",
     orientation: "portrait",
     border: "10mm"
    };
     //Your dynamic data 
    var users = [
     {
        name: 'aaa',
        age: 24,
        dob: '1/1/1991'
     },
     {
        name: 'bbb',
        age: 25,
        dob: '1/1/1995'
     },
     {
        name: 'ccc',
        age: 24,
        dob: '1/1/1994'
     }
    ];
    
    var document = {
     type: 'buffer',     // 'file' or 'buffer'
     template: html,
     context: {
        users: users
     },
    path: "./output.pdf"    // it is not required if type is buffer
    };
     pdf.create(document, options)
     .then(res => {
        console.log(res)
     })
    .catch(error => {
        console.error(error)
    });
    
Ali Yar Khan
  • 1,231
  • 2
  • 11
  • 33
0

I was finding solution for the same and got around one.

https://medium.com/free-code-camp/how-to-generate-dynamic-pdfs-using-react-and-nodejs-eac9e9cb4dde

you can checkout this work around done in the blog. He simply called a function that returns an HTML string and he use backticks for dynamic data.