• 4 heures
  • Facile

Le captcha

Connectez-vous ou inscrivez-vous gratuitement pour bénéficier de toutes les fonctionnalités de ce cours !

Explication

Dans cette partie nous allons voir comment mettre en place un système de vérification par captcha. Si malgré une lecture intensive des deux premières parties vous ne savez toujours pas ce qu'est un captcha, ne vous en faites pas je vais tout réexpliquer.

Commençons donc par le commencement. Pour ceux à qui le terme "captcha" n'évoque absolument rien, voilà à quoi ça ressemble :

Il existe des dizaines de variantes, et vous faire une liste complète serait bien trop long (et pas franchement utile). Le principal c'est que vous compreniez à quoi sert ce "truc avec des lettre tordues et barrées". Cette petite boite magique que vous avez très probablement déjà rencontré sur le net, est en fait un moyen très efficace de vérifier que vous êtes bien un humain et non une machine sans cœur à pulsions destructrices. Vous devez simplement recopier les lettres que vous voyez dans le cadre du haut puis valider. Je vous l'accorde ce n'est pas particulièrement beau, mais c'est sacrément efficace.

Euh.. En quoi recopier un texte permet de vérifier que je suis un humain ? Et puis pourquoi c'est tout tordu ? C'est drôlement étrange comme moyen de vérification !

Le fait que les lettres soient tordues, barrées, cachées ou encore éparpillées, permet de tromper d'éventuels OCR (script de reconnaissance de caractères) qu'utiliseraient des hackers pour contourner cette vérification. Les lettres sont tellement déformées que le texte devient (presque) impossible à déchiffrer par une machine. Je précise "presque" parce qu'en informatique le risque zéro n'existe pas ! Donc seul un humain est capable de déchiffrer ce qui se cache derrière cet étrange texte. Ainsi vous êtes certain que le formulaire n'a pas été exécuté par un script malveillant. :magicien:

Mise en place

Nous allons voir comment intégrer un captcha sur votre site. Je vais vous expliquer comment installer reCaptcha, le captcha proposé par Google. C'est selon moi un des plus sécurisé, mais si par conviction vous décidez d'en installer un autre, le processus est sensiblement le même.

Bon trêve de bavardages, passons à la pratique.

1. Rendez-vous sur le site de reCaptcha

2. Faites "Get reCaptcha"

3. Enregistrez votre site

4. Récupérez le code d'intégration fournis sur la page suivante, ainsi que les différentes clés (publique et privée)

5. Collez le premier morceau dans votre <head> et le second morceau dans votre formulaire là où vous souhaitez voir apparaître la boite reCaptcha. Attention ce second morceau contient votre clé publique. Si pour une raison ou une autre vous êtes un jour amené à changer cette clé, il faudra également la modifier dans votre formulaire. Un petit aperçu de ce que vous devriez obtenir :

<!DOCTYPE html>

<html>
  <head>
        <meta charset="utf-8"/>
      <!-- Le script du head -->
      <script src="https://www.google.com/recaptcha/api.js"></script>
     <title>Mon Site</title>
  </head>
  <body>
      <form method="post" action="">
          <!-- Notre boite de vérification -->
          <div class="g-recaptcha" 
          data-sitekey="6LeuNQITAAAAAPGRU7dkrCPIrrR64WPvzMc7pn6Z">
          </div>
          <input type="submit" id="valider" value="valider" />
      </form>
  </body>
</html>

6. Passez à la section "Intégration côté serveur". On vous indique les éléments à intégrer dans votre page de traitement. Une fois de plus, rien de bien compliqué. Si on prend le temps de lire, on comprend sans trop de problème ce qu'il faut faire. L'API va vérifier trois paramètres que vous devez lui fournir : "secret", "response" et "remoteip".

  • Secret : C'est la clé secrète qui vous a été fournie précédemment et qui va permettre d'effectuer un lien sécurisé entre votre site et Google.

  • Response : Valeur de g-recaptcha-response que l'on récupère en POST

  • Remoteip : C'est tout simplement l'adresse IP de l'utilisateur qui visite votre site.

<?php
    	
	// Ma clé privée
	$secret = "6LeuNQITAAAAAHwUcbXbyFCUudJKRAjcgNRwlaoE";
	// Paramètre renvoyé par le recaptcha
	$response = $_POST['g-recaptcha-response'];
	// On récupère l'IP de l'utilisateur
	$remoteip = $_SERVER['REMOTE_ADDR'];
	
?>

7. Les paramètres doivent être passés dans l'URL de la façon suivante :

<a href="https://www.google.com/recaptcha/api/siteverify?secret=your_secret&response=response_string&remoteip=user_ip_address">https://www.google.com/recaptcha/api/siteverify?secret=your_secret&response=response_string&remoteip=user_ip_address</a>

On dynamise tout ça :

<?php
    	
	// Ma clé privée
	$secret = "6LeuNQITAAAAAHwUcbXbyFCUudJKRAjcgNRwlaoE";
	// Paramètre renvoyé par le recaptcha
	$response = $_POST['g-recaptcha-response'];
	// On récupère l'IP de l'utilisateur
	$remoteip = $_SERVER['REMOTE_ADDR'];

	$api_url = "https://www.google.com/recaptcha/api/siteverify?secret=" 
	    . $secret
	    . "&response=" . $response
	    . "&remoteip=" . $remoteip ;
		
?>

8. Une fois toutes ces formalités réglées, on doit se préparer à recevoir une réponse de l'API en JSON. Un simple json_decode() devrait suffire à interpréter cette réponse :

<?php
    	
	// Ma clé privée
	$secret = "6LeuNQITAAAAAHwUcbXbyFCUudJKRAjcgNRwlaoE";
	// Paramètre renvoyé par le recaptcha
	$response = $_POST['g-recaptcha-response'];
	// On récupère l'IP de l'utilisateur
	$remoteip = $_SERVER['REMOTE_ADDR'];
	
	$api_url = "https://www.google.com/recaptcha/api/siteverify?secret=" 
	    . $secret
	    . "&response=" . $response
	    . "&remoteip=" . $remoteip ;
	
	$decode = json_decode(file_get_contents($api_url), true);
	
	if ($decode['success'] == true) {
		// C'est un humain
	}
	
	else {
		// C'est un robot ou le code de vérification est incorrecte
	}
		
?>

 
‌9. Voilà c'est fini ! Vous pouvez décider de vous arrêter là, ça fonctionnera parfaitement bien. Si vous êtes un développeur consciencieux et que souhaitez gérer les différentes erreurs, je vous invite à lire la documentation reCaptcha qui est vraiment très propre et bien expliquée.

Vous pouvez également vous amuser à créer votre propre système de captcha, il y a des cours disponibles sur OpenClassrooms qui expliquent parfaitement bien comment procéder. Bien que plus personnel, ce type de vérification me semble moins sûr que celui fourni par Google. Mais après tout, vous êtes tout à fait libre de vos choix donc à vous de décider. :)

Exemple de certificat de réussite
Exemple de certificat de réussite