Convert HTML to PDF in Node.js

Q: ¿Cómo se convierte HTML a PDF en Node.js?

Usa la biblioteca IronPDF. Instálala con npm install @ironsoftware/ironpdf , luego llama a PdfDocument.fromHtml con una cadena HTML o ruta de archivo, o PdfDocument.fromUrl con una dirección web. Guarda el resultado con PdfDocument.saveAs .

Q: ¿Cómo se convierte una cadena de HTML a PDF en Node.js?

Llama a PdfDocument.fromHtml con la cadena HTML como argumento. El método devuelve una Promesa que se resuelve en una instancia de PdfDocument . Encadena saveAs en el resultado para escribir el PDF en el disco.

Q: ¿Cómo se convierte un archivo HTML local a PDF en Node.js?

Pasa una ruta válida del sistema de archivos a PdfDocument.fromHtml en lugar de una cadena HTML. IronPDF resuelve rutas relativas de CSS, imágenes y scripts de la misma manera que un navegador al cargar el archivo.

Q: ¿Cómo se convierte una URL a PDF en Node.js?

Llama a PdfDocument.fromUrl con la URL objetivo. IronPDF obtiene la página usando su motor de renderizado Chrome y produce un PDF de píxeles perfectos. La URL objetivo debe ser accesible públicamente desde el host que ejecuta IronPDF.

Q: ¿Cómo se añaden encabezados y pies de página a un PDF en Node.js?

Configura las propiedades textHeader y textFooter en un objeto ChromePdfRenderOptions para encabezados y pies de página de texto simples. Para diseños más ricos, usa htmlHeader y htmlFooter con fragmentos HTML en bruto. Pasa el objeto de opciones al parámetro renderOptions de cualquier método de conversión.

Q: ¿Cómo se cambia el tamaño de página y la orientación en IronPDF for Node.js?

Establece options.paperSize a un valor del enumerado PaperSize (como PaperSize.A4 o PaperSize.Letter ) y establece options.paperOrientation en PdfPaperOrientation.Portrait o PdfPaperOrientation.Landscape . Pasa las opciones configuradas al método de conversión.

Q: ¿Cómo se maneja el contenido dinámico de JavaScript al convertir a PDF?

Usa la propiedad waitFor en ChromePdfRenderOptions . Establece type en WaitForType.RenderDelay y proporciona un retraso en milisegundos, o establece type en WaitForType.HtmlElement y proporciona un selector de consulta CSS. IronPDF pausará el renderizado hasta que se cumpla la condición.

Q: ¿Cómo se convierte un archivo HTML dentro de un archivo ZIP a PDF?

Llama a PdfDocument.fromZip con la ruta al archivo ZIP como primer argumento y un objeto de opciones como segundo. Establece la propiedad mainHtmlFile en el nombre del archivo HTML dentro del archivo que debe ser convertido.

Q: ¿Cómo se generan PDFs a partir de una plantilla HTML en Node.js?

Carga la plantilla con PdfDocument.fromHtml , luego llama a PdfDocument.replaceText para cada marcador de posición en la plantilla, pasando la cadena de marcador de posición y su valor de reemplazo. Una vez completadas todas las sustituciones, llama a saveAs para escribir el PDF final.

Curtis Chau

Updated: 17 de septiembre de 2026

La característica más poderosa y popular de IronPDF es la capacidad de crear PDF de alta fidelidad a partir de HTML, CSS y JavaScript en bruto. Este tutorial guía a los desarrolladores de Node.js a través de cada método práctico para convertir contenido HTML en PDFs - desde una conversión de cadena de una sola línea hasta la generación de documentos dinámicos impulsada por plantillas.

IronPDF es una biblioteca de API de alto nivel que ayuda a los desarrolladores a implementar capacidades poderosas de procesamiento de PDF en aplicaciones de software rápidamente. IronPDF está disponible en múltiples lenguajes de programación. Para una cobertura detallada sobre la creación de PDFs en .NET, Java, y Python, consulte las páginas oficiales de documentación. Este tutorial cubre su uso tal como se aplica a los proyectos de Node.js.

Inicio rápido: Convertir HTML a PDF en Node.js

Cómo convertir HTML a PDF en Node.js

Instale la biblioteca IronPDF for Node.js a través de NPM: npm install @ironsoftware/ironpdf
Importe la clase PdfDocument del paquete @ironsoftware/ironpdf.
Llame PdfDocument.fromHtml, PdfDocument.fromUrl, o PdfDocument.fromZip dependiendo de su fuente de HTML.
Opte por configurar opciones de renderizado: encabezados, pies de página, tamaño de página, orientación y márgenes.
Llame PdfDocument.saveAs para guardar el PDF generado en disco.

Tabla de contenido

¿Cómo se empieza con IronPDF for Node.js?
¿Cómo se convierte HTML a PDF en Node.js?
¿Qué opciones avanzadas de renderizado soporta IronPDF?
¿Cómo se generan PDFs a partir de una plantilla HTML?
¿Cuáles son los próximos pasos?

