Extract Waybill with Vue OCR Composable

Learn how to extract Waybill data programmatically using Vue OCR Composable. Extract data from national waybills: shipper, receiver, goods, route, dates. Includes code, field mapping, and API integration.

Building a Waybill OCR UI with Vue

This tutorial builds a complete Waybill extraction interface using Vue. Users drag-and-drop a Waybill document, click extract, and see structured JSON results — all within your application.

Vue Component Architecture

The component handles three states: upload (file selection), processing (spinner + progress), and result (formatted JSON display). State management uses Vue's standard patterns.

Upload + Extraction Workflow

POST the document to /api/upload, get back a job identifier, then POST to /api/analyze/{job} to trigger extraction. The result contains all Waybill fields structured as JSON. 2-pass verification confirms data accuracy.

Displaying Waybill Fields

The extracted Waybill fields render in a formatted view. Show the JSON raw for developers or build a custom form for business users. Copy-to-clipboard and download-as-JSON are included.

Production Considerations

Add error boundaries for 401 (re-login), 402 (upgrade prompt), and network failures. For Clerk-authenticated users, the session token is used automatically. Store API keys server-side, never in client code.

Pricing

Extracting a Waybill costs ~0.002 EUR per page. Free tier: 1 page. Pro: 49 EUR/month (1,000 pages). Enterprise: 499 EUR/month (100,000 pages). See [volume pricing](/tutorials/comparisons/volume-pricing).

Next Steps

Get your free API key and build your Waybill extraction UI today. [Start now →](/app)

Ready to try it?

Start Free →