Generierung von PDF-Berichten mit JavaScript (Node.js): Puppeteer, PDFKit, jsPDF

Generierung von PDF-Berichten mit JavaScript (Node.js): Puppeteer, PDFKit, jsPDF

Die Erstellung von PDF-Dokumenten ist eine der häufigsten Aufgaben in der Webentwicklung. Berichte, Rechnungen, Zertifikate, Dokumentationen – all dies erfordert ein zuverlässiges Tool zur Dateigenerierung auf der Serverseite. Im Node.js-Ökosystem gibt es mehrere leistungsstarke Bibliotheken, die die Aufgabe jeweils auf ihre eigene Weise lösen. In diesem Artikel betrachten wir drei Hauptansätze: die Browser-Emulation mit Puppeteer, die Low-Level-Arbeit mit PDF über PDFKit und die Client-Server-Lösung jsPDF.

1. Puppeteer – PDF-Generierung aus HTML/CSS

Puppeteer ist eine Bibliothek zur Steuerung des Headless-Browsers Chromium. Sie ermöglicht das Laden einer beliebigen HTML-Seite, das Anwenden von Stilen und das „Fotografieren" als PDF. Dies ist die ideale Wahl, wenn Sie bereits ein HTML/CSS-Layout für Ihre Berichte haben und eine exakte Übertragung ins PDF wünschen.

Hauptfunktionen:

• Unterstützung aller CSS-Eigenschaften (Flexbox, Grid, Schriftarten, Schatten).
• Arbeit mit JavaScript auf der Seite (Chart.js-Diagramme, dynamische Tabellen).
• Einstellung von Format, Rändern, Kopf- und Fußzeilen, Hintergründen.
• Unterstützung benutzerdefinierter Schriftarten (TTF, OTF).

Beispiel zur Berichtsgenerierung:

const puppeteer = require('puppeteer');

async function generateReport() {    const browser = await puppeteer.launch();    const page = await browser.newPage();

    // HTML direkt laden (oder per URL)    await page.setContent(`        <html>        <head>            <style>                body { font-family: Arial; padding: 40px; }                h1 { color: #2c3e50; }                .data { background: #ecf0f1; padding: 20px; }            </style>        </head>        <body>            <h1>Verkaufsbericht</h1>            <div class="data">                <p>Umsatz: 1.200.000 Rubel</p>                <p>Anzahl der Bestellungen: 345</p>            </div>        </body>        </html>    `, { waitUntil: 'networkidle0' });

    await page.pdf({        path: 'report.pdf',        format: 'A4',        printBackground: true,        margin: { top: '20mm', bottom: '20mm' }    });

    await browser.close();    console.log('PDF erstellt!');}

generateReport();

Vorteile: Layout-Genauigkeit, Unterstützung komplexer Layouts, Arbeit mit Diagrammen.

Nachteile: Hoher Speicherverbrauch (Chromium wiegt ~200 MB), langsamer Start.

2. PDFKit – Low-Level-Erstellung von PDF

PDFKit ist eine Bibliothek zur direkten Manipulation der PDF-Struktur. Sie verwenden kein HTML, sondern erstellen das Dokument programmatisch: Sie zeichnen Linien, fügen Text hinzu, fügen Bilder ein. Dies gibt Ihnen die vollständige Kontrolle über jedes Pixel des Dokuments.

Hauptfunktionen:

• Vektorgrafiken (Linien, Rechtecke, Kurven).
• Unterstützung von Unicode und Einbettung von Schriftarten.
• Erstellung von Tabellen, Seitennummerierung.
• Arbeit mit Anmerkungen und Links.

Beispiel zur Erstellung einer einfachen Rechnung:

const PDFDocument = require('pdfkit');const fs = require('fs');

const doc = new PDFDocument({ size: 'A4', margin: 50 });doc.pipe(fs.createWriteStream('invoice.pdf'));

// Überschriftdoc.fontSize(24).text('Rechnung Nr. 12345', { align: 'center' });doc.moveDown();

// Tabelle (manuell)doc.fontSize(12).text('Bezeichnung', 50, 150);doc.text('Menge', 350, 150);doc.text('Preis', 450, 150);

doc.moveTo(50, 170).lineTo(550, 170).stroke();

doc.text('Entwicklungsdienstleistungen', 50, 180);doc.text('1', 350, 180);doc.text('150.000 Rubel', 450, 180);

doc.moveDown(2);doc.fontSize(16).text('Gesamt: 150.000 Rubel',