¿Cómo se comienza con IronPDF for Node.js?

Start using IronPDF in your project today with a free trial.

Primer Paso:

Instalar la biblioteca IronPDF

Instale el paquete IronPDF for Node.js ejecutando el siguiente comando NPM en su proyecto Node.js elegido:

> npm i @ironsoftware/ironpdf

npm i @ironsoftware/ironpdf

También puede descargar e instalar el paquete IronPDF manualmente.

¿Cómo se instala el IronPDF Engine?

IronPDF for Node.js requiere un binario del IronPDF Engine para funcionar.

Por favor nota: La instalación del IronPDF Engine es opcional. El paquete @ironsoftware/ironpdf descarga e instala automáticamente el binario apropiado para su sistema operativo en la primera ejecución. Se recomienda la instalación explícita en entornos donde el acceso a internet está restringido o no disponible.

Instale el binario del IronPDF Engine instalando el paquete apropiado para su sistema operativo.

¿Cómo se aplica una clave de licencia?

Por defecto, IronPDF marca todos los documentos que genera o modifica con una marca de agua. Para eliminar la marca de agua, establezca la propiedad licenseKey en el objeto global IronPdfGlobalConfig con una clave de licencia válida:

import { IronPdfGlobalConfig } from "@ironsoftware/ironpdf";

// Retrieve the global configuration object
var config = IronPdfGlobalConfig.getConfig();

// Set a valid license key to remove watermarks
config.licenseKey = "{YOUR-LICENSE-KEY-HERE}";

import { IronPdfGlobalConfig } from "@ironsoftware/ironpdf";

// Retrieve the global configuration object
var config = IronPdfGlobalConfig.getConfig();

// Set a valid license key to remove watermarks
config.licenseKey = "{YOUR-LICENSE-KEY-HERE}";

JavaScript

Obtén una clave de licencia de prueba gratuita o compra una clave de licencia desde la página de licencias.

Por favor nota: Configure la clave de licencia y cualquier otra configuración global antes de llamar a otras funciones de la biblioteca. Esto asegura un rendimiento óptimo y un comportamiento correcto en toda la aplicación.

Los ejemplos de código restantes en este tutorial asumen que una clave de licencia se ha aplicado en un archivo config.js separado, que se importa al inicio de cada script:

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script
// ...

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script
// ...

JavaScript

Marca de agua de IronPDF mostrada en un documento PDF generado sin una clave de licencia Obtén una clave de licencia en ironpdf.com/nodejs/licensing/para generar documentos PDF sin marcas de agua.

¿Cómo se convierte HTML a PDF en Node.js?

La biblioteca IronPDF for Node.js ofrece cuatro enfoques para crear archivos PDF a partir de contenido HTML:

Desde un código HTML
Desde un archivo HTML local
Desde una URL en línea
Desde un archivo ZIP comprimido

Cada enfoque utiliza la clase PdfDocument como su base. Un PdfDocument representa un archivo PDF producido a partir de algún contenido fuente y dirige la mayoría de las funciones centrales de creación y edición de IronPDF.

¿Cómo se crea un PDF a partir de una cadena HTML?

PdfDocument.fromHtml genera PDFs a partir de cadenas de marcado HTML sin procesar. Este enfoque ofrece la mayor flexibilidad de los cuatro métodos porque la cadena HTML puede provenir prácticamente de cualquier lugar: archivos de texto, flujos de datos, un motor de plantillas HTML o marcado construido dinámicamente.

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Create a PDF from an HTML string
const pdf = await PdfDocument.fromHtml("<h1>Hello from IronPDF!</h1>");

// Save the PDF document to the file system
await pdf.saveAs("html-string-to-pdf.pdf");

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Create a PDF from an HTML string
const pdf = await PdfDocument.fromHtml("<h1>Hello from IronPDF!</h1>");

// Save the PDF document to the file system
await pdf.saveAs("html-string-to-pdf.pdf");

JavaScript

PdfDocument.fromHtml devuelve una Promesa que se resuelve en una instancia de la clase PdfDocument. Después de obtener la instancia, llame a saveAs con una ruta de archivo de destino para escribir el PDF en el disco. El archivo PDF guardado representa el HTML exactamente como lo mostraría un navegador compatible con los estándares.

Documento PDF generado a partir de la cadena HTML que contiene un encabezado de nivel uno "Hello from IronPDF!" **The PDF generated from the HTML string <h1>Hello from IronPDF!</h1>. Los archivos PDF que PdfDocument.fromHtml genera aparecen tal como lo haría el contenido de una página web.

¿Cómo se crea un PDF a partir de un archivo HTML?

PdfDocument.fromHtml también acepta un camino a un documento HTML local. En lugar de una cadena de marcado, pase una ruta de archivo válida como primer argumento. Este es el enfoque preferido cuando se trabaja con páginas web guardadas que referencia activos locales de CSS, JavaScript e imágenes.

El siguiente ejemplo convierte una página web de muestra en un PDF:

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Render a PDF from a local HTML file
const pdf = await PdfDocument.fromHtml("./sample2.html");

