How to Add Text and Images to PDF in JavaScript using Web API

What is Web API? It is the flexible Web API that includes full set of functions from e-signature requests to data extraction, OCR, images recognition, PDF splitting and PDF splitting. Can also generate barcodes and read barcodes from images, scans and PDF. Web API is the REST API that provides a set of data extraction functions, tools for documents manipulation, splitting and merging of PDF files. It includes built-in OCR, images recognition, can generate and read barcodes from images, scans and PDF.

Adding text or images to existing PDF is a very useful feature, and we’ll be reviewing that in this articles. We’ll be using NodeJs in combination with API. This program specifically demonstrates how to add image, however text can be added in same way. The full code snippet can be found here, also other variation of source code in different languages can be found here.

Let’s start with reviewing source code and it’s output. We’ll be analyzing important code snippets later.

On-demand (REST Web API) version:
 Web API (on-demand version)

On-premise offline SDK for Windows:
 60 Day Free Trial (on-premise)


var https = require("https"); var path = require("path"); var fs = require("fs"); // The authentication key (API Key). // Get your own by registering at const API_KEY = "***********************************"; // Direct URL of source PDF file. // You can also upload your own file into and use it as url. Check "Upload File" samples for code snippets: const SourceFileUrl = ""; // Comma-separated list of page indices (or ranges) to process. Leave empty for all pages. Example: '0,2-5,7-'. const Pages = ""; // PDF document password. Leave empty for unprotected documents. const Password = ""; // Destination PDF file name const DestinationFile = "./result.pdf"; // Image params const X = 400; const Y = 20; const Width = 119; const Height = 32; const ImageUrl = ""; // * Add image * // Prepare request to `PDF Edit` API endpoint var queryPath = `/v1/pdf/edit/add`; // JSON payload for api request var jsonPayload = JSON.stringify({ name: path.basename(DestinationFile), password: Password, url: SourceFileUrl, images: [ { url: ImageUrl, x: X, y: Y, width: Width, height: Height, pages: Pages, } ] }); var reqOptions = { host: "", method: "POST", path: queryPath, headers: { "x-api-key": API_KEY, "Content-Type": "application/json", "Content-Length": Buffer.byteLength(jsonPayload, 'utf8') } }; // Send request var postRequest = https.request(reqOptions, (response) => { response.on("data", (d) => { // Parse JSON response var data = JSON.parse(d); if (data.error == false) { // Download the PDF file var file = fs.createWriteStream(DestinationFile); https.get(data.url, (response2) => { response2.pipe(file).on("close", () => { console.log(`Generated PDF file saved to '${DestinationFile}' file.`); }); }); } else { // Service reported error console.log(data.message); } }); }).on("error", (e) => { // Request error console.error(e); }); // Write request data postRequest.write(jsonPayload); postRequest.end();


{ "name": "test", "version": "1.0.0", "description": "", "main": "app.js", "scripts": { }, "keywords": [ "", "web", "api", "bytescout", "api" ], "author": "ByteScout &", "license": "ISC", "dependencies": { "request": "^2.88.2" } }


Add Image to PDF Node js

Now that we’ve reviewed the source code and output image, Let’s analyze the code.

Initially, we’re gathering all necessary data for PDF modifications like Source File URL, Pages on which text/image needs to be added, Input Image properties such as co-ordinates, width/height of the image, and Image URL. Next, we’re preparing JSON payload for API endpoint /v1/pdf/edit/add. We’re invoking an API endpoint along with a header containing an API key. The API response contains the URL of the generated PDF along with other parameters such as the number of pages etc.

This is how easy to add images or text to PDF with This is a very simple test case, for advanced scenarios we can also add other parameters to API calls. Please visit documentation for more info.

Try to create a small demo like this on your machine with to get read exposure. Thanks for reading!



Get 60 Day Free Trial

See also:


Get Your API Key

See also:

Related Samples: