Twitter

CAPTCHA, essai de formulaire sécurisé et accessible

[acronym]CAPTCHA[/acronym] est un système de test visuel ou auditif que ne peuvent pas passer les machines actuellement (?) alors que la grande majorité des êtres humains le peuvent. Sous sa forme visuelle, il consiste à générer une image contenant une série aléatoire caractères alphanumériques qui fait office de clé de confirmation.

Cette technique fait ses preuves dans le cadre de sondages en ligne ou de validation de formulaire. Même les blogs, plus récemment, peuvent aussi se protéger des robots spammeurs et de leurs commentaires indésirables.

Préambule

[img=Fangs/wow les canines!]/img/blog/web/fangslogo_80.png[/img] Après lecture des billets de Thierry | egographies et de Chantal sur les techniques anti-spams j'ai eu l'idée de travailler sur un principe de protection de formulaire. La contrainte étant de rendre ce dernier accessible, l'utilisation des images était donc exclue. (CAPTCHA et accessibilité) Grâce à Fangs, le précieux émulateur de lecteur d'écran pour Firefox, j'ai pu "visualiser" le comportement de mon test .

Pseudo-CAPTCHA

Soit un formulaire classique, nous allons ajouter une liste de caractères alphanumériques aléaoire (6 dans notre exemple). Un lecteur d'écran met en avant les éléments tels que le titre de page, les titres (Hn), les liens … mais surtout les éléments d'une liste. L'appareil ne tiendra pas compte d'une éventuelle mise en page (à vous de présentez comme bon vous semble la succession d'entrées) mais soulignera bien chaque éléments, un par un.
La clé qui servira à la validation sera une combinaison de 3 caractères parmis ceux affichés dans la liste. Afin de tromper les robots, une règle aléatoire de composition sera appliquée. Je me suis arrêté à trois règles très simples :

  • Saisir les 3 premiers caractères de la série
  • Saisir les 3 derniers caractères de la série
  • Saisir 3 caractères dont les rangs sont définis de manière aléatoire

Afin de vérifier que la clé saisie correpondait à celle dictée par la règle de composition, j'ai été confronté à deux possibilités. Je pouvais utiliser les sessions pour stocker la clé valide pour la comparer à celle de l'utilisateur après soumission. Mais j'ai opté pour la seconde méthode afin de ne pas avoir à justement utiliser les variables de sessions. Je crypte donc la clé grâce à md5() et je transmet la valeur via le formulaire. Coté serveur, il suffira donc de crypter également la clé saisie et de comparer. :D

Voilà le résultat obtenu: Essai de formulaire

Avantages et inconvénients

Ce système, si il gagne en accessibilité perd en efficacité. Il est toujours possible de programmer un robot qui serait apte à reconnaître les règes de composition des clés. On peut bien sûr jouer sur le paramétrage (longueur de la série de caractères, longueur de la clé, nuance des phrases, création de règles) mais la méthode des images restent encore la plus sûre ;-) .

Finalement …

Cette démonstration résulte d'une réflexion sur les moyens que l'on peut mettre en oeuvre pour sécuriser les formulaires mais en aucun cas je n'affirme apporter la solution. :)

Ne pas oublier

  • Vous pouvez tester l'exemple ici
  • Vous pouvez également télécharger les sources (PHP)
  • Le projet CAPTCHA sur le net : c'est par ou
  • N'oubliez pas d'installer Fangs ^^

