Add Image In Header Using Html-pdf Node Module


Answer :

It is possible to add the image in options header. 1.Load the image in html body with "display:none" style. 2.Then add the image in the options header By doing this the image is cached and can attach the image in header.

    var options = {     "format": 'Letter',     "orientation": "portrait",     "header": {     "contents": "<img src='image path' />",         "height": "30mm"   },   "footer": {     "contents": footer   } } pdf.create("<div style='display:none'><img src='image path' /></div>", options).toFile("sample.pdf", function(err, res) {         if (err) {                 console.error(err);                 callback();         }  }); 

Refering to this issue on the github, you can't put your image directly in options.header, you have to put it in the body inside a <div id="pageHeader"></div>:

var pdf = require('html-pdf'); var path = require('path');  // this is very important, you have to put file:// before your path // and normalize the resulting path var imgSrc = 'file://' + __dirname + '/350x120.png'; imgSrc = path.normalize(imgSrc); // or var imgSrc = path.join('file://', __dirname, '/350x120.png');  // Options var options = {     "header": {       "height": "45mm",       "contents": ""     },     "footer": {       "height": "28mm",       "contents": "<span style='color: #444;'>{{page}}</span>/<span>{{pages}}</span>"     }   } // put your entire header here and the content of the page outside the <div id="pageHeader"></div> var result = "<div id='pageHeader'><img src='" + imgSrc + "' /><div style='text-align: center;'>Author: Marc Bachmann</div></div>"; result += "<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>"; var fileName = __dirname + '/test.pdf'; pdf.create(result, options).toFile(fileName, function(err, res) {   if (err) {     console.error(err);   } }); 

With this code, I get this pdf:

generated pdf


Comments

Popular posts from this blog

Converting A String To Int In Groovy

"Cannot Create Cache Directory /home//.composer/cache/repo/https---packagist.org/, Or Directory Is Not Writable. Proceeding Without Cache"

Android How Can I Convert A String To A Editable