Petit Kiwi : web, high-tech & cie

PHP : création d’un captcha anti-spam

Adieu spam !! Ce tuto va vous permettre de créer votre propre captcha anti-spam qui ressemblera à ça :

Mais d’abord, qu’est-ce qu’un captcha? C’est un test utilisé pour différencier les humains des robots. Dans notre cas, il s’agit d’une image générée dynamiquement avec PHP et sue laquelle est écrit un texte, qu’il faut tout simplement lire et recopier. Simple pour un humain mais difficile pour un OCR. Cela constitue donc une première barrière pour empêcher le spam dans vos formulaires web.

Bien sûr, les captchas visuels ne sont jamais infaillibles et pourront toujours être crackés. Mais en utilisant une image dont l’arrière-plan n’est pas uniforme, plusieurs polices de caractères, des couleurs différentes, et une disposition aléatoire des caractères, on peut rendre cette tâche plus difficile et bloquer la plupart des robots indésirables. Mais évitez de rendre la tâche difficile au point que même un humain aurait du mal à lire…

Avant de commencer

Pour manipuler des images de façon dynamique avec PHP, il faut que la bibliothèque GD2 soit installée et activée sur votre hébergeur. C’est le cas sur la plupart des hébergements payants, et même sans doute gratuits maintenant.
Pour la démo, les ingrédients sont les suivants :

  • une image captcha.png (arrière-plan de l’image)
  • un fichier captcha.php (image dynamique affichée)
  • un fichier index.php (formulaire)
  • des polices de caractères TrueType (autant que vous voulez) à placer dans le dossier fonts. J’ai utilisé les polices Action Jackson et Glimstick.

L’arborescence des fichiers devrait s’organiser comme suit :

Fonctionnement

La création de l’image

On part d’une image captcha.png vierge de tout texte.

Arrière-plan du captcha

Le script captcha.php va partir de cette image statique pour en créer une dynamique sur laquelle il pourra écrire. Pour cela, il va d’abord générer un code aléatoire de cinq chiffres et lettres. Il va ensuite chercher les polices TrueType stockées dans le dossier fonts et les appliquer au hasard à chacun des caractères de la chaîne générée, en n’oubliant pas de les personnaliser un peu (taille, inclinaison, disposition, couleur).
Une fois le traitement terminé, à chaque appel du script, l’image sera envoyée au navigateur. L’affichage ne se fait alors plus par une image statique, mais par l’image dynamique captcha.php ci-dessous.

Captcha dynamique

La vérification

En haut des fichiers captcha.php et index.php, remarquez qu’on démarre à chaque fois une session avec session_start(). Dans captcha.php, cette session nous sert de stockage, alors que dans index.php, on l’utilise pour récupérer ce qui a été stocké.

Lorsque la chaîne aléatoire est générée par captcha.php, celle-ci est hashée avec md5() puis stockée dans la variable de session $_SESSION[‘captcha’].
Après la soumission du formulaire par l’utilisateur, le code qu’il a entré est récupéré, hashé par le même algorithme md5(). Si ce code hashé correspond à la valeur de la variable de session, le code a bien été recopié, sinon l’utilisateur peut recommencer.

Mise en place

L’image dynamique captcha.php

Le formulaire index.php

Ce fichier contient le formulaire de vérification et c’est donc lui qui va afficher l’image. C’est également au sein de ce fichier qu’on traite les données reçues une fois le formulaire envoyé. Dans notre exemple, le champ devient vert si le code entré est correct, sinon il devient rouge.
N’oubliez pas de mettre le session_start() en début de fichier !

Conclusion

Enfin, si ça vous intéresse, sachez aussi qu’il existe d’autres sortes de captchas (audios, basés sur la réflexion, trouver un objet parmi d’autres).