14 Comments to CAPTCHA, essai de formulaire sécurisé et accessible

  1. 19 décembre 2004 at 15 h 26 min | Permalink

    Les robots spammeurs font-ils autant de dégats que ça sur les blogs ?

    [hors sujet]
    Tu as modifié ton billet initial, et tes listes à puces se retrouvent maintenant férrées à gauche contre le trait vertical.
    [/hors sujet]

  2. 19 décembre 2004 at 16 h 23 min | Permalink

    Je crois que les weblogs autant que les sites sont soumis aux attaques. J’ai pris connaissance des spams de commentaires en lisant le billet de Dive The Web.

    Pour ma part suis épargné et ne subis « que » le spam des referers que je gère avec une blacklist.

    pour le hors sujet>Merci snoop, j’ai corrigé (une erreur dans la feuille de style)

  3. 19 décembre 2004 at 16 h 36 min | Permalink

    Je comprend pas tout.
    CAPTCHA tel que tu le montres ou le montre Divetheweb consiste à obliger l’internaute à saisir un code alphanumérique pour confirmer que le message soumis par un formulaire ne provient pas d’un robot spammeur, c’est ça ?
    Ton test est différent car tu rends le CAPTCHA accessible.
    Maintenant, ma question est : est-ce que autant de blogs se retrouvent avec des messages générés par des robots et quelle est la nature de ces messages (publicitaire ?) ?

    [hors sujet bis]
    Pas trés pratique le changement de couleur de police lorsque la souris est dans le textarea ; ça oblige à bouger la souris de cette zone pour mieux voir ce qu’on écrit.
    Avis perso bien sûr…
    [/hors sujet bis]

  4. 19 décembre 2004 at 16 h 40 min | Permalink

    > est-ce que autant de blogs se retrouvent avec des messages générés par des robots et quelle est la nature de ces messages (publicitaire ?) ?

    Les messages sont de nature pornographiques le plus souvent et permettent à leurs auteurs d’avoir des liens vers leur site en dur sur les blogs attaqués. Quand à savoir la proportion de blogs attaqués ça mérite une petite recherche …

    Pour le changement de couleur, c’est vrai c’est pas très pratique et je vais regarder ça :D

  5. 19 décembre 2004 at 16 h 56 min | Permalink

    Je suis trés perplexe sur ce système (pas le tien) ou plutôt sur son utilisation.
    Qu’il soit utilisé depuis une interface d’administration se comprend trés bien, mais de là à obliger, car il ne faut pas avoir peur des mots et de leur sens, un internaute à saisir un code pour valider son formulaire, c’est d’une éthique tout à fait discutable.
    Les mals voyants sont bannis et exclus de pouvoir laisser des commentaires sur tout système utilisant ce procédé.

    Bref, ce procédé appliqué aux systèmes de discussions courants du web (forums, blogs) est vraiment paradoxal, car la majorité des blogeurs étant des personnes respectueuses des standards (ou essayant de l’être), cette majorité va dans le même temps appliquer un procédé anti-accessible pour une seule raison : bloquer les robots spammeurs !?
    Mais sincèrement, combien de blogeurs ont déjà eu affaire à des robots spammeurs ?
    N’est-ce pas curieux d’afficher une telle étiquette:
    « Site valide XHTML Strict, CSS et toutiquanti, mais interdit aux mals voyants et aux aveugles ».

    Tu as le mérite de proposer ici une méthode accessible au détriment de l’efficacité de sécurisation (c’est tout relatif cependant), mais je reste quand même perplexe et je ne suis pas certain par exemple qu’Opquast approuverait cette méthode.
    Pour inviter un internaute à réagir sur son blog ou forum, la règle d’or est de lui mettre le moins de batons dans les roues.
    Certains forums t’obligent à recevoir le mot de passe sur ton compte POP (ou à connaître tes accés webmail par coeur), à activer un lien de confirmation, à t’identifier, bref tout un procédé qui resssemble étrangement à Brazil par sa complexe absurdité administrative.
    D’autres blogs t’obligent à saisir une adresse email !
    Mais pourquoi aurait-on obligatoirement une adresse email en ayant accés à internet ? Et tous ceux qui ne savent pas feinter le champ obligatoire par un toto@toto.com se retrouvent punis et interdits d’expression.
    Donc, le sujet revient finalement à dire : mais où on va, là ?
    Personnellement, je serais plus curieux de savoir comment fonctionnent ces robots spammeurs (je ne parle pas des pourriels).

    Ne serait-il pas plus correct et plus simple d’inclure une fonction PHP qui va détecter via $_SERVER["HTTP_USER_AGENT"] et un tableau listant les robots spammeurs afin de leur interdire l’accès à une page contenant un formulaire ?

  6. 19 décembre 2004 at 19 h 21 min | Permalink

    Tu as raison. En conclusion de mon billet je voulais dire conclure sur le fait qu’il est vraiment dommage qu’il faille en arriver là. Les personnes ont oublié toute forme d’éthique et n’ont que faire des libertés et des propriétés de tout un chacun. Mais voilà, les hackers, les spammeurs ça existent. Et comme chacun sait le but de toute activité est de toucher le maximum de personne. CAPTCHA le précise sur le site du projet: le test s’adresse à la plupart des internautes – donc exit les personnes ayant un handicap visuel :( .

    Sinon les robots ont la signature digitale qu’ils veulent. Il est donc impossible de filtrer selon l’IP ou le USER AGENT. :|
    D’ailleur j’ai vu de belles choses en terme de USER AGENT (« I F*** YOU » par ex …)

  7. 19 décembre 2004 at 19 h 29 min | Permalink

    >solo

    La solution captcha n’est pas la plus parfaite, comme l’a dit thierry (egographie), le mieux serait de ne pas contraindre le visiteur. Cependant ce système est à mon sens un des moins mauvais comparé à ce qui existe.

    Sur des forums, tu dois t’enregistrer pour lire, participer, … tu dois activer la confirmation par mail, … attendre la confirmation de l’administrateur … etc. Tout ça pour dire qu’il y a des systèmes bcp plus contraignants. La prolifération des forums et son utilisation a rendu « célèbre » la technique captcha qui est devenu un système de plus en plus utilisé et accepté par les utilisateurs.

    Est-ce vraiment nécessaire. Même si tous les blogs ne sont pas concernés par le spam, ce sont ceux qui connaissent une grande fréquentation qui sont touchés (voir par ex. Standblog). Avec le popularité des blogs et son efferfescence ils vont intéressés de plus en plus les spammeurs. Il est donc important de se protéger avant que cette saleté polue nos blogs.

    En ce qui concerne l’accessibilité, Hotmail (pour ne pas le citer) permet une lecture du code par un robot.

    « Mais pourquoi aurait-on obligatoirement une adresse email en ayant accés à internet ? »
    C’est vrai que cela ne va pas de soi et on peut se poser aussi la question de la protection des données personnelles (puisqu’un email en est une). Mais l’obligation du mail c’est à mon sens pour répondre directement à l’intervenant sans publier sur le blog. Surtout que si le visiteur faisait que passer il y a peu de chance à le retrouver juste avec son pseudo. C’est donc une garantie de garder un contact.

    « Et tous ceux qui ne savent pas feinter le champ obligatoire par un toto@toto.com se retrouvent punis et interdits d’expression. »
    Tu pousses le bouchon un peu loin je trouve. Ceux qui lisent les blogs et qui souhaitent répondre ont une certaine habitude du web. Comprendre qu’on peut laisser un commentaire sur un site ce n’est pas connu de tous… loin de la. Quand tu découvres Internet tu ne vas pas d’abord sur des blogs mais tu surfes et tu crées un mail gratuit.

  8. 19 décembre 2004 at 19 h 46 min | Permalink

    Sur ce blog: http://blog.codefront.net/ c’est un système à une lettre dans le formulaire des commentaires.

  9. 19 décembre 2004 at 20 h 03 min | Permalink

    @ Katsoura
    Je ne pense pas sincèrement « pousser le bouchon ».
    Je pense qu’on ne doit pas sur un système type blog (et même forum) obliger l’internaute à laisser une adresse email qui s’affichera sur la page, d’autant plus qu’on se retrouve sur un nouveau paradoxe en rapport complet avec le sujet de ce billet, la lutte anti-spam.
    Et jusqu’à présent, je n’ai jamais vu d’email laissé par des participants formaté de type toto[AT]toto[DOT]com.
    En obligeant l’internaute à laisser une donnée personnelle, on ne lui garantie nullement qui ne sera pas affecté par du pourriel ; il a même beaucoup de probabilité d’en recevoir.
    Et ça, c’est d’une éthique discutable.
    Le web se veut souvent une approche théorique et idéaliste de la liberté d’expression et de la démocratie : il faut en supporter les conséquences néfastes et assumer ce rôle. (Standblog en a fait les frais pour la plus grande déception de ceux qui aimaient pouvoir discuter avec Tristan Nitot)

  10. 19 décembre 2004 at 20 h 10 min | Permalink

    > toto@toto.com
    J’avoue le faire lorsque je dois télécharger un programme pour la énième fois …

    > http://blog.codefront.net/
    C’est un système plus simple que celui que j’ai mis en place.

    C’est en multipliant les tests de ce genre que l’on va arriver à freiner ces techniques de spams. Car il suffit de peu de chose : changer la phrase, le nom du champ de saisie de la clé …

  11. 19 décembre 2004 at 21 h 33 min | Permalink

    Finalement tu as réussi à faire une phrase française :lol: :lol: :lol: :lol: :lol: :lol:

  12. 19 décembre 2004 at 21 h 38 min | Permalink

    [privateJoke]
    Merci All ::whistle
    [/privateJoke]

  13. mEga's Gravatar mEga
    20 décembre 2004 at 17 h 37 min | Permalink

    Notre ami Pingouin du nord (scuse Ldo mais avec le froid polaire ca doit etre la banquise a Lille;)) avait pondu ca il y a un moment :

    http://dwef.12h26.com/6-protection-anti-spam-formulaires.htm

  14. 20 décembre 2004 at 22 h 49 min | Permalink

    Merci pour le lien ;-)

Saisir un commentaire

Vous pouvez utilisez les balises HTML suivantes, ainsi que les attributs associés : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Photographie

Tranches de vie on Facebook