Spaces:
Running
Running
metadata
title: Advanced Barcode Scanner
emoji: 📷
colorFrom: blue
colorTo: indigo
sdk: static
pinned: false
license: mit
Advanced Barcode Scanner
A powerful web application that uses ZXing (Zebra Crossing) to detect and decode barcodes from uploaded images, camera feed, or captured still images.
Features
Multiple Input Methods:
- Upload images containing barcodes
- Use live camera feed for real-time scanning
- Capture still images from camera for enhanced processing
Advanced Detection:
- Image enhancement with adjustable parameters
- Multiple binarizers for improved detection
- Fallback mechanisms when primary detection fails
Focus Mode:
- Full-screen camera view for better positioning
- Visual guides with crosshair for precise alignment
- Optimized processing parameters for difficult barcodes
Debug Mode:
- Real-time processing information
- Detailed error reporting
- Performance insights
User Experience:
- Visual feedback with barcode highlighting
- Success sound on detection
- Responsive design for all devices
Supported Barcode Formats
This application can recognize various barcode formats including:
- QR Code
- Data Matrix
- Aztec
- PDF 417
- EAN-13 and EAN-8
- UPC-A and UPC-E
- Code 128
- Code 39
- Code 93
- Interleaved 2 of 5 (ITF)
- Codabar
How It Works
This application uses ZXing (Zebra Crossing), a powerful barcode scanning library, to detect and decode barcodes. The process includes:
- Image Acquisition: From upload, camera feed, or captured still
- Image Enhancement: Adjusting brightness, contrast, and applying thresholds
- Barcode Detection: Using multiple algorithms to locate barcodes
- Decoding: Reading the actual data from the barcode
- Result Display: Showing the decoded information and highlighting the barcode location
Getting Started
Prerequisites
- A modern web browser (Chrome, Firefox, Safari, Edge)
- Internet connection (to load the ZXing library from CDN)
- Camera access (for live scanning and image capture features)
- HTTPS connection or localhost (required for camera access)
Running the Application
- Clone or download this repository
- Open the
index.html
file in your web browser - Choose your preferred input method:
- Click "Upload Image with Barcode" to select an image
- Click "Start Camera" to use live scanning
- When camera is active, use "Capture Image" for still image processing
- Wait for the processing to complete
- View the recognized barcode data in the results section
Alternatively, you can use a local web server to serve the files:
# Using Python 3
python -m http.server
# Using Node.js with http-server
npx http-server
Then navigate to http://localhost:8000
(or the port specified by your server).
Usage Tips
For Uploaded Images
- Use clear, well-lit images
- Ensure the barcode is in focus
- Position the barcode to be as straight as possible
For Live Camera Scanning
- Hold the camera steady
- Position the barcode within the guide box
- Ensure adequate lighting
- Toggle image enhancement if detection is difficult
- Use Focus Mode for challenging barcodes
For Captured Images
- Use when live scanning isn't detecting the barcode
- Hold the camera steady before capturing
- Position the barcode clearly in frame
- Try with and without image enhancement
Troubleshooting
- If a barcode isn't detected, try toggling the image enhancement option
- Enable Debug Mode to see detailed processing information
- For difficult barcodes, try Focus Mode or Capture Image feature
- Ensure adequate lighting and proper positioning
License
This project is open source and available under the MIT License.
Acknowledgements
- ZXing - JavaScript port of the ZXing barcode scanning library
- Hugging Face - For hosting and sharing this application