How to Convert HTML to PDF in Node.js using Puppeteer

Why Puppeteer?

• Ease of use: Puppeteer offers a simple and easy-to-use API that abstracts away the complexities of working with headless browsers.
• Powerful: Puppeteer provides extensive capabilities for manipulating web pages and interacting with browser elements.
• Scalable: With Puppeteer, you can easily scale your PDF generation process by running multiple browser instances in parallel.

Importing Puppeteer and fs

const puppeteer = require('puppeteer');
const fs = require('fs');

The code starts by importing two essential libraries: puppeteer, a versatile tool for controlling headless browsers like Chrome and Chromium, and fs, a built-in NodeJS module for handling file system operations. Puppeteer enables you to automate a wide range of web-based tasks, including rendering HTML, capturing screenshots, and generating PDF files.

Defining the exportWebsiteAsPdf Function

async function exportWebsiteAsPdf(html, outputPath) {
  // Create a browser instance
  const browser = await puppeteer.launch({
    headless: true // Launches the browser in headless mode
  });

  // Create a new page
  const page = await browser.newPage();

  // Set the HTML content for the page, waiting for DOM content to load
  await page.setContent(html, { waitUntil: 'domcontentloaded' });

  // To reflect CSS used for screens instead of print
  await page.emulateMediaType('screen');

  // Download the PDF
  const PDF = await page.pdf({
    path: outputPath,
    margin: { top: '100px', right: '50px', bottom: '100px', left: '50px' },
    printBackground: true,
    format: 'A4',
  });

  // Close the browser instance
  await browser.close();

  return PDF;
}

The exportWebsiteAsPdf function serves as the core of our code snippet. This asynchronous function accepts an html string and an outputPath as input parameters and returns a PDF file. The function performs the following steps:

1. Launches a new headless browser instance using Puppeteer.
2. Creates a new browser page.
3. Sets the provided html string as the page content, waiting for the DOM content to load.
4. Emulates the 'screen' media type to apply the CSS used for screens instead of print-specific styles.
5. Generates a PDF file from the loaded HTML content, specifying margins, background printing, and format (A4).
6. Closes the browser instance.
7. Returns the created PDF file.

Using the exportWebsiteAsPdf Function

// Usage example
// Get HTML content from HTML file
const html = fs.readFileSync('test.html', 'utf-8');

// Convert the HTML content into a PDF and save it to the specified path
exportWebsiteAsPdf(html, 'result.pdf').then(() => {
  console.log('PDF created successfully.');
}).catch((error) => {
  console.error('Error creating PDF:', error);
});

The last section of the code illustrates how to use the exportWebsiteAsPdf function. We perform the following steps:

1. Read the HTML content from an HTML file using the fs module's readFileSync method.
2. Call the exportWebsiteAsPdf function with the loaded html string and the desired outputPath.
3. Utilize a .then block to handle the successful PDF creation, logging a success message to the console.
4. Employ a .catch block to manage any errors that occur during the HTML to PDF conversion process, logging an error message to the console.

This code snippet provides a comprehensive example of how to convert an HTML template to a PDF file using NodeJS and Puppeteer. By implementing this solution, you can efficiently generate high-quality PDFs, meeting the needs of various applications and users.

Importing Puppeteer

const puppeteer = require('puppeteer');

The code starts by importing the Puppeteer library, which is a powerful tool for controlling headless browsers like Chrome and Chromium. Puppeteer allows you to automate a variety of web-based tasks, including rendering your HTML code, capturing screenshots, and in our case, generating PDF files.

Defining the exportWebsiteAsPdf Function

async function exportWebsiteAsPdf(websiteUrl, outputPath) {
  // Create a browser instance
  const browser = await puppeteer.launch({
    headless: true // Launches the browser in headless mode
  });

  // Create a new page
  const page = await browser.newPage();

  // Open the URL in the current page
  await page.goto(websiteUrl, { waitUntil: 'networkidle0' });

  // To reflect CSS used for screens instead of print
  await page.emulateMediaType('screen');

  // Download the PDF
  const PDF = await page.pdf({
    path: outputPath,
    margin: { top: '100px', right: '50px', bottom: '100px', left: '50px' },
    printBackground: true,
    format: 'A4',
  });

  // Close the browser instance
  await browser.close();

  return PDF;
}

The exportWebsiteAsPdf function is the core of our code snippet. This asynchronous function accepts a websiteUrl and an outputPath as its input parameters and returns a PDF file. The function performs the following steps:

1. Launches a new headless browser instance using Puppeteer.
2. Creates a new browser page.
3. Navigates to the provided websiteUrl and waits for the network to become idle using the waitUntil option set to networkidle0.
4. Emulates the 'screen' media type to ensure the CSS used for screens is applied instead of print-specific styles.
5. Converts the loaded web page to a PDF file with the specified margins, background printing, and format (A4).
6. Closes the browser instance.
7. Returns the generated PDF file.

Using the exportWebsiteAsPdf Function

// Usage example
// Convert the URL content into a PDF and save it to the specified path
exportWebsiteAsPdf('https://ironpdf.com/', 'result.pdf').then(() => {
  console.log('PDF created successfully.');
}).catch((error) => {
  console.error('Error creating PDF:', error);
});

The final section of the code demonstrates how to use the exportWebsiteAsPdf function. We execute the following steps:

1. Call the exportWebsiteAsPdf function with the desired websiteUrl and outputPath.
2. Use a then block to handle the successful PDF creation. In this block, we log a success message to the console.
3. Use a catch block to handle any errors that occur during the website to PDF conversion process. If an error occurs, we log an error message to the console.

By integrating this code snippet into your projects, you can effortlessly convert URLs into high-quality PDF files using NodeJS and Puppeteer.

Key Features of IronPDF

HTML to PDF Conversion with IronPDF: IronPDF allows you to convert HTML content, including CSS, to PDF files. This feature enables you to create pixel-perfect PDF documents from web pages or HTML templates.

URL Rendering: IronPDF can fetch web pages directly from a server using a URL and convert them to PDF files, making it easy to archive web content or generate reports from dynamic web pages.

Text, Image, and PDF Merging: IronPDF allows you to merge text, images, and existing PDF files into a single PDF document. This feature is particularly useful for creating complex documents with multiple sources of content.

PDF Manipulation: IronPDF provides tools for editing existing PDF files, such as adding or removing pages, modifying metadata, or even extracting text and images from PDF documents.