// Save the PDF document to the project directory
await pdf.saveAs("html-file-to-pdf-1.pdf");

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Render a PDF from a local HTML file
const pdf = await PdfDocument.fromHtml("./sample2.html");

// Save the PDF document to the project directory
await pdf.saveAs("html-file-to-pdf-1.pdf");

JavaScript

Página de ejemplo HTML mostrada en Google Chrome antes de la conversión a PDF La página HTML de muestra tal como aparece en Google Chrome. Descargue esta y páginas similares desde el sitio web de File Samples: https://filesamples.com/samples/code/html/sample2.html

IronPDF preserva la apariencia del documento HTML original y retiene la funcionalidad de enlaces, formularios y otros elementos interactivos. Esta fidelidad se extiende a páginas complejas que incluyen párrafos, listas, imágenes, hipervínculos y scripts del lado del cliente.

Documento PDF generado a partir del archivo HTML de ejemplo, mostrando una reproducción fiel del diseño original de la página Este PDF fue generado a partir del ejemplo de archivo HTML anterior. Compare su apariencia con la imagen anterior - IronPDF conserva el diseño con alta fidelidad.

IronPDF maneja páginas que van más allá del marcado simple. El siguiente ejemplo convierte una página rica en funciones que proviene de numerosos archivos CSS externos, imágenes y activos de scripts:

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Render a PDF from a complex HTML page with external assets
PdfDocument.fromHtml("./sample4.html").then(async (pdf) => {
    return await pdf.saveAs("html-file-to-pdf-2.pdf");
});

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Render a PDF from a complex HTML page with external assets
PdfDocument.fromHtml("./sample4.html").then(async (pdf) => {
    return await pdf.saveAs("html-file-to-pdf-2.pdf");
});

JavaScript

PDF generado a partir de una página HTML compleja que contiene un rico estilo CSS y contenido renderizado por JavaScript Si se ve bien en Google Chrome, se verá bien cuando se convierte a PDF. Esto incluye diseños de página pesados en CSS y renderizados con JavaScript.

Consejos: Si una página obtiene activos de rutas de archivos locales, asegúrese de que todos los archivos CSS, imágenes y scripts referenciados estén presentes en relación con la ubicación del archivo HTML. El motor de renderizado de Chrome de IronPDF resuelve estas rutas de la misma manera que lo haría un navegador.

¿Cómo se crea un PDF a partir de una URL?

PdfDocument.fromUrl recupera y renderiza una página web en vivo como un PDF. Pase cualquier URL públicamente accesible como argumento. El motor de renderizado Chrome de IronPDF recupera la página, carga todos los recursos y produce un PDF perfecto - no se requiere descarga manual de HTML.

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Convert a live web page to a PDF
const pdf = await PdfDocument.fromUrl("https://en.wikipedia.org/wiki/PDF");

// Save the document
await pdf.saveAs("url-to-pdf.pdf");

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Convert a live web page to a PDF
const pdf = await PdfDocument.fromUrl("https://en.wikipedia.org/wiki/PDF");

// Save the document
await pdf.saveAs("url-to-pdf.pdf");

JavaScript

El artículo de Wikipedia sobre el formato PDF, tal como aparece en un navegador web compatible con estándares.

Documento PDF generado llamando a PdfDocument.fromUrl en la página del artículo de Wikipedia sobre PDF El PDF generado al llamar a PdfDocument.fromUrl en un artículo de Wikipedia. Observe su estrecha similitud con la página web original.**

Importante: Las conversiones basadas en URL requieren que el servidor de destino sea accesible desde la máquina que ejecuta IronPDF. Las páginas detrás de autenticación, VPNs o firewalls pueden requerir una configuración adicional a través de ChromePdfRenderOptions.

¿Cómo se crea un PDF a partir de un archivo Zip?

PdfDocument.fromZip convierte un archivo HTML específico contenido en un archivo ZIP en un PDF. Esto es particularmente útil al distribuir proyectos HTML autónomos que agrupan sus recursos HTML, CSS e imagen juntos.

Para este ejemplo, suponga que el directorio del proyecto contiene un archivo ZIP con la siguiente estructura:

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/zip-structure.txt
html-zip.zip
├─ index.html
├─ style.css
├─ logo.png

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/zip-structure.txt
html-zip.zip
├─ index.html
├─ style.css
├─ logo.png

Text

El archivo index.html contiene:

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Hello world!</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>Hello from IronPDF!</h1>
    <a href="https://ironpdf.com/nodejs/">
      <img src="logo.png" alt="IronPDF para Node.js">
    </a>
  </body>
</html>

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Hello world!</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>Hello from IronPDF!</h1>
    <a href="https://ironpdf.com/nodejs/">
      <img src="logo.png" alt="IronPDF para Node.js">
    </a>
  </body>
</html>

HTML

