/pdf - Render PDF

The /pdf endpoint instructs the browser to generate a PDF of a webpage or custom HTML using Cloudflare's headless browser rendering service.

Endpoint

https://api.cloudflare.com/client/v4/accounts/<accountId>/browser-rendering/pdf

Required fields

You must provide either url or html:

url (string)
html (string)

Common use cases

Capture a PDF of a webpage
Generate PDFs, such as invoices, licenses, reports, and certificates, directly from HTML

Basic usage

Navigate to https://example.com/ and inject custom CSS and an external stylesheet. Then return the rendered page as a PDF.

curl -X POST 'https://api.cloudflare.com/client/v4/accounts/<accountId>/browser-rendering/pdf' \
  -H 'Authorization: Bearer <apiToken>' \
  -H 'Content-Type: application/json' \
  -d '{
    "url": "https://example.com/",
    "addStyleTag": [
      { "content": "body { font-family: Arial; }" },
      { "url": "https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" }
    ]
  }' \
  --output "output.pdf"

import Cloudflare from "cloudflare";

const client = new Cloudflare({
  apiEmail: process.env["CLOUDFLARE_EMAIL"], // This is the default and can be omitted
  apiKey: process.env["CLOUDFLARE_API_KEY"], // This is the default and can be omitted
});

const pdf = await client.browserRendering.pdf.create({
  account_id: "account_id",
});

console.log(pdf);

const content = await pdf.blob();
console.log(content);

Convert custom HTML to PDF

If you have raw HTML you want to generate a PDF from, use the html option. You can still apply custom styles using the addStyleTag parameter.

curl -X POST https://api.cloudflare.com/client/v4/accounts/<acccountID>/browser-rendering/pdf \
  -H 'Authorization: Bearer <apiToken>' \
  -H 'Content-Type: application/json' \
  -d '{
  "html": "<html><body>Advanced Snapshot</body></html>",
  "addStyleTag": [
      { "content": "body { font-family: Arial; }" },
      { "url": "https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" }
    ]
}' \
  --output "invoice.pdf"

Advanced usage

Advanced page load with custom headers and viewport

Navigate to https://example.com, setting additional HTTP headers and configuring the page size (viewport). The PDF generation will wait until there are no more than two network connections for at least 500 ms, or until the maximum timeout of 4500 ms is reached, before rendering.

The goToOptions parameter exposes most of Puppeteer's API ↗.

curl -X POST 'https://api.cloudflare.com/client/v4/accounts/<accountId>/browser-rendering/pdf' \
  -H 'Authorization: Bearer <apiToken>' \
  -H 'Content-Type: application/json' \
  -d '{
    "url": "https://example.com/",
    "setExtraHTTPHeaders": {
      "X-Custom-Header": "value"
    },
    "viewport": {
      "width": 1200,
      "height": 800
    },
    "gotoOptions": {
      "waitUntil": "networkidle2",
      "timeout": 45000
    }
  }' \
  --output "advanced-output.pdf"

Blocking images and styles when generating a PDF

The options rejectResourceTypes and rejectRequestPattern can be used to block requests during rendering. The opposite can also be done, only allow certain requests using allowResourceTypes and allowRequestPattern.

curl -X POST https://api.cloudflare.com/client/v4/accounts/<acccountID>/browser-rendering/pdf \
  -H 'Authorization: Bearer <apiToken>' \
  -H 'Content-Type: application/json' \
  -d '{
  "url": "https://cloudflare.com/",
  "rejectResourceTypes": ["image"],
  "rejectRequestPattern": ["/^.*\\.(css)"]
}' \
  --output "cloudflare.pdf"

Was this helpful?

Community
X
Discord
YouTube
GitHub