Retour aux projets

Application OCR d'image en texte

Application OCR d'apprentissage qui convertit le texte d'une image en texte modifiable dans le navigateur et stocke l'image et le texte extrait dans MongoDB.

PrototypeCode source disponiblePrototype d'apprentissage de l'OCR / 2024

Problème

Les utilisateurs doivent numériser du texte présent dans des images, le relire et enregistrer le résultat avec l'image d'origine.

Solution

Construire un frontend React pour l'OCR dans le navigateur et la relecture du texte, adossé à une API Express/Multer et à MongoDB.

Fonctionnalités clés

OCR dans le navigateur avec Tesseract.js, sans modèle côté serveur
Interface d'import de fichiers pour les images contenant du texte
Étape de relecture et de modification du texte extrait avant enregistrement
API REST Express.js avec Multer pour l'import d'images
Persistance MongoDB des images et du texte extrait via Mongoose
Frontend responsive construit avec React et Tailwind CSS

Rôle

Projet d'apprentissage. J'ai construit le frontend React, le flux OCR dans le navigateur, l'API d'import Express et la persistance MongoDB.

Stack

React.jsTailwind CSSTesseract.jsHTML5Node.jsExpress.jsMulterMongooseMongoDB

Liens

Schéma d'architecture

Mermaid
flowchart LR
  User["Interface navigateur React"] --> Upload["Import d'image"]
  Upload --> OCR["OCR Tesseract"]
  OCR --> Review["Relecture du texte extrait"]
  Review --> API["API Express"]
  Upload --> API
  API --> Files["Stockage de fichiers Multer"]
  API --> Models["Modèles Mongoose"]
  Models --> DB[("MongoDB")]

Captures d'écran : Appli OCR

2 vues
Échantillon d'entrée du dépôt : un document Edge Detection mis en forme, utilisé pour valider l'extraction OCR.
Artefact de résultat enregistré sous Test_text.txt par le backend Express, qui montre le texte Edge Detection extrait après traitement.