Y style.css declara las reglas de diseño de página y fuente:

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/style.css
@font-face {
  font-family: 'Gotham-Black';
  src: url('gotham-black-webfont.eot?') format('embedded-opentype'), 
       url('gotham-black-webfont.woff2') format('woff2'), 
       url('gotham-black-webfont.woff') format('woff'), 
       url('gotham-black-webfont.ttf') format('truetype'), 
       url('gotham-black-webfont.svg') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 200px;
  margin-bottom: auto;
  color: white;
  background-color: black;
  text-align: center;
  font-family: "Helvetica"
}

h1 {
  font-family: "Gotham-Black";
  margin-bottom: 70px;
  font-size: 32pt;
}

img {
  width: 400px;
  height: auto;
}

p {
  text-decoration: underline;
  font-size: smaller;
}

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/style.css
@font-face {
  font-family: 'Gotham-Black';
  src: url('gotham-black-webfont.eot?') format('embedded-opentype'), 
       url('gotham-black-webfont.woff2') format('woff2'), 
       url('gotham-black-webfont.woff') format('woff'), 
       url('gotham-black-webfont.ttf') format('truetype'), 
       url('gotham-black-webfont.svg') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 200px;
  margin-bottom: auto;
  color: white;
  background-color: black;
  text-align: center;
  font-family: "Helvetica"
}

h1 {
  font-family: "Gotham-Black";
  margin-bottom: 70px;
  font-size: 32pt;
}

img {
  width: 400px;
  height: auto;
}

p {
  text-decoration: underline;
  font-size: smaller;
}

Text

Imagen de logo.png de ejemplo contenida dentro del archivo ZIP HTML hipotético La imagen de ejemplo dentro del archivo ZIP HTML hipotético.

Al llamar a fromZip, especifique la ruta al archivo ZIP como el primer argumento y un objeto de configuración como el segundo. Establezca la propiedad mainHtmlFile al nombre del archivo HTML dentro del archivo que debe ser convertido:

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Convert an HTML file from a ZIP archive to PDF
PdfDocument.fromZip("./html-zip.zip", {
  mainHtmlFile: "index.html"
}).then(async (pdf) => {
  return await pdf.saveAs("html-zip-to-pdf.pdf");
});

import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Convert an HTML file from a ZIP archive to PDF
PdfDocument.fromZip("./html-zip.zip", {
  mainHtmlFile: "index.html"
}).then(async (pdf) => {
  return await pdf.saveAs("html-zip-to-pdf.pdf");
});

JavaScript

PDF generado a partir del archivo ZIP HTML, mostrando el logo de IronPDF y un encabezado estilizado en un fondo negro Creación de PDF usando PdfDocument.fromZip. La función renderiza correctamente el código HTML del archivo ZIP junto con sus recursos agrupados.**

¿Qué opciones de renderizado avanzadas soporta IronPDF?

La interfaz ChromePdfRenderOptions expone propiedades para personalizar de manera granular el comportamiento de renderización de PDF. Estas configuraciones se aplican antes de que se genere el PDF y cubren el diseño, la apariencia visual y casos límite para contenido dinámico.

IronPDF aplica configuraciones de renderizado predeterminadas a cada conversión. Recupere estos valores predeterminados con la función defaultChromePdfRenderOptions:

import { defaultChromePdfRenderOptions } from "@ironsoftware/ironpdf";

// Retrieve a ChromePdfRenderOptions object with default settings
var options = defaultChromePdfRenderOptions();

import { defaultChromePdfRenderOptions } from "@ironsoftware/ironpdf";

// Retrieve a ChromePdfRenderOptions object with default settings
var options = defaultChromePdfRenderOptions();

JavaScript

Modifique las propiedades del objeto devuelto según sea necesario y páselo al parámetro renderOptions de cualquier método de conversión.

¿Cómo agregar encabezados y pies de página?

Las propiedades textHeader y textFooter agregan contenido personalizado basado en texto a cada página de un nuevo PDF renderizado. El ejemplo siguiente crea un PDF desde la página de inicio de búsqueda de Google con un encabezado y pie de página personalizados, cada uno con una fuente diferente:

import { PdfDocument, defaultChromePdfRenderOptions, AffixFonts } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Start from default render options
var options = defaultChromePdfRenderOptions();

// Configure a text-based header
options.textHeader = {
  centerText: "https://www.adobe.com",
  dividerLine: true,
  font: AffixFonts.CourierNew,
  fontSize: 12,
  leftText: "URL to PDF"
};

// Configure a text-based footer
options.textFooter = {
  centerText: "IronPDF for Node.js",
  dividerLine: true,
  fontSize: 14,
  font: AffixFonts.Helvetica,
  rightText: "HTML to PDF in Node.js"
};

// Render the page with custom headers and footers applied
PdfDocument.fromUrl("https://www.google.com/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("add-custom-headers-footers-1.pdf");
});

import { PdfDocument, defaultChromePdfRenderOptions, AffixFonts } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Start from default render options
var options = defaultChromePdfRenderOptions();

// Configure a text-based header
options.textHeader = {
  centerText: "https://www.adobe.com",
  dividerLine: true,
  font: AffixFonts.CourierNew,
  fontSize: 12,
  leftText: "URL to PDF"
};

