Guides · Node.js · built-in fetch

Add page numbers and headers to a PDF in Node.js with built-in fetch

A multi-page PDF that leaves the printer without page numbers gets shuffled exactly once before someone asks for them. pdf_footer (and its twin pdf_header) take a small HTML template that Chromium prints on every page of the PDF — and inside it, <span class="pageNumber"></span> and friends are substituted with live values at print time.

Below is a complete, runnable Node.js program using built-in fetch, no third-party dependency needed. It reads your API key from the SNAPDOK_KEY environment variable — free keys take about thirty seconds and need no card.

import { writeFile } from "node:fs/promises";

const res = await fetch("https://snapdok.io/v1/render", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.SNAPDOK_KEY}`,
    "Content-Type": "application/json",
  },
  body: JSON.stringify({
    url: "https://your-app.com/report/42",
    format: "pdf",
    pdf_footer: "<div style=\"font-size:10px;width:100%;text-align:center;color:#555;\">Page <span class=\"pageNumber\"></span> of <span class=\"totalPages\"></span></div>",
  }),
});

if (!res.ok) throw new Error(`${res.status} ${await res.text()}`);
await writeFile("numbered.pdf", Buffer.from(await res.arrayBuffer()));

Five class names do the substitution: pageNumber, totalPages, date, title (the page's <title>) and url. Two styling rules save an hour of confusion: set an explicit font-size, because the print engine's default is unreadably small — a template that "does not show up" is almost always just tiny — and set width:100% on the wrapper if you want centering or space-between layouts to work.

Setting a header or footer reserves a 60px margin on that edge for it; a request with neither keeps the exact zero-margin output PDFs have always had, so adding a footer to one report cannot shift the layout of any other. The templates are ignored for png/jpeg, and also when pdf_forms is on — the fillable-forms pipeline measures field positions against a zero-margin page, and a margin would misplace every field. Both templates change the cache fingerprint, so a numbered and an unnumbered render of the same URL are separate cache entries.

Same endpoint, one more trick: if the page you are rendering has a form on it, adding "pdf_forms": true to a PDF render brings it back with real, fillable AcroForm fields — a PDF people can type into, not a picture of one. How that works.

Notes for built-in fetch

No dependency needed: fetch is global from Node 18 onward (snapdok's own test suite uses it). The binary-safety detail is res.arrayBuffer() → Buffer.from(...) — reaching for res.text() is the classic way to corrupt a PDF in Node. fetch does not reject on HTTP error statuses, so the res.ok check is load-bearing: without it, an expired key writes a 40-byte JSON error to disk with a .pdf extension.

Response headers worth reading

Header	Meaning
`X-Cache`	Each distinct header/footer template is its own cache entry.
`X-Quota-Remaining`	Metered renders left this month.

Full parameter reference: the docs. Hard numbers on caps and timeouts: limits.

Add page numbers and headers to a PDF in Node.js with built-in fetch

Notes for built-in fetch

Response headers worth reading

Related guides

Same task, other stacks

More with Node.js + built-in fetch