Posted by Arjun on Tuesday 28th July 2020

Generate a PDF from HTML with puppeteer

puppeteer

In this post, we gonna use Puppeteer to generate PDF files from HTML. With Puppeteer we can also generate screenshots. What is Puppeteer? The documentation says:

Puppeteer is a Node library that provides a high-level API to control Chrome or Chromium over the DevTools Protocol. Puppeteer runs headless by default but can be configured to run full (non-headless) Chrome or Chromium.

In this tutorial, we will use the following npm module -
express - A Node.js based web framework
body-parser - Node.js body parsing middleware.
puppeteer - Puppeteer is a Node library which provides a high-level API to control Chrome

Let's create a folder for the project and initialize it, by running npm init.

$ mkdir puppeteerPdfDemo
$ cd puppeteerPdfDemo
$ npm init --yes

you will see the similar output in your terminal

Wrote to C:\Users\LENOVO\Desktop\puppeteerPdfDemo\package.json:
{
  "name": "puppeteerPdfDemo",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}
install project dependencies
npm install express --save
npm install body-parser --save
npm install puppeteer --save
npm install handlebars --save
Create a express server

create a file called index.js in the project root folder with below code.

const express = require('express')
const bodyParser = require('body-parser')
const puppeteer = require('puppeteer');
const app = express()

// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))
// parse application/json
app.use(bodyParser.json())

app.get("/generate-pdf-from-url", async (req, res, __) => {
    let result = await saveToPdf(req.query.url);
    res.attachment(`PDF-from-URL-puppeteer.pdf`);
    res.contentType("application/pdf");
    res.send(result);
});

// helper functions
const saveToPdf = async url => {
    // Browser actions & buffer creator
    const browser = await puppeteer.launch({
      args: ["--no-sandbox", "--disable-setuid-sandbox"] 
    });
    const page = await browser.newPage();
    await page.goto(url);
    const pdf = await page.pdf();
    await browser.close();
    // Return Buffer
    return pdf;
};
app.listen(3000,() => {
 console.log(`http://localhost:3000/ app is running.`);
})

Now run the application, with node index.js and once it is up you can access the app as shown below
http://localhost:3000/generate-pdf-from-url?url=https:://arjunphp.com