// Configure a text-based footer
options.textFooter = {
  centerText: "IronPDF for Node.js",
  dividerLine: true,
  fontSize: 14,
  font: AffixFonts.Helvetica,
  rightText: "HTML to PDF in Node.js"
};

// Render the page with custom headers and footers applied
PdfDocument.fromUrl("https://www.google.com/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("add-custom-headers-footers-1.pdf");
});

JavaScript

PDF generado desde la página de inicio de Google con un encabezado y pie de página de texto personalizado añadidos Un PDF generado desde la página principal de Google con un encabezado y pie de página de texto personalizado aplicados usando textHeader y textFooter.

Para diseños de encabezado y pie de página más ricos, use las propiedades htmlHeader y htmlFooter en su lugar. Estas aceptan fragmentos de HTML sin procesar, dando control total sobre tipografía, imágenes y alineación. El siguiente ejemplo centra la URL de la página en negrita en el encabezado e incrusta una imagen de logo en el pie de página:

import { PdfDocument, defaultChromePdfRenderOptions } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Start from default render options
var options = defaultChromePdfRenderOptions();

// Define a rich HTML header
options.htmlHeader = {
  htmlFragment: "<strong>https://www.google.com/</strong>",
  dividerLine: true,
  dividerLineColor: "blue",
  loadStylesAndCSSFromMainHtmlDocument: true,
};

// Define a rich HTML footer with a logo
options.htmlFooter = {
  htmlFragment: "<img src='logo.png' alt='IronPDF for Node.js' style='display: block; width: 150px; height: auto; margin-left: auto; margin-right: auto;'>",
  dividerLine: true,
  loadStylesAndCSSFromMainHtmlDocument: true
};

// Apply custom HTML headers and footers during rendering
await PdfDocument.fromUrl("https://www.google.com/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("add-html-headers-footers.pdf");
});

import { PdfDocument, defaultChromePdfRenderOptions } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Start from default render options
var options = defaultChromePdfRenderOptions();

// Define a rich HTML header
options.htmlHeader = {
  htmlFragment: "<strong>https://www.google.com/</strong>",
  dividerLine: true,
  dividerLineColor: "blue",
  loadStylesAndCSSFromMainHtmlDocument: true,
};

// Define a rich HTML footer with a logo
options.htmlFooter = {
  htmlFragment: "<img src='logo.png' alt='IronPDF for Node.js' style='display: block; width: 150px; height: auto; margin-left: auto; margin-right: auto;'>",
  dividerLine: true,
  loadStylesAndCSSFromMainHtmlDocument: true
};

// Apply custom HTML headers and footers during rendering
await PdfDocument.fromUrl("https://www.google.com/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("add-html-headers-footers.pdf");
});

JavaScript

PDF generado con un encabezado basado en HTML que muestra la URL de la página en negrita y un pie de página basado en HTML que muestra el logo de IronPDF IronPDF soporta encabezados y pies de página basados en HTML, dando control total sobre la marca y el diseño en cada página.

¿Cómo controlas el tamaño de página, orientación y márgenes?

Las propiedades margin, paperSize, fitToPaperMode, paperOrientation y grayScale en ChromePdfRenderOptions controlan el diseño físico de cada página renderizada. El ejemplo siguiente convierte la página de inicio de Google con márgenes personalizados, orientación apaisada A5 y salida en escala de grises:

import { PdfDocument, defaultChromePdfRenderOptions, PaperSize, FitToPaperModes, PdfPaperOrientation } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Start from default render options
var options = defaultChromePdfRenderOptions();

// Set page margins in millimeters
options.margin = {
  top: 50,
  bottom: 50,
  left: 60,
  right: 60
};

// Configure paper size, fit mode, orientation, and color mode
options.paperSize = PaperSize.A5;
options.fitToPaperMode = FitToPaperModes.FitToPage;
options.paperOrientation = PdfPaperOrientation.Landscape;
options.grayScale = true;

// Render with the customized layout settings
PdfDocument.fromUrl("https://www.google.com/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("set-margins-and-page-size.pdf");
});

import { PdfDocument, defaultChromePdfRenderOptions, PaperSize, FitToPaperModes, PdfPaperOrientation } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Start from default render options
var options = defaultChromePdfRenderOptions();

// Set page margins in millimeters
options.margin = {
  top: 50,
  bottom: 50,
  left: 60,
  right: 60
};

// Configure paper size, fit mode, orientation, and color mode
options.paperSize = PaperSize.A5;
options.fitToPaperMode = FitToPaperModes.FitToPage;
options.paperOrientation = PdfPaperOrientation.Landscape;
options.grayScale = true;

// Render with the customized layout settings
PdfDocument.fromUrl("https://www.google.com/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("set-margins-and-page-size.pdf");
});

JavaScript

La enumeración PaperSize incluye tamaños de papel estándar como A4, A5, Letter y Legal. La enumeración PdfPaperOrientation admite Portrait y Landscape. Estas configuraciones permiten un control preciso sobre las dimensiones de salida para documentos listos para imprimir.

Consejos: Al generar PDFs para flujos de trabajo de impresión, siempre especifique los márgenes explícitamente. Los márgenes predeterminados pueden no coincidir con los requisitos de su impresora o formato de papel de destino.

¿Cómo manejas las páginas web dinámicas?

Las páginas que cargan contenido de forma asincrónica - a través de temporizadores de JavaScript, carga diferida, o llamadas API - pueden no estar completamente renderizadas cuando el motor de IronPDF las captura. El mecanismo WaitFor, configurado a través de la propiedad waitFor en ChromePdfRenderOptions, instruye al renderizador de Chrome para que pause hasta que se cumplan condiciones específicas antes de capturar la página.

El siguiente bloque de código configura IronPDF para esperar 20 segundos antes de capturar el contenido de la página:

import { PdfDocument, defaultChromePdfRenderOptions, WaitForType } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Configure the renderer to wait 20 seconds before capturing
var options = defaultChromePdfRenderOptions();
options.waitFor = {
  type: WaitForType.RenderDelay,
  delay: 20000
};

PdfDocument.fromUrl("https://ironpdf.com/nodejs/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("waitfor-renderdelay.pdf");
});

import { PdfDocument, defaultChromePdfRenderOptions, WaitForType } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Configure the renderer to wait 20 seconds before capturing
var options = defaultChromePdfRenderOptions();
options.waitFor = {
  type: WaitForType.RenderDelay,
  delay: 20000
};

PdfDocument.fromUrl("https://ironpdf.com/nodejs/", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("waitfor-renderdelay.pdf");
});

JavaScript

Alternativamente, configure IronPDF para esperar hasta que aparezca un elemento DOM específico antes de renderizar. Esto es útil para páginas donde el contenido se inyecta después de que un framework de JavaScript termina de montar:

import { PdfDocument, defaultChromePdfRenderOptions, WaitForType } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Configure the renderer to wait for a specific DOM element (up to 20 seconds)
var options = defaultChromePdfRenderOptions();
options.waitFor = {
  type: WaitForType.HtmlElement,
  htmlQueryStr: "div.ProseMirror",
  maxWaitTime: 20000,
};

PdfDocument.fromUrl("https://app.surferseo.com/drafts/s/V7VkcdfgFz-dpkldsfHDGFFYf4jjSvvjsdf", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("waitfor-htmlelement.pdf");
});

import { PdfDocument, defaultChromePdfRenderOptions, WaitForType } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

// Configure the renderer to wait for a specific DOM element (up to 20 seconds)
var options = defaultChromePdfRenderOptions();
options.waitFor = {
  type: WaitForType.HtmlElement,
  htmlQueryStr: "div.ProseMirror",
  maxWaitTime: 20000,
};

PdfDocument.fromUrl("https://app.surferseo.com/drafts/s/V7VkcdfgFz-dpkldsfHDGFFYf4jjSvvjsdf", { renderOptions: options }).then(async (pdf) => {
  return await pdf.saveAs("waitfor-htmlelement.pdf");
});

JavaScript

La estrategia WaitForType.HtmlElement utiliza un selector de consulta CSS estándar. El renderizador sondea la presencia del elemento hasta que transcurren maxWaitTime milisegundos o se encuentra el elemento, lo que ocurra primero.

Advertencia: Establecer tiempos de espera excesivamente largos puede incrementar significativamente el tiempo de generación de PDF en aplicaciones de alto rendimiento. Use el retraso mínimo que capture de manera confiable el contenido que su caso de uso requiere.

¿Cómo generas PDFs a partir de una plantilla HTML?

Un patrón común de automatización en el mundo real es generar un lote de PDFs a partir de una plantilla HTML compartida, sustituyendo valores de marcador de posición con datos de una base de datos, API, o hoja de cálculo. El método replaceText de IronPDF en PdfDocument maneja esto directamente.

La plantilla de factura de ejemplo a continuación (adaptada de una plantilla de factura en CodePen accesible públicamente) utiliza marcadores de posición con llaves como {COMPANY-NAME}, {FULL-NAME} y {INVOICE-NUMBER} para contenido sustituible:

Plantilla HTML de factura de ejemplo con etiquetas de marcador de posición para la sustitución de datos dinámicos Una plantilla de factura de muestra con etiquetas de marcador de posición. El código de JavaScript reemplazará cada etiqueta con datos reales antes de que el documento se guarde como PDF.

El siguiente código carga la plantilla, reemplaza cada marcador de posición con datos de prueba y guarda el resultado como PDF:

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/html-template-to-pdf.js
import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

/**
 * Loads an HTML template from the file system as a PdfDocument.
 */
async function getTemplateHtml(fileLocation) {
  return PdfDocument.fromHtml(fileLocation);
}

/**
 * Saves a PdfDocument to the specified file path.
 */
async function generatePdf(pdf, location) {
  return pdf.saveAs(location);
}

/**
 * Replaces a named placeholder in the PdfDocument with a data value.
 */
async function addTemplateData(pdf, key, value) {
  return pdf.replaceText(key, value);
}

// Path to the HTML invoice template
const template = "./sample-invoice.html";

// Load the template, fill in all placeholder values, then save the PDF
getTemplateHtml(template).then(async (doc) => {
    await addTemplateData(doc, "{FULL-NAME}", "Lizbeth Presland");
    await addTemplateData(doc, "{ADDRESS}", "678 Manitowish Alley, Portland, OG");
    await addTemplateData(doc, "{PHONE-NUMBER}", "(763) 894-4345");
    await addTemplateData(doc, "{INVOICE-NUMBER}", "787");
    await addTemplateData(doc, "{INVOICE-DATE}", "August 28, 2023");
    await addTemplateData(doc, "{AMOUNT-DUE}", "13,760.13");
    await addTemplateData(doc, "{RECIPIENT}", "Celestyna Farmar");
    await addTemplateData(doc, "{COMPANY-NAME}", "BrainBook");
    await addTemplateData(doc, "{TOTAL}", "13,760.13");
    await addTemplateData(doc, "{AMOUNT-PAID}", "0.00");
    await addTemplateData(doc, "{BALANCE-DUE}", "13,760.13");
    await addTemplateData(doc, "{ITEM}", "Training Sessions");
    await addTemplateData(doc, "{DESCRIPTION}", "60 Minute instruction");
    await addTemplateData(doc, "{RATE}", "3,440.03");
    await addTemplateData(doc, "{QUANTITY}", "4");
    await addTemplateData(doc, "{PRICE}", "13,760.13");
    return doc;
}).then(async (doc) => await generatePdf(doc, "html-template-to-pdf.pdf"));

//:path=/static-assets/ironpdf-nodejs/content-code-examples/tutorials/html-to-pdf/html-template-to-pdf.js
import { PdfDocument } from "@ironsoftware/ironpdf";
import './config.js'; // Import the configuration script

/**
 * Loads an HTML template from the file system as a PdfDocument.
 */
async function getTemplateHtml(fileLocation) {
  return PdfDocument.fromHtml(fileLocation);
}

/**
 * Saves a PdfDocument to the specified file path.
 */
async function generatePdf(pdf, location) {
  return pdf.saveAs(location);
}

/**
 * Replaces a named placeholder in the PdfDocument with a data value.
 */
async function addTemplateData(pdf, key, value) {
  return pdf.replaceText(key, value);
}

// Path to the HTML invoice template
const template = "./sample-invoice.html";

// Load the template, fill in all placeholder values, then save the PDF
getTemplateHtml(template).then(async (doc) => {
    await addTemplateData(doc, "{FULL-NAME}", "Lizbeth Presland");
    await addTemplateData(doc, "{ADDRESS}", "678 Manitowish Alley, Portland, OG");
    await addTemplateData(doc, "{PHONE-NUMBER}", "(763) 894-4345");
    await addTemplateData(doc, "{INVOICE-NUMBER}", "787");
    await addTemplateData(doc, "{INVOICE-DATE}", "August 28, 2023");
    await addTemplateData(doc, "{AMOUNT-DUE}", "13,760.13");
    await addTemplateData(doc, "{RECIPIENT}", "Celestyna Farmar");
    await addTemplateData(doc, "{COMPANY-NAME}", "BrainBook");
    await addTemplateData(doc, "{TOTAL}", "13,760.13");
    await addTemplateData(doc, "{AMOUNT-PAID}", "0.00");
    await addTemplateData(doc, "{BALANCE-DUE}", "13,760.13");
    await addTemplateData(doc, "{ITEM}", "Training Sessions");
    await addTemplateData(doc, "{DESCRIPTION}", "60 Minute instruction");
    await addTemplateData(doc, "{RATE}", "3,440.03");
    await addTemplateData(doc, "{QUANTITY}", "4");
    await addTemplateData(doc, "{PRICE}", "13,760.13");
    return doc;
}).then(async (doc) => await generatePdf(doc, "html-template-to-pdf.pdf"));

JavaScript

El código anterior define tres funciones auxiliares asíncronas:

getTemplateHtml: Carga un archivo HTML en un objeto PdfDocument usando PdfDocument.fromHtml.
addTemplateData: Llama a PdfDocument.replaceText para sustituir una clave de marcador de posición con su valor de datos real.
generatePdf: Escribe el PdfDocument completado en una ruta de archivo de destino.

Cada llamada replaceText opera directamente sobre la representación de PDF en memoria, por lo que se pueden encadenar múltiples reemplazos sin recargar el documento desde el disco. El PDF resultante retiene todos los estilos CSS, fuentes y diseño de la plantilla original.

Documento PDF generado a partir de la plantilla de factura después de que todos los marcadores de posición han sido reemplazados por datos reales La factura PDF completa con valores de marcador de posición reemplazados por datos reales. Los estilos CSS y el diseño de la plantilla original se conservan exactamente.

Este enfoque escala bien para la generación de documentos por lotes. Llame a getTemplateHtml una vez por cada registro para crear un nuevo PdfDocument para cada archivo de salida, luego encadene las llamadas addTemplateData para los datos de ese registro antes de llamar a generatePdf.

¿Cuáles son los próximos pasos?

Este tutorial cubre los métodos principales de conversión de HTML a PDF y las opciones de renderizado más utilizadas en IronPDF for Node.js. Los temas a continuación extienden lo que ha aprendido aquí en áreas más especializadas.

Editar y Estampar PDFs en Node.js - Aplique sellos, anotaciones y ediciones de texto a documentos PDF existentes programáticamente.
Unir y Dividir PDFs en Node.js - Combine múltiples PDFs en un solo documento o divida un PDF en páginas separadas.
Agregar Marcas de Agua a PDFs en Node.js - Aplique marcas de agua de texto o imagen en cada página de un PDF con control de posicionamiento preciso.
IronPDF Node.js API Reference - Explore toda la API para PdfDocument, ChromePdfRenderOptions, WaitFor, AffixFonts y todas las demás clases e interfaces exportadas.
Obtenga una Clave de Licencia de Prueba Gratuita - Genere PDFs de calidad de producción sin marcas de agua activando una licencia de prueba gratuita de 30 días.

Preguntas Frecuentes

¿Cómo se convierte HTML a PDF en Node.js?

Usa la biblioteca IronPDF. Instálala con npm install @ironsoftware/ironpdf, luego llama a PdfDocument.fromHtml con una cadena HTML o ruta de archivo, o PdfDocument.fromUrl con una dirección web. Guarda el resultado con PdfDocument.saveAs.

¿Cómo se convierte una cadena de HTML a PDF en Node.js?

Llama a PdfDocument.fromHtml con la cadena HTML como argumento. El método devuelve una Promesa que se resuelve en una instancia de PdfDocument. Encadena saveAs en el resultado para escribir el PDF en el disco.

¿Cómo se convierte un archivo HTML local a PDF en Node.js?

Pasa una ruta válida del sistema de archivos a PdfDocument.fromHtml en lugar de una cadena HTML. IronPDF resuelve rutas relativas de CSS, imágenes y scripts de la misma manera que un navegador al cargar el archivo.

¿Cómo se convierte una URL a PDF en Node.js?

Llama a PdfDocument.fromUrl con la URL objetivo. IronPDF obtiene la página usando su motor de renderizado Chrome y produce un PDF de píxeles perfectos. La URL objetivo debe ser accesible públicamente desde el host que ejecuta IronPDF.

¿Cómo se añaden encabezados y pies de página a un PDF en Node.js?

Configura las propiedades textHeader y textFooter en un objeto ChromePdfRenderOptions para encabezados y pies de página de texto simples. Para diseños más ricos, usa htmlHeader y htmlFooter con fragmentos HTML en bruto. Pasa el objeto de opciones al parámetro renderOptions de cualquier método de conversión.

¿Cómo se cambia el tamaño de página y la orientación en IronPDF for Node.js?

Establece options.paperSize a un valor del enumerado PaperSize (como PaperSize.A4 o PaperSize.Letter) y establece options.paperOrientation en PdfPaperOrientation.Portrait o PdfPaperOrientation.Landscape. Pasa las opciones configuradas al método de conversión.

¿Cómo se maneja el contenido dinámico de JavaScript al convertir a PDF?

Usa la propiedad waitFor en ChromePdfRenderOptions. Establece type en WaitForType.RenderDelay y proporciona un retraso en milisegundos, o establece type en WaitForType.HtmlElement y proporciona un selector de consulta CSS. IronPDF pausará el renderizado hasta que se cumpla la condición.

¿Cómo se convierte un archivo HTML dentro de un archivo ZIP a PDF?

Llama a PdfDocument.fromZip con la ruta al archivo ZIP como primer argumento y un objeto de opciones como segundo. Establece la propiedad mainHtmlFile en el nombre del archivo HTML dentro del archivo que debe ser convertido.

¿Cómo se elimina la marca de agua de IronPDF de los PDFs generados?

Aplica una clave de licencia válida a la configuración global antes de llamar a cualquier método de conversión. Recupera el objeto de configuración con IronPdfGlobalConfig.getConfig() y establece config.licenseKey en tu clave. Una licencia de prueba gratuita está disponible en ironpdf.com.

¿Cómo se generan PDFs a partir de una plantilla HTML en Node.js?

Carga la plantilla con PdfDocument.fromHtml, luego llama a PdfDocument.replaceText para cada marcador de posición en la plantilla, pasando la cadena de marcador de posición y su valor de reemplazo. Una vez completadas todas las sustituciones, llama a saveAs para escribir el PDF final.

Curtis Chau

Chatea con el equipo de ingeniería ahora

Escritor Técnico

Curtis Chau tiene una licenciatura en Ciencias de la Computación (Carleton University) y se especializa en el desarrollo front-end con experiencia en Node.js, TypeScript, JavaScript y React. Apasionado por crear interfaces de usuario intuitivas y estéticamente agradables, disfruta trabajando con frameworks modernos y creando manuales bien estructurados y visualmente atractivos.

...