Download

Save the open document under a sensible file name without requesting it again, or take over the download yourself.

Basics

The download button saves the bytes that are already loaded, so authenticated or expiring URLs are never requested twice.

import { PdfViewer } from '@kingtech/react-pdf-viewer'; export default function Demo() { // The download button saves the bytes already loaded: no second request. return <PdfViewer source="/samples/letter-3pages.pdf" />; }

The file name is fileName when you pass one; otherwise a File’s name, the last .pdf segment of the URL, or document.pdf.

Intercepting the download

onDownload receives { fileName, data } before anything is saved. Return false to handle the bytes yourself.

import { PdfViewer } from '@kingtech/react-pdf-viewer'; import { useState } from 'react'; export default function Demo() { const [message, setMessage] = useState('Click the download button in the toolbar.'); return ( <> <p className="demo-output" role="status"> {message} </p> <PdfViewer source="/samples/letter-3pages.pdf" onDownload={({ fileName, data }) => { // Upload, log or post-process the bytes instead of saving them. setMessage(`Intercepted ${fileName}: ${data.byteLength.toLocaleString()} bytes.`); return false; }} /> </> ); }

If saving fails, onError receives a DOWNLOAD_FAILED error; see Error states.

Customization

Set the file name, rename the button, and choose which toolbar actions appear.

import { PdfViewer } from '@kingtech/react-pdf-viewer'; export default function Demo() { return ( <PdfViewer source="/samples/letter-3pages.pdf" fileName="quarterly-summary.pdf" labels={{ download: 'Save a copy' }} toolbar={{ actions: ['zoomOut', 'zoomLevel', 'zoomIn', 'download'] }} /> ); }

See the customization guide.

Advanced / escape hatch

download() on the imperative API starts the same download from your own button. getDocument() returns the PDF.js document if you need its getData() for something other than saving.

Limitations

The original file is saved. Rotation, zoom and search highlights are not written into the download. Workaround: none within the viewer; post-process the bytes from onDownload with a PDF library if you need a modified file.
Some mobile browsers open instead of saving. iOS Safari may show the PDF in a new view rather than a download prompt; this is browser behavior. Workaround: none reliable; the user can share or save from there.

API

PdfViewerProps — Props for PdfViewer. Every piece of state supports the value / defaultValue / onChange trio.