The Invoice Processing Tool is a web-based application designed to automate the extraction of information from invoice images. It supports both typed and handwritten invoices through the use of Tesseract OCR (local) and Google Cloud Vision API (cloud). The extracted data includes invoice number, date, vendor details, customer information, item breakdown, and totals.
The tool consists of:
- Flask API backend for OCR and parsing logic
- React.js frontend for user interaction
- Features
- Technologies Used
- Project Structure
- Installation
- Running the Application
- API Endpoints
- Example Usage
- Additional Scripts
- License
- Acknowledgements
- Extracts raw text using Tesseract OCR or Google Cloud Vision API
- Extracts and identifies fields:
- Invoice Number
- Date
- Vendor and Customer Names/Addresses
- Item List
- Subtotal, Tax, Total
- Upload invoices via frontend
- Allows cross-origin requests from the React.js frontend
- Falls back to Tesseract OCR if Google Vision fails
- Python 3.7+ - Backend logic
- Flask - API development
- Tesseract OCR - Local OCR engine
- Google Cloud Vision API - Cloud OCR engine
- React.js - Frontend framework
- Flask-CORS - CORS middleware for Flask
- Werkzeug - File upload handling
Invoice_Processing/
├── Backend/ # Flask API backend
│ ├── app.py # Main entry point for Flask app
│ ├── test_vision.py # Script to test Vision API
│ ├── test.http # Optional HTTP request testing file
│ └── train_donut.py # Document-understanding model trainer
├── Frontend/ # React frontend
│ ├── node_modules/ # React dependencies
│ ├── src/ # Frontend source files
│ └── README.md # Frontend documentation
├── public/ # Static assets (images, etc.)
├── results/ # Output results and parsed data
├── src/ # Shared or top-level source files
├── uploads/ # Uploaded invoice images
├── .env/ # Virtual environment (should be gitignored)
├── .gitignore
├── README.md # Project documentation
├── requirements.txt # Python dependencies
├── package.json # Node.js dependencies
├── package-lock.json
├── postcss.config.js
└── .gitattributes
- Python 3.7 or higher
- Tesseract OCR installed and accessible via PATH
- Google Cloud Platform account (for Vision API)
- Flask and other required Python packages
- Clone the repository:
git clone https://github.com/yourusername/invoice-processing-tool.git
cd invoice-processing-tool- Install Python dependencies:
pip install -r requirements.txt- Install Tesseract OCR:
- Windows: Download from Tesseract GitHub, add to system PATH
- Linux:
sudo apt install tesseract-ocr- Setup Google Vision API:
- Create a GCP project
- Enable Vision API
- Download service account key JSON
- Set the environment variable:
export GOOGLE_APPLICATION_CREDENTIALS="/path/to/credentials.json"- Create an
uploadsdirectory:
mkdir uploadscd Backend
python app.pyRuns on: http://localhost:5000
cd Frontend
npm install
npm startRuns on: http://localhost:3000
- Renders a basic landing HTML page
- Accepts: Form-data with key
invoice(image file) - Returns: JSON with raw extracted text
invoice=<image-file>
{
"raw_text": "Extracted text from the invoice"
}- Upload invoice via frontend form
- Backend uses OCR (Vision API → Tesseract fallback)
- Text is parsed and returned as structured JSON
Invoice No: INV123456
Date: 2025-04-30
Vendor: Example Vendor Inc.
Customer: John Doe
Items:
- Item 1: $100.00
- Item 2: $50.00
Subtotal: $150.00
Tax: $15.00
Total Amount: $165.00
train_donut.py: Used for training a document-understanding model (Donut). Useful if you want to improve accuracy beyond default OCR methods.test_vision.py: Quick script to validate Google Vision API results.test.http: Optional file for testing HTTP requests to the Flask API.
This project is licensed under the MIT License. See the LICENSE file for more details.
- Tesseract OCR - GitHub
- Google Cloud Vision API - Documentation
- Flask - Official Docs
- Werkzeug - Documentation