WMP Sites

Mit Node.js HTML in PDF umwandeln: Einfache und effektive Lösungen

Lukas Fuchs vor 3 Wochen JavaScript 3 Min. Lesezeit

Node.js-Module für die HTML-zu-PDF-Konvertierung

Um HTML in PDF umzuwandeln, kannst du verschiedene Node.js-Module nutzen. Jedes Modul hat seine eigenen Vor- und Nachteile. Hier sind einige der beliebtesten Optionen:

puppeteer

Beschreibung: Puppeteer ist ein von Google entwickelter Headless-Browser, der es dir ermöglicht, Webseiten wie ein echter Browser zu rendern. Er bietet eine umfassende API zur Steuerung der Browser-Aktivitäten, einschließlich der PDF-Generierung.

Vorteile:

  • Es ist einfach zu bedienen und erfordert keine zusätzlichen Abhängigkeiten.
  • Es rendert Webseiten präzise, einschließlich aller Elemente wie Bilder, Schriftarten und Tabellen.
  • Bietet erweiterte Optionen für die PDF-Anpassung, wie z. B. Seitenränder, Kopf- und Fußzeilen.

html-pdf

Beschreibung: Html-pdf ist ein leichtgewichtiges Modul, das HTML mithilfe von wkhtmltopdf in PDF umwandelt. Wkhtmltopdf ist ein externes Dienstprogramm, das auf deinem System installiert sein muss.

Vorteile:

  • Schnelle und effiziente Konvertierungen.
  • Unterstützt eine Vielzahl von HTML-Elementen und CSS-Stilen.
  • Bietet grundlegende Optionen für die PDF-Anpassung, wie z. B. Seitenausrichtung und Papierformat.

pdfkit

Beschreibung: Pdfkit ist eine Low-Level-Bibliothek zur Generierung von PDFs von Grund auf. Sie bietet eine umfangreiche API, mit der du benutzerdefinierte PDF-Dokumente erstellen kannst.

Vorteile:

  • Volle Kontrolle über den PDF-Inhalt und das Layout.
  • Ermöglicht die dynamische Generierung von PDFs mit Daten aus anderen Quellen.
  • Unterstützt mehrere Streaming-Formate, einschließlich JPEG, PNG und SVG.

*Auswahl des richtigen Moduls

Die Wahl des richtigen Moduls hängt von deinen spezifischen Anforderungen ab. Wenn du nach einer einfachen und sofort einsatzbereiten Lösung suchst, ist Puppeteer eine gute Option. Html-pdf eignet sich für grundlegende Konvertierungen, während Pdfkit maximale Flexibilität und Kontrolle bietet.

Schritt-für-Schritt-Anleitung zur Konvertierung von HTML zu PDF

Installation der benötigten Pakete

Installiere zunächstä die benötigten Node.js-Module über npm:

npm install html-pdf

Erstelle ein HTML-Dokument

Erstelle ein HTML-Dokument mit dem Inhalt, den du in PDF konvertieren möchtest.

Importiere das Modul und lade das HTML

Importiere das html-pdf-Modul in deine Node.js-Datei und lade das HTML-Dokument, das du konvertieren möchtest:

const htmlPdf = require('html-pdf');
const fs = require('fs');

const html = fs.readFileSync('document.html', 'utf8');

Konvertiere HTML zu PDF

Konvertiere nun das HTML in PDF, indem du die create-Methode des Moduls aufrufst:

htmlPdf.create(html).toFile('document.pdf', function(err, res) {
  if (err) {
    return console.log(err);
  }
  console.log('Das PDF wurde erfolgreich erstellt!');
});

Zusätzliche Optionen

Die create-Methode bietet zusätzliche Optionen zur Anpassung des generierten PDFs:

  • Seitenformat (z.B. A4, Letter)
  • Seitenränder
  • Ausrichtung
  • Kopf- und Fußzeilen
  • Sicherheitseinstellungen

Beispiel:

const options = {
  format: 'A4',
  marginLeft: '20mm',
  marginRight: '20mm',
  header: {
    height: '15mm',
    contents: '<p align="center">Mein PDF-Header</p>'
  },
  footer: {
    height: '10mm',
    contents: '<p align="center">Seite {page} von {pages}</p>'
  }
};

htmlPdf.create(html, options).toFile('document.pdf', function(err, res) {
  ...
});

Anpassung der PDF-Ausgabe (Seitenränder, Kopf- und Fußzeilen)

Nachdem du dein HTML in PDF konvertiert hast, kannst du die Ausgabe an deine spezifischen Anforderungen anpassen. Dies umfasst die Einstellung der Seitenränder sowie das Hinzufügen von Kopf- und Fußzeilen.

Seitenränder festlegen

Mit Node.js-Modulen wie html-pdf oder pdfkit kannst du die Seitenränder deines PDFs anpassen. Die folgende Syntax zeigt, wie du die Ränder in Millimetern festlegst:

pdf.margins({
  top: 10,
  right: 15,
  bottom: 20,
  left: 10
});

Kopf- und Fußzeilen hinzufügen

Kopf- und Fußzeilen können deinem PDF zusätzliche Informationen wie Seitenzahlen oder Unternehmenslogos hinzufügen. Mit html-pdf kannst du Kopf- und Fußzeilen folgendermaßen hinzufügen:

pdf.header('<p>Beispiel-Kopfzeile</p>');
pdf.footer('<p>Beispiel-Fußzeile <%= page %> von <%= totalPages %></p>');

Wenn du zusätzliche Kontrolle über die Gestaltung deiner Kopf- und Fußzeilen benötigst, kannst du stattdessen die pdfkit-Bibliothek verwenden.

Weitere Anpassungsoptionen

Zusätzlich zu Seitenrändern und Kopf- und Fußzeilen kannst du mit Node.js-Modulen wie html-pdf und pdfkit weitere Aspekte der PDF-Ausgabe anpassen, darunter:

  • Seitenformat: Wähle A4, Letter oder ein benutzerdefiniertes Format.
  • Ausrichtung: Lege die Ausrichtung des Inhalts auf Hoch- oder Querformat fest.
  • Schriftarten: Einbetten benutzerdefinierter Schriftarten oder Verwenden von Standardschriftarten.
  • Wasserzeichen: Füge deinem PDF ein Wasserzeichen hinzu, um es vor unbefugter Verwendung zu schützen.

Behandlung von Bildern und externen Ressourcen

Beim Konvertieren von HTML zu PDF musst du auch die Einbindung von Bildern und externen Ressourcen wie CSS-Dateien und JavaScript-Skripten berücksichtigen. Hier sind einige wichtige Überlegungen:

Bilder

  • Lokale Bilder einbetten: Verwende die file://-URL, um lokale Bilder in dein HTML einzubetten. Beispiel: <img src="file:///path/to/image.png">.
  • Remote-Bilder herunterladen: Wenn deine Bilder auf einem Remote-Server liegen, musst du sie lokal herunterladen und in dein HTML einbetten, bevor du die Konvertierung durchführst. Du kannst Bibliotheken wie axios oder fetch verwenden, um Remote-Ressourcen abzurufen.
  • Bildgröße anpassen: Du kannst die Größe der eingebetteten Bilder mithilfe von CSS oder den Optionen des PDF-Konverters anpassen. Auf diese Weise kannst du die Dateigröße der PDF-Datei reduzieren oder Bilder an eine bestimmte Größe anpassen.

Externe Ressourcen

  • CSS-Dateien einbinden: Verwende das <link>-Tag, um externe CSS-Dateien in dein HTML einzubinden. Beispiel: <link href="style.css" rel="stylesheet">.
  • JavaScript-Skripte einbinden: Du kannst JavaScript-Skripte mithilfe des <script>-Tags einbinden. Beispiel: <script src="script.js"></script>.
  • Abhängigkeiten verwalten: Falls du externe Ressourcen wie Schriftarten oder Bibliotheken benötigst, musst du sicherstellen, dass diese ebenfalls in die PDF-Datei eingebettet werden. Verwende Bibliotheken wie html-pdf oder wkhtmltopdf, die die Einbettung externer Ressourcen unterstützen.

Automatisierung der HTML-zu-PDF-Konvertierung

Die Automatisierung der HTML-zu-PDF-Konvertierung bietet zahlreiche Vorteile, etwa eine verbesserte Effizienz und eine reduzierung des manuellen Arbeitsaufwands. In diesem Abschnitt erfährst du, wie du mit Node.js die HTML-zu-PDF-Konvertierung automatisieren kannst.

Warteschlangensysteme

Eine gängige Methode zur Automatisierung ist die Verwendung von Warteschlangensystemen. Diese Systeme, wie z. B. RabbitMQ, verarbeiten asynchron eingehende Konvertierungsanforderungen. Du kannst HTML-Dateien in die Warteschlange einreihen und einen Hintergrundprozess einrichten, der die Konvertierungen verarbeitet und die PDF-Dateien speichert.

Geplante Aufgaben

Du kannst auch geplante Aufgaben verwenden, um die HTML-zu-PDF-Konvertierung zu automatisieren. Bibliotheken wie Node-Cron ermöglichen es dir, Jobs zu bestimmten Zeitpunkten oder Intervallen einzuplanen. So kannst du beispielsweise jeden Tag um Mitternacht HTML-Dateien konvertieren.

Webhooks

