Using Headless Chrome with Puppeteer

The App Engine standard environment comes with all of the system packages needed to run Headless Chrome.

Puppeteer is a Node.js module which provides a high-level API to control Headless Chrome. You can install Puppeteer using npm:

npm install puppeteer

Starting a browser

Headless Chrome can only be used in the App Engine standard environment by disabling the sandbox. To start a browser, use the following:

const browser = await puppeteer.launch({
  args: ['--no-sandbox']
});

The memory available on a default App Engine instance is not enough to run Headless Chrome. We recommend choosing an instance class that has more memory using the instance_class element in your app.yaml file, for example:

runtime: nodejs8
instance_class: F4_1G

Taking screenshots

Learn how to take screenshots of web pages using Headless Chrome in the Google App Engine standard environment.

Prerequisites

  1. Create a project in the Google Cloud Platform Console.
  2. Enable billing for your project.
  3. Install the Cloud SDK.
  4. Install Node.js on your local machine.

Writing the app

  1. Initialize a package.json file by running the following command in your terminal:

    npm init
    
  2. Add a start script to your package.json file:

    "scripts": {
      "start": "node app.js"
    }
    
  3. Install Express.js and Puppeteer:

    npm install express puppeteer
    
  4. Create an app.js file with the following contents:

    const express = require('express');
    const puppeteer = require('puppeteer');
    const app = express();
    
    app.use(async (req, res) => {
      const url = req.query.url;
    
      if (!url) {
        return res.send('Please provide URL as GET parameter, for example: <a href="/?url=https://example.com">?url=https://example.com</a>');
      }
    
      const browser = await puppeteer.launch({
        args: ['--no-sandbox']
      });
      const page = await browser.newPage();
      await page.goto(url);
      const imageBuffer = await page.screenshot();
      browser.close();
    
      res.set('Content-Type', 'image/png');
      res.send(imageBuffer);
    });
    
    const server = app.listen(process.env.PORT || 8080, err => {
      if (err) return console.error(err);
      const port = server.address().port;
      console.info(`App listening on port ${port}`);
    });

Running the app locally

  1. Run the app locally with the following command:

    npm start
    
  2. Visit http://localhost:8080/?url=https://example.com to see a screenshot of the example.com web page.

Deploying the app

  1. Create an app.yaml file with the following contents:

    runtime: nodejs8
    instance_class: F4_1G

  2. Run the following command to deploy your app to App Engine:

    gcloud app deploy
    
  3. Visit http://YOUR_PROJECT_ID.appspot.com/?url=https://example.com to see the application running on App Engine.

Was this page helpful? Let us know how we did:

Send feedback about...

App Engine standard environment for Node.js docs