HTML in PDF con Node.js

Sto cercando di creare una versione pdf stampabile delle mie pagine web del mio sito. Qualcosa di simile a express.render() rende solo la pagina come pdf

Qualcuno conosce un modulo nodo che lo fa?

In caso contrario, come andresti a implementarne uno? Ho visto alcuni metodi parlare dell’uso di browser headless come phantom.js , ma non sono sicuro di quale sia il stream.

Prolungando la risposta di Mustafa.

A) Installa http://phantomjs.org/ e poi

B) installa il modulo del nodo fantasma https://github.com/amir20/phantomjs-node

inserisci la descrizione dell'immagine qui

C) Ecco un esempio di rendering di un pdf

 var phantom = require('phantom'); phantom.create().then(function(ph) { ph.createPage().then(function(page) { page.open("http://www.google.com").then(function(status) { page.render('google.pdf').then(function() { console.log('Page Rendered'); ph.exit(); }); }); }); }); 

Uscita del PDF:

inserisci la descrizione dell'immagine qui

EDIT: stampa silenziosa di quel PDF

java -jar pdfbox-app-2.0.2.jar PrintPDF -silentPrint C:\print_mypdf.pdf

Phantom.js è un server webkit headless e caricherà qualsiasi pagina web e la renderà in memoria, anche se potresti non essere in grado di vederla, c’è una funzione di Screen Capture, in cui puoi esportare la vista corrente come PNG, PDF , JPEG e GIF. Dai un’occhiata a questo esempio dalla documentazione di phantom.js

Se si desidera esportare HTML in PDF. Hai molte opzioni. senza nodo anche

Opzione 1: avere un pulsante nella pagina html che chiama la funzione window.print (). utilizzare l’html nativo del browser in pdf. usa le query multimediali per rendere la tua pagina html buona su un pdf. e hai anche la stampa prima e dopo gli eventi che puoi usare per apportare modifiche alla tua pagina prima della stampa.

Opzione 2. htmltocanvas o rasterizeHTML . converti il ​​tuo html in canvas, quindi chiama aDataURL () sull’object canvas per ottenere l’immagine. e utilizzare una libreria JavaScript come jsPDF per aggiungere quell’immagine a un file PDF. Lo svantaggio di questo approccio è che il pdf non diventa modificabile. Se vuoi dati estratti da PDF, ci sono diversi modi per farlo.

Opzione 3. Risposta @Jozzhard

La soluzione migliore che ho trovato è html-pdf. È semplice e funziona con un grande html.

https://www.npmjs.com/package/html-pdf

E ‘così semplice:

  pdf.create(htm, options).toFile('./pdfname.pdf', function(err, res) { if (err) { console.log(err); } }); 

Crea PDF da URL esterni

Ecco un adattamento delle risposte precedenti che utilizza html-pdf , ma lo combina anche con requestify modo che funzioni con un URL esterno:

Installa le tue dipendenze

 npm i -S html-pdf requestify 

Quindi, crea lo script:

 //MakePDF.js var pdf = require('html-pdf'); var requestify = require('requestify'); var externalURL= 'http://www.google.com'; requestify.get(externalURL).then(function (response) { // Get the raw HTML response body var html = response.body; var config = {format: 'A4'}; // or format: 'letter' - see https://github.com/marcbachmann/node-html-pdf#options // Create the PDF pdf.create(html, config).toFile('pathtooutput/generated.pdf', function (err, res) { if (err) return console.log(err); console.log(res); // { filename: '/pathtooutput/generated.pdf' } }); }); 

Quindi esegui semplicemente dalla riga di comando:

 node MakePDF.js 

Guarda il tuo perfetto PDF pixel perfetto da creare per te (gratis!)

Usa html-pdf

 var fs = require('fs'); var pdf = require('html-pdf'); var html = fs.readFileSync('./test/businesscard.html', 'utf8'); var options = { format: 'Letter' }; pdf.create(html, options).toFile('./businesscard.pdf', function(err, res) { if (err) return console.log(err); console.log(res); // { filename: '/app/businesscard.pdf' } }); 

Pacchetto

Ho usato html-pdf

Facile da usare e consente non solo di salvare il pdf come file, ma anche di inviare il contenuto in formato pdf a WriteStream (in modo da poterlo riversare direttamente su Google Storage per salvare i miei report).

Usando le immagini css +

Prende in considerazione il css. L’unico problema che ho affrontato – ha ignorato le mie immagini. La soluzione che ho trovato è stata la sostituzione di url in src valore di valore base64, ad es

Puoi farlo con il tuo codice o utilizzare uno dei convertitori online, ad es. https://www.base64-image.de/

Compilare codice html valido da html fragment + css

  1. Ho dovuto ottenere un frammento del mio documento html (ho appena appulato il metodo .html () sul selettore jQuery).
  2. Poi ho letto il contenuto del file css pertinente.

Usando questi due valori (memorizzati in variabili html e css conseguenza) ho compilato un codice html valido usando la stringa Template

 var htmlContent = `       ${html}  ` 

e passato per create metodo di html-pdf .