Incrustación de mapas de bits e imágenes
import {PdfDocument} from "@ironsoftware/ironpdf";
import fs from 'fs';

(async () => {
    // Image file path
    const filePath = 'iron.png';

    // Read bytes from a file using fs.readFile
    fs.readFile(filePath, (err, data) => {
    if (err) {
        console.error('Error reading file:', err);
        return;
    }

    let binaryString = '';
    data.forEach((byte) => {
        binaryString += String.fromCharCode(byte);
      });

    // Convert the binary string to base64
    const base64String = btoa(binaryString);

    // Insert base64 to img element
    const imgHtml = `<img src='data:image/png;base64,${base64String}'>`;

    // Render HTML content with the embedded image to a PDF
    const pdf = PdfDocument.fromHtml(imgHtml).then(
        (returnedPdf)=>{
            // Save the PDF
            returnedPdf.saveAs("embedded_example_1.pdf")
        });
    });
})();
npm i @ironsoftware/ironpdf
Incrustación de mapas de bits e imágenes

Incrustación de mapas de bits e imágenes

Para garantizar que el contenido HTML no requiera una conexión a Internet para recuperar los datos, las imágenes pueden incrustarse en HTML como base64. Incrustar una imagen en HTML como base64 requiere cargar la imagen y convertir su información a base64.

A continuación, se muestra un ejemplo completo que demuestra cómo leer un archivo de imagen, convertirlo a una cadena base64, y luego incrustarlo en un documento HTML. Finalmente, muestra cómo generar un PDF desde este HTML usando IronPDF.

Explicación:

  1. Codificación de Imagen a Base64:

    • encodeImageToBase64(filePath): Una función que lee el archivo de imagen y lo convierte a una cadena base64 de forma asincrónica.
    • Utiliza fs.readFile para leer el archivo de imagen. Si tiene éxito, convierte los datos a una cadena base64 y la resuelve.

  2. Configuración de Contenido HTML:

    • createHtmlContent(base64Data): Construye contenido HTML con los datos de imagen en base64 incrustados dentro de una etiqueta img.

  3. Generación de PDF:

    • generatePdf(filePath): Función principal que orquesta el proceso llamando primero a encodeImageToBase64 y luego a createHtmlContent, seguido de la creación de un PDF a través de IronPdf.
    • Utiliza IronPdf.PdfDocument.fromHtml para generar un documento PDF a partir del contenido HTML.
    • Guarda el PDF generado usando pdf.saveAs.

  4. Ejecución:

    • Llama a generatePdf con la ruta al archivo de imagen deseado.

Este script combina efectivamente la lectura de una imagen, su conversión a base64 para incrustación en HTML, y el renderizado de un PDF usando IronPDF.

Explore el ejemplo completo de incrustación de imágenes Base64
Ver en GitHub

¿Listo para empezar?

Versión:2026.11recién publicada

Instalación gratuita con npm