Pour récupérer le texte d'une image, on fait appel à un OCR. Tesseract.js est un portage de la librairie Tesseract qui va vous permettre d'effectuer une reconnaissance de texte directement depuis un navigateur !

C'est quoi Tesseract ?

Tesseract est à l'origine une librairie développée en C++ par HP en 1985 et qui a été repris par Google en 2006. Elle permet d'effectuer une reconnaissance optique de caractères (OCR) qui signifie que le texte d'une image peut être détecté, récupéré par un ordinateur.

Tesseract permet donc via une ligne de commande de récupérer le texte présent dans une image et comprend une centaine de langues !

Un portage en Javascript a été effectué par deux développeurs (Kevin Kwok et Guillermo Webster). Ce script supporte quant à lui environ 60 langues. Tesseract.js peut ainsi être lancé via un navigateur ou en mode serveur avec NodeJS.

Installation

Tesseract.js est un simple script Javascript qui se charge de manière classique :

<script src="https://cdn.rawgit.com/naptha/tesseract.js/1.0.10/dist/tesseract.js"></script>

Si vous voulez le charger localement, récupérez le fichier tesseract.js présent dans le dossier dist du projet GitHub.

Vous pouvez également l'installer avec npm (nodejs v6.8.0 minimum nécessaire) :

npm install tesseract.js --save

Utilisation

La fonction recognize de Tesseract.js prend en premier paramètre une image. Celle-ci peut très bien être une balise HTML img, canvas ou même video, mais également un objet File (input). Plus de détails ici.

Le deuxième paramètre correspond aux options de Tesseract.

L'exemple ci-dessous est très simple. J'ai une image dans mon code HTML qui contient du texte que je souhaite récupérer.

<img src="test.png" id="image">

<script>
var myImage = document.getElementById('image');

Tesseract.recognize(myImage, {
    lang: 'fra'
})
.then(function(result){
    console.log(result)
})
</script>

Voici le résultat :

Le texte est parfaitement récupéré (il faut dire que l'image est nette) ! Le nombre de lignes, de paragraphes sont également disponibles.

Par défaut, Tesseract.js utilise un worker sur un serveur distant, qui peut être installé sur votre machine.

Le script propose une fonction progess qui permet de connaître l'avancement de la reconnaissance du texte.

Conclusion

Très pratique, Tesseract.js est un excellent script Javscript pour effectuer une reconnaissance de texte dans une image !