Wenn deine HTML-Dateien über Webhooks aktualisiert werden, kannst du einen Serverless-Ansatz verwenden, um die Konvertierung zu automatisieren. Du kannst Dienste wie AWS Lambda oder Google Cloud Functions verwenden, um Funktionen einzurichten, die HTML-Aktualisierungen abfangen und die Konvertierung auslösen.

Integration mit CMS

Wenn du ein Content-Management-System (CMS) verwendest, kannst du dessen API nutzen, um die HTML-zu-PDF-Konvertierung zu automatisieren. Du kannst beispielsweise einen Auslöser erstellen, der eine Konvertierung startet, wenn eine neue HTML-Seite veröffentlicht wird.

Vorteile der Automatisierung

  • Effizienzsteigerung: Automatisierung spart Zeit und reduziert den manuellen Arbeitsaufwand.
  • Verbesserte Genauigkeit: Automatisierte Prozesse sind in der Regel genauer als manuelle Prozesse.
  • Skalierbarkeit: Warteschlangensysteme und geplante Aufgaben ermöglichen die Skalierung der Konvertierungen je nach Bedarf.
  • Zuverlässigkeit: Automatisierte Prozesse sind in der Regel zuverlässiger als manuelle Prozesse.
  • Integration: Die Integration mit CMS und anderen Systemen ermöglicht einen nahtlosen Workflow.

Fehlerbehebung bei häufigen Problemen

Bei der Konvertierung von HTML zu PDF können verschiedene Probleme auftreten. Hier findest du einige Tipps zur Fehlerbehebung für gängige Stolpersteine:

Fehlende oder ungültige HTML-Dokumente

  • Überprüfe, ob du das richtige HTML-Dokument angibst: Stelle sicher, dass der Dateipfad zum Ziel-HTML-Dokument korrekt ist.
  • Überprüfe die Syntax deines HTML-Dokuments: Stelle sicher, dass dein HTML-Dokument gut geformt ist und keine Syntaxfehler enthält. Du kannst Tools wie den HTML-Validator verwenden, um mögliche Probleme zu identifizieren.

Probleme mit Bildern oder externen Ressourcen

  • Überprüfe die URLs deiner Bilder und externen Ressourcen: Stelle sicher, dass die URLs korrekt sind und dass die Ressourcen zugänglich sind.
  • Verwende absolute URLs: Verwende absolute URLs für Bilder und externe Ressourcen, um sicherzustellen, dass sie auch beim Konvertieren in PDF korrekt aufgelöst werden.

Probleme mit der PDF-Ausgabe

  • Überprüfe die Seitengröße und Ausrichtung: Stelle sicher, dass die angegebene Seitengröße und Ausrichtung mit dem gewünschten PDF-Layout übereinstimmen.
  • Passe die Seitenränder an: Passe die Seitenränder an, um sicherzustellen, dass der PDF-Inhalt nicht abgeschnitten wird.
  • Überprüfe die Kopf- und Fußzeilen: Stelle sicher, dass die Kopf- und Fußzeilen wie erwartet angezeigt werden.

Konvertierungsprobleme

  • Überprüfe die verwendeten Node.js-Module: Vergewissere dich, dass du die neuesten Versionen der für die Konvertierung verwendeten Node.js-Module verwendest.
  • Aktualisiere deine Node.js-Version: Stelle sicher, dass du die neueste Version von Node.js verwendest, da ältere Versionen möglicherweise nicht alle Funktionen der Konvertierungsmodule unterstützen.
  • Überprüfe die Verfügbarkeit von Ressourcen: Stelle sicher, dass dein System über genügend Speicher und CPU-Ressourcen verfügt, um die Konvertierung durchzuführen.

Weitere Beiträge

Folge uns

Neue Beiträge

JavaScript

JavaScript Dateien: Ihr umfassender Leitfaden zum Verstehen, Verwenden und Optimieren

AUTOR • Jul 25, 2026
Frontend

HTML Schriftart ändern: Schritt-für-Schritt-Anleitung für ein besseres Website-Design

AUTOR • Jul 25, 2026
Frontend

HTML kostenlos meistern: Dein ultimativer Wegweiser für schnellen Lernfortschritt

AUTOR • Jul 25, 2026
DevOps & Deployment

MX Linux installieren: Eine Schritt-für-Schritt-Anleitung für Anfänger

AUTOR • Jul 25, 2026
Frontend

HTML Elemente: Bausteine des Webs und wie man sie einsetzt

AUTOR • Jul 25, 2026
Frontend

HTML Telefonnummern: So fügen Sie anklickbare Telefonnummern in Ihre Website ein

AUTOR • Jul 25, 2026
Frontend

Grundlegende HTML-Version von Gmail: So greifst du auf E-Mails ohne JavaScript oder CSS zu

AUTOR • Jul 25, 2026
Frontend

Kontaktformulare in HTML: Effektive Formulare erstellen, die Anfragen bringen

AUTOR • Jul 25, 2026
Frameworks & Libraries

React HTML Strings sicher und effizient rendern: So vermeidest du XSS und Performance-Probleme

AUTOR • Jul 24, 2026
Frontend

HTML in Text konvertieren: einfach gemacht mit klaren Methoden

AUTOR • Jul 24, 2026
Frontend

HTML Trennlinien: So teilst du Inhalte klar und effektiv

AUTOR • Jul 24, 2026
Frontend

HTML in Figma mühelos konvertieren: Schritt-für-Schritt-Anleitung für saubere Designs

AUTOR • Jul 24, 2026
Frontend

HTML target Attribut: Eine umfassende Anleitung für Links, Formulare und iFrames

AUTOR • Jul 24, 2026
Frontend

So passen Sie die Größe von HTML-Bildern perfekt an: Methoden, Fehler und Best Practices

AUTOR • Jul 24, 2026
Frontend

Die Kunst des Schatten: Box Shadow für visuell beeindruckende Designs

AUTOR • Jul 23, 2026
Frontend

Das HTML Main Tag: Der unverzichtbare Container für den Hauptinhalt deiner Webseite

AUTOR • Jul 22, 2026
Frontend

Einfacher Weg zur Konvertierung von HTML in JSON: So sparst du Zeit und Fehler

AUTOR • Jul 22, 2026
DevOps & Deployment

Die Verzeichnisstruktur von Linux entmystifizieren: Der klare Guide für Einsteiger und Profis

AUTOR • Jul 22, 2026
Frontend

Das HTML-Adress-Element für Landingpages und Kontaktdetails optimieren: So mache ich es sauber, SEO-stark und nutzerfreundlich

AUTOR • Jul 22, 2026
Frontend

CSS Overlays: Transparenz, Positionierung und Effekte für Ihre Website

AUTOR • Jul 22, 2026

Beliebte Beiträge

Frontend

Kreative Sprüche fürs Gästebuch: Unvergessliche Erinnerungen schaffen

AUTOR • May 12, 2025
JavaScript

Umrechnung von Kilogramm in Gramm: Praktische Tipps und Beispiele

AUTOR • May 09, 2025
API & Webservices

Wie man Quadratmeter in Hektar umwandelt: Einfach erklärt!

AUTOR • May 09, 2025
Frontend

Fläche und Umfang geometrischer Figuren: Alles, was Sie wissen müssen

AUTOR • May 05, 2025
JavaScript

Zeichen Größer: Alles, was Sie wissen müssen

AUTOR • May 05, 2025
API & Webservices

Kreative Geschenke zum Geburtstag für Männer: Ein umfassender Leitfaden

AUTOR • Jun 24, 2025
Datenbanken

Diffusion und Osmose: Ein tieferer Einblick in den Unterschied

AUTOR • Apr 04, 2025
Backend

Das STD-Signal: Anwendungen, Vorteile und Herausforderungen

AUTOR • Apr 04, 2025
JavaScript

Die D Programmiersprache: Eine tiefgreifende Analyse

AUTOR • Apr 04, 2025
Frontend

Was ist ein Seitenumbruch? Detaillierte Informationen und Anwendungen

AUTOR • Sep 10, 2024
Frontend

Formatierung Masterarbeit: Detaillierte Hinweise und praktische Tipps

AUTOR • Sep 10, 2024
Backend

Autokennzeichen ÖHR und HR: Eine Reise durch Geschichte und Bedeutung

AUTOR • Jun 16, 2025
Frontend

Pan Kennzeichen Deutschland

AUTOR • Apr 07, 2025
Frontend

Autokennzeichen DAH: Alles, was Sie wissen müssen

AUTOR • Jun 18, 2024
Frontend

Autokennzeichen EM: Bedeutung und Verwendung

AUTOR • Jun 18, 2024
Frontend

GBG Kennzeichen Schwarz: Bedeutung und Anwendungen

AUTOR • Jun 18, 2024
Frontend

Autokennzeichen HN: Alles, was Sie über Heilbronn-Kennzeichen wissen müssen

AUTOR • Jun 18, 2024
DevOps & Deployment

Linux-IP-Adressen: Zuweisung, Konfiguration und Fehlerbehebung

AUTOR • May 06, 2024
DevOps & Deployment

Überwachung der Systemleistung unter Linux

AUTOR • May 06, 2024
DevOps & Deployment

XFCE: Eine leichtgewichtige und intuitive Desktop-Umgebung für Linux

AUTOR • May 06, 2024