Convert PDFs to Images Using JavaScript

With PSPDFKit for Web, you can render independent pages of a PDF document and save them as images. If the document contains any annotations, they’ll be rendered over the page background.

Rendering and Exporting a Specific Page as an Image

The following example uses the FileSaver.js polyfill to save a single page as a PNG file to a computer by means of instance.renderPageAsImageURL():

import { saveAs } from "file-saver";

const instance = await PSPDFKit.load({
  ...otherOptions,
  document: "https://example.com/mydocument.pdf"
});

async function savePagePNG(pageIndex) {
  // Get page width.
  const { width } = instance.pageInfoForIndex(pageIndex);

  // Render page.
  const src = await instance.renderPageAsImageURL({ width }, pageIndex);

  // Save the image as a PNG.
  saveAs(src, `pdf-page-${pageIndex}.png`);
}

// Usage: Export page 3 as an image.
savePagePNG(3);