Skip to main content

​
Overview

Add a floating chat bubble to any website that answers questions about your PDF. One script tag, zero dependencies, streaming responses.

Live Demo

Try the embedded chat widget on a live page

​
Quick Start

Upload a document, then paste this before </body>: 
<script src="https://typebot-integration.okrapdf.dev/widget.js"
        data-doc="YOUR_DOC_ID"
        data-key="YOUR_PUBLISHABLE_KEY"></script>
That’s it. A chat bubble appears in the bottom-right corner. Your visitors ask questions, the widget streams answers from your PDF.
1

Upload a PDF

npx okrapdf upload earnings.pdf
# → Document ID: ocr-abc123
2

Get a publishable key

Create a key scoped for client-side use in your dashboard. Publishable keys (prefixed okra_pk_) can only read — they can’t upload or delete documents.
3

Add the script tag

<script src="https://typebot-integration.okrapdf.dev/widget.js"
        data-doc="ocr-abc123"
        data-key="okra_pk_your_key_here"></script>

​
How It Works

The widget calls OkraPDF’s OpenAI-compatible completions endpoint directly from the browser: 
Browser → POST /v1/documents/{id}/chat/completions → Streaming SSE response
No backend proxy needed. The publishable key restricts access to read-only completions on that specific document.

​
Use with Chatbot Builders

Since the completions API is OpenAI-compatible, any chatbot platform that supports custom endpoints works out of the box.
Add an HTTP Request block:
  • URL: https://api.okrapdf.com/v1/documents/YOUR_DOC_ID/chat/completions
  • Method: POST
  • Headers: Authorization: Bearer YOUR_OKRA_KEY
  • Body: {"model":"moonshotai/kimi-k2.5","messages":[{"role":"user","content":"{{userQuestion}}"}]}
  • Response mapping: choices[0].message.content → your response variable
  • Timeout: Set to 120s (LLM calls take 5-30s)
Any platform with a “Custom OpenAI” or “HTTP Request” integration:
  • Base URL: https://api.okrapdf.com/v1/documents/YOUR_DOC_ID
  • API Key: Your OkraPDF key (passed as OpenAI API key)
  • Model: moonshotai/kimi-k2.5
from openai import OpenAI

client = OpenAI(
    base_url="https://api.okrapdf.com/v1/documents/YOUR_DOC_ID",
    api_key="okra_pk_your_key_here",
)

response = client.chat.completions.create(
    model="moonshotai/kimi-k2.5",
    messages=[{"role": "user", "content": "What was total revenue?"}],
)
print(response.choices[0].message.content)
Use the OkraPDF n8n node for native integration.

​
Customization

The widget accepts these data- attributes:
AttributeDescriptionDefault
data-docDocument ID (required)—
data-keyPublishable API key (required)—
For deeper customization (colors, position, greeting), fork the widget source — it’s ~80 lines of vanilla JS.

​
Source Code

Widget Source

Vanilla JS, zero dependencies, ~80 lines

Live Demo

Deployed example with streaming chat