Search code examples
node.jspdfpdfkitnode-pdfkit

node PDFkit blank pages


i'm creating a PDF with node.js and this package : https://github.com/devongovett/pdfkit

My problem is that when i download the pdf on the browser it is totaly blanck... server-side code :

    PDFDocument = require('pdfkit');

function creaEtichetta(req, res){
    doc = new PDFDocument
        size: 'a4'
        bufferPages: true



    doc.addPage().fontSize(25).text('Here is some vector graphics...', 100, 100);

    doc.save()
   .moveTo(100, 150)
   .lineTo(100, 250)
   .lineTo(200, 250)
   .fill("#FF3300");

   doc.addPage().fillColor("blue").text('Here is a link!', 100, 100).link(100, 100, 160, 27, 'http://google.com/')

    doc.pipe(res);
    doc.end();
}
exports.creaEtichetta = creaEtichetta;

client-side code :

var data = {};
    data.azione = "getEtichettaProdotto";

    //Scarico i dati anagrafica
    $.ajax({
        type: 'POST',
        data: JSON.stringify(data),
        contentType: 'application/json',
        url: 'http://46.101.209.16/endpoint',                       
        success: function(etichettas) {
            var blob=new Blob([etichettas]);
            var link=document.createElement('a');
            link.href=window.URL.createObjectURL(blob);
            link.download="Label"+".pdf";
            link.click();
        }//SUCCESS
    });

sorry for bad english, i'm italian


Solution

  • It could be that the binary characters in your pdf aren't being correctly coded in the transfer, which would explain why locally its ok but not when transferred - pdfs are a mix of ascii and binary characters, and if the binary is corrupted it seems that you get a blank pdf.

    That's likely to be a browser side issue, this approach worked for me: https://stackoverflow.com/a/27442914/2900643

    Coupled with this: https://stackoverflow.com/a/33818646/2900643

    EDIT: Better still use: https://github.com/eligrey/FileSaver.js/

    Server:

    var doc = new PDFDocument();
    doc.pipe(res);
    doc.circle(280, 200, 50).fill("#6600FF");
    doc.end();
    

    Browser:

    angular.module('app')
    .service('PdfService', function($http) {
      var svc = this;
    
      svc.getPdf = function() {
        return $http.get('/getpdf/', { responseType : 'arraybuffer' });
      };
    });
    
    angular.module('app')
    .controller('PdfCtrl', function($scope, PdfService) {
    
      $scope.getPdf = function() {
       PdfService.getPdf().success(function(data) {
        var fileName = 'hello.pdf';
        var pdf = new Blob([data], {type : 'application/pdf'});
        saveAs(pdf, fileName);
       })
     };
    });