How to Convert HTML to PDF with JavaScript in NodeJS, Tutorial

Share this page

Why Convert HTML to PDF with JavaScript?

The pdfRest Convert to PDF API Tool is a powerful resource that allows developers to convert HTML files into PDFs using a simple API call. This tutorial will guide you through the process of sending an API call to convert HTML to PDF using JavaScript. By leveraging the capabilities of pdfRest, you can seamlessly integrate HTML-to-PDF conversion into your applications, enhancing their functionality and user experience.

For example, a business might need to convert dynamically generated HTML reports or web pages into PDFs for standardized sharing, archiving, or printing. Using the Convert to PDF API, this process can be automated, saving time and reducing the potential for human error. This is especially useful for companies that handle large volumes of HTML content and need to ensure consistency and reliability in their document management processes.

Convert HTML to PDF with JavaScript Code Example

var axios = require('axios');
var FormData = require('form-data');
var fs = require('fs');

// Create a new form data instance and append the HTML file and parameters to it
var data = new FormData();
data.append('file', fs.createReadStream('/path/to/file.html'));
data.append('output', 'pdfrest_pdf');

// define configuration options for axios request
var config = {
  method: 'post',
  maxBodyLength: Infinity, // set maximum length of the request body
  url: 'https://api.pdfrest.com/pdf', 
  headers: { 
    'Api-Key': 'xxxxxxxx-xxxx-xxxx-xxxxxxxxxxxx', // Replace with your API key
    ...data.getHeaders() // set headers for the request
  },
  data : data // set the data to be sent with the request
};

// send request and handle response or error
axios(config)
.then(function (response) {
  console.log(JSON.stringify(response.data));
})
.catch(function (error) {
  console.log(error); 
});

// If you would like to download the file instead of getting the JSON response, please see the 'get-resource-id-endpoint.js' sample.

Source: GitHub Repository

Breaking Down the Code

The code begins by importing necessary modules: axios for making HTTP requests, form-data for handling form data, and fs for file system operations.

var data = new FormData();
data.append('file', fs.createReadStream('/path/to/file.html'));
data.append('output', 'pdfrest_pdf');

Here, a new FormData instance is created to hold the HTML file and parameters. The file parameter uses fs.createReadStream to read the HTML file from the specified path. The output specifies the desired output format.

var config = {
  method: 'post',
  maxBodyLength: Infinity,
  url: 'https://api.pdfrest.com/pdf', 
  headers: { 
    'Api-Key': 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
    ...data.getHeaders()
  },
  data : data
};

This snippet defines the configuration for the axios request. The method is set to 'post', and maxBodyLength is set to Infinity to accommodate large files. The url specifies the API endpoint. The headers include the API key (which should be replaced with a valid key) and headers from the FormData instance. The data field contains the form data to be sent.

Beyond the Tutorial

In this tutorial, you learned how to use JavaScript to call the pdfRest Convert to PDF API, enabling the conversion of HTML files to PDF format. This process can be a valuable asset for automating document workflows and ensuring consistency across digital documents.

To explore more, try out all the pdfRest API Tools in the API Lab. For more detailed information, refer to the API Reference Guide.

Note: This is an example of a multipart API call. Code samples using JSON payloads can be found at GitHub Repository.