HTML to Image / Node.js Examples

This page contains various examples of using the HTML to Image API in Node.js. The examples are complete and fully functional. Read more about how to convert HTML to Image in Node.js.

Basic examples
Template rendering examples
Express.js examples

Basic examples

Webpage to PNG file

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertUrlToFile(
    "http://www.example.com",
    "example.png",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
    });

Webpage to PNG file via callback

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// use predefined callback for saving to a file
var callbacks = pdfcrowd.saveToFile("example.png");

// set custom error callback
callbacks.error = function(errMessage, statusCode) {
    // use predefined helper class for errors
    const error = new pdfcrowd.Pdfcrowd.Error(errMessage, statusCode);
    console.error("PDFCrowd Error: " + error);
};

// Run the conversion and save the result to a file.
client.convertUrl("http://www.example.com", callbacks);

HTML file to PNG file

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertFileToFile(
    "/path/to/MyLayout.html",
    "MyLayout.png",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
    });

HTML file to PNG file via callback

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// use predefined callback for saving to a file
var callbacks = pdfcrowd.saveToFile("MyLayout.png");

// set custom error callback
callbacks.error = function(errMessage, statusCode) {
    // use predefined helper class for errors
    const error = new pdfcrowd.Pdfcrowd.Error(errMessage, statusCode);
    console.error("PDFCrowd Error: " + error);
};

// Run the conversion and save the result to a file.
client.convertFile("/path/to/MyLayout.html", callbacks);

HTML string to PNG file

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertStringToFile(
    "<html><body><h1>Hello World!</h1></body></html>",
    "HelloWorld.png",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
    });

HTML string to PNG file via callback

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// use predefined callback for saving to a file
var callbacks = pdfcrowd.saveToFile("HelloWorld.png");

// set custom error callback
callbacks.error = function(errMessage, statusCode) {
    // use predefined helper class for errors
    const error = new pdfcrowd.Pdfcrowd.Error(errMessage, statusCode);
    console.error("PDFCrowd Error: " + error);
};

// Run the conversion and save the result to a file.
client.convertString("<html><body><h1>Hello World!</h1></body></html>", callbacks);

Get info about the current conversion

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
    client.setDebugLog(true);
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertFileToFile(
    "/path/to/MyLayout.html",
    "MyLayout.png",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
        
        // print URL pointing to the debug log for this request.
        console.log("Debug log url: " + client.getDebugLogUrl());
        
        // print Number of conversion credits remaining in your account.
        console.log("Remaining credit count: " + client.getRemainingCreditCount());
        
        // print Number of credits consumed for this conversion.
        console.log("Consumed credit count: " + client.getConsumedCreditCount());
        
        // print Unique identifier assigned to this conversion job.
        console.log("Job id: " + client.getJobId());
        
        // print Size of the output data in bytes.
        console.log("Output size: " + client.getOutputSize());
    });

Template rendering examples

Create Image from JSON data

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
    client.setDataString(`{
            "name": "World",
            "product": "Pdfcrowd API"
        }`);
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertStringToFile(
    "Hello {{ name }} from {{ product }}",
    "output.pdf",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
    });

Create Image from XML data

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
    client.setDataString(`<?xml version="1.0" encoding="UTF-8"?>
        <data>
          <name>World</name>
          <product>Pdfcrowd API</product>
        </data>`);
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertStringToFile(
    "Hello {{ data.name }} from {{ data.product }}",
    "output.pdf",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
    });

Create Image from YAML data

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
    client.setDataString(`name: World
product: Pdfcrowd API`);
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertStringToFile(
    "Hello {{ name }} from {{ product }}",
    "output.pdf",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
    });

Create Image from CSV data

var pdfcrowd = require("pdfcrowd");

// Create an API client instance.
var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

try {
    // Configure the conversion.
    client.setOutputFormat("png");
    client.setDataString(`name,product
World,Pdfcrowd API`);
} catch(why) {
    // Report the error.
    console.error("PDFCrowd Error: " + why);
    process.exit(1);
}

// Run the conversion and save the result to a file.
client.convertStringToFile(
    "Hello {{ name }} from {{ product }}",
    "output.pdf",
    function(err, fileName) {
        if (err) return console.error("PDFCrowd Error: " + err);
        console.log("Success: the file was created " + fileName);
    });

Express.js examples

Webpage to PNG in Express.js

"use strict";

const express = require("express");
const app = express();
const pdfcrowd = require("pdfcrowd");

// The recommended method is POST.
app.post("/", (req, res) => {
    // Create an API client instance.
    var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

    // configure the callback to send a file in the HTTP response
    var callbacks = pdfcrowd.sendImageInHttpResponse(
        res, "image/png", "example.png", "attachment");

    // configure the callback to send an error in the HTTP response
    callbacks.error = function(errMessage, statusCode) {
        res.set('Content-Type', 'text/plain');
        res.status(statusCode || 400);
        res.send(errMessage);
    }

    // Configure the conversion.
    try {
        client.setOutputFormat("png");
    } catch(why) {
        if(why instanceof pdfcrowd.Pdfcrowd.Error) {
            callbacks.error(why.toString(), why.getStatusCode());
        } else {
            callbacks.error(why);
        }
        return;
    }

    // Run the conversion.
    client.convertUrl("http://www.example.com", callbacks);
});

module.exports = app;

HTML file to PNG in Express.js

"use strict";

const express = require("express");
const app = express();
const pdfcrowd = require("pdfcrowd");

// The recommended method is POST.
app.post("/", (req, res) => {
    // Create an API client instance.
    var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

    // configure the callback to send a file in the HTTP response
    var callbacks = pdfcrowd.sendImageInHttpResponse(
        res, "image/png", "MyLayout.png", "attachment");

    // configure the callback to send an error in the HTTP response
    callbacks.error = function(errMessage, statusCode) {
        res.set('Content-Type', 'text/plain');
        res.status(statusCode || 400);
        res.send(errMessage);
    }

    // Configure the conversion.
    try {
        client.setOutputFormat("png");
    } catch(why) {
        if(why instanceof pdfcrowd.Pdfcrowd.Error) {
            callbacks.error(why.toString(), why.getStatusCode());
        } else {
            callbacks.error(why);
        }
        return;
    }

    // Run the conversion.
    client.convertFile("/path/to/MyLayout.html", callbacks);
});

module.exports = app;

HTML string to PNG in Express.js

"use strict";

const express = require("express");
const app = express();
const pdfcrowd = require("pdfcrowd");

// The recommended method is POST.
app.post("/", (req, res) => {
    // Create an API client instance.
    var client = new pdfcrowd.HtmlToImageClient("demo", "ce544b6ea52a5621fb9d55f8b542d14d");

    // configure the callback to send a file in the HTTP response
    var callbacks = pdfcrowd.sendImageInHttpResponse(
        res, "image/png", "HelloWorld.png", "attachment");

    // configure the callback to send an error in the HTTP response
    callbacks.error = function(errMessage, statusCode) {
        res.set('Content-Type', 'text/plain');
        res.status(statusCode || 400);
        res.send(errMessage);
    }

    // Configure the conversion.
    try {
        client.setOutputFormat("png");
    } catch(why) {
        if(why instanceof pdfcrowd.Pdfcrowd.Error) {
            callbacks.error(why.toString(), why.getStatusCode());
        } else {
            callbacks.error(why);
        }
        return;
    }

    // Run the conversion.
    client.convertString("<html><body><h1>Hello World!</h1></body></html>", callbacks);
});

module.exports = app;