# PDF Viewer

### 🧋 Bubble.io Plugin

\[Action] Natively - Open PDF

* URL - the direct URL address pointing to the PDF file (e.g., `https://example.com/document.pdf`)
* Base64 - the Base64 encoded string representing the entire PDF file
* File name - custom filename for the PDF when displayed or downloaded. If not provided, a default name with timestamp will be generated: `{timestamp}.pdf`
* Download - yes/no - controls whether to show the download button in the PDF viewer

{% hint style="warning" %}
Either URL or Base64 must be provided.
{% endhint %}

#### How to use

The native PDF Viewer is triggered via a single action in your workflow: `Natively - Open PDF action`

1. URL or Base64 - Required - Specify either the URL address pointing to the PDF file or the Base64 encoded string of the file content.
2. File name - Optional - Provide a file name (e.g., `invoice_Q4.pdf`)
3. Download - Required - Specify **yes** or **no**

<figure><img src="/files/5NepICHMXzaom4IJ2Xyz" alt="" width="341"><figcaption></figcaption></figure>

<figure><img src="/files/HpPxlQRvXjZoGfrpT9Yv" alt="" width="375"><figcaption></figcaption></figure>

### 🛠 JavaScript SDK

{% code lineNumbers="true" %}

```javascript
// Open from URL with Download Button
window.natively.openPDF({
    url: 'https://example.com/documents/guide.pdf',
    fileName: 'UserGuide.pdf',
    download: true
}, (response) => {
    console.log('PDF Viewer action:', response);
});
// Open from Base64 Data
window.natively.openPDF({
    base64: 'JVBERi0xLjMKJcTl8uXrp...', // Truncated for brevity
    fileName: 'GeneratedReport.pdf',
    download: false
}, (response) => {
    if (response.status === 'FAILED') {
        console.error(''PDF Viewer action:', response.message);
    }
});
//Response structure
{
  "status": "SUCCESS",  // or "FAILED" if an error occurred
  "message": "PDF viewed successfully"  // or error message
}
```

{% endcode %}

### Download Functionality

When the user taps the Download button within the native PDF Viewer, the following sequence occurs:

* The PDF file is saved directly to the device's default Downloads folder.
* A snackbar notification appears at the bottom of the screen to indicate the success or failure of the download process.
* The download button is replaced with a green checkmark icon to provide immediate visual confirmation that the file has been successfully saved to the device.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.buildnatively.com/guides/integration/pdf-viewer.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.