Before You Begin
You’ll need:- An OpenRouter API key (get one at openrouter.ai/keys)
- Node.js 20+ installed
- A sample invoice image or PDF for testing
OpenRouter provides access to multiple vision models including Gemini 2.5 Flash (recommended), GPT-4o Mini, and others. Your API key works with all models.
Step 1: Configure Your API Key
First, create your environment configuration file:.env.local:
.env.local
Optional Configuration
You can customize model selection and PDF processing:.env.local
pdf-text- Fast text extraction (recommended)mistral-ocr- OCR-based extraction for scanned PDFsnative- Native PDF rendering
Step 2: Start the Development Server
Launch the application:Step 3: Upload Your First Invoice
Using the Web Interface
Open the application
Navigate to http://localhost:3000 in your browser.
Choose your document
Drag and drop an invoice file, or click Browse Files to select from your computer. Supported formats:
- Images: PNG, JPG, JPEG
- Documents: PDF (single or multi-page)
- Maximum size: 10MB
Select extraction mode
Choose how you want to process the invoice:
- Structured JSON → India GST (v4): Best for Indian invoices, includes reconciliation
- Structured JSON → Compact: MyBillBook schema format
- Raw Text: Unstructured text extraction
Pick an AI model
Select from available OpenRouter models:
- Gemini 2.5 Flash (Recommended) - Fast and accurate
- GPT-4o Mini - OpenAI’s compact vision model
- Gemini 2.5 Pro - Highest accuracy for complex invoices
Pro tip: Use keyboard shortcuts for faster workflows:
⌘K(Mac) orCtrl+K(Windows/Linux) - Show keyboard shortcuts⌘Enter- Extract data⌘⇧C- Clear all
Using the API
Process invoices programmatically with direct API calls:Step 4: Understand the Results
When processing completes, you’ll see three sections:Document Preview
View the original uploaded document to verify correct file processing.Structured Data
The right panel shows extracted invoice data with visual validation:- Green checkmark - Reconciliation passed (difference ≤ ₹0.05)
- Red warning - Reconciliation failed (check
reconciliation.error_absolute) - Line-by-line calculations showing quantity × rate, discounts, and taxes
- Computed totals vs. printed totals comparison
Raw JSON (Toggle)
Click Show to view the complete API response:Sample Response
Step 5: Test the Review Tool
The Review Tool helps debug and verify OCR responses:Navigate to the Review Tool
Click Review Tool in the top navigation, or go to http://localhost:3000/review.
Load sample data
Click Load sample to see a pre-filled example, or paste your own API response JSON.
The Review Tool automatically detects invoice objects in nested JSON structures, making it perfect for debugging LangFuse traces or API gateway logs.
Common Issues
Missing API Key Error
OPENROUTER_API_KEY is set in .env.local and restart the development server.
Parse Error
- Switch from GPT-4o Mini → Gemini 2.5 Flash
- Use Gemini 2.5 Pro for complex multi-page invoices
High Reconciliation Error
Ifreconciliation.error_absolute > 0.05:
- Check if the invoice has unusual discount structures
- Verify GST rates are standard slabs (not custom rates)
- Review
reconciliation.warningsfor clues - Use the Review Tool to inspect line-by-line calculations
Next Steps
Installation Guide
Complete setup instructions and environment configuration
API Reference
Detailed API documentation and schema references
