[PHP] Utiliser reCaptcha

ReCaptcha est une libraire qui permet d'ajouter facilement un captcha antispam performant sur un site web. Ce service est très populaire outre Atlantique (il est même utilisé par Twitter). Ce petit tutorial va expliquer comment s'en servir et les manières misent à disposition par reCaptcha pour personnaliser la partie d'un formulaire qui affiche le captcha.

Mise à jour 26/07/2015 : la technologie de reCaptcha a évolué en décembre 2014, depuis la première publication de cet article. L'article a été mis à jour en conséquent pour inclure les informations liées aux dernière nouveautés.

reCAPTCHA 2.0

Présentation de reCaptcha

Le spam est un vrai fléau sur le web. De nombreux sites essaient de faire des sécurités pour éviter qu'un robot utilise une application sur le web à la place d'un humain. Toutefois, la plupart des solutions existantes ne sont pas d'une grande efficacité. Malgré tout, l'outil reCaptcha se démarque du lot et est utilisé par des milliers de sites web.

ReCaptcha a également l'avantage d'être accessible grâce au formulaire qui peut être utilisé par les personnes ayant une déficience visuelle car c'est compatible avec les technologies d'assistances. Enfin, c'est gratuit et globalement facile à utiliser.

Tutoriel d'utilisation de reCAPTCHA 2.0 (nouvelle version)

1) S'inscrire sur le site officiel

Inscrivez-vous ou connectez-vous avec votre compte Google à l'adresse suivante : https://www.google.com/recaptcha/. Garder les identifiants, car cette interface en ligne vous sera utile pour obtenir des codes uniques et des statistiques sur les éventuelles attaques informatiques.

Une fois inscrit, ajoutez-y le site web sur lequel vous souhaitez installer le captcha. Vous obtiendrez un clé pour le site et une clé privée, notez-les soigneusement à l'aide d'un petit copier/coller, elles vous seront utiles ultérieurements.

2) Installer la librairie

Un dépôt officiel a été créé sur Github à l'adresse suivante : https://github.com/google/recaptcha. Sur cette page il est possible de télécharger les sources à l'aide du bouton "Download ZIP", pour ensuite installer la librairie sur votre site web.

Astuce : les fichiers de la librairies incluent un exemple officiel simple et concret.

3) Code pour afficher le captcha dans le formulaire

Une fois la librairie installée, il faut ajouter le code pour l'inclure sur la page PHP de votre formulaire, par exemple en copiant/collant ce code :

[code lang="php"]<?php
// include de ReCaptcha
include_once DIR_LIB.'classes/ReCaptcha/ReCaptcha.php';
include_once DIR_LIB.'classes/ReCaptcha/RequestMethod.php';
include_once DIR_LIB.'classes/ReCaptcha/RequestParameters.php';
include_once DIR_LIB.'classes/ReCaptcha/Response.php';
include_once DIR_LIB.'classes/ReCaptcha/RequestMethod/Curl.php';
include_once DIR_LIB.'classes/ReCaptcha/RequestMethod/Post.php';
include_once DIR_LIB.'classes/ReCaptcha/RequestMethod/Socket.php';
include_once DIR_LIB.'classes/ReCaptcha/RequestMethod/SocketPost.php';
?>[/code]

Puis, il faut insérer le code suivant à l'endroit où le captcha doit s'afficher (en pensant à personnaliser le code) :

[code lang="php"]<?php $siteKey = 'VOTRE_CODE_SITE_KEY'; ?>
<div class="g-recaptcha" data-sitekey="<?php echo $siteKey; ?>"></div>
<script type="text/javascript" src="https://www.google.com/recaptcha/api.js?hl=fr"></script>[/code]

4) Code de vérification

Pour vérifier la réponse, utilisez par exemple ce bout de code :

[code lang="php"]<?php
$secret = 'CODE_CLE_SECRETE'; // a personnaliser

if (isset($_POST['g-recaptcha-response'])):
// creer une instance de la librairie
$recaptcha = new \ReCaptcha\ReCaptcha($secret);

// verifier qu'on a les droits
$resp = $recaptcha->verify($_POST['g-recaptcha-response'], $_SERVER['REMOTE_ADDR']);

if ($resp->isSuccess()):
// la reponse est un succes, bravo
echo 'BRAVO VOUS ETES HUMAIN';
else:
// erreur, c'est un robot
echo 'OUPS, VOUS SEMBLEZ ETRE UN ROBOT';
endif;
endif;
?>[/code]

Attention, pensez tout de même à lire le bout de code fournit dans l'exemple officiel, il contient des informations importantes notamment si le code ne fonctionne pas sur votre installation.

Tutoriel d'utilisation de reCaptcha 1.0 (ancienne version)

Exemple de captcha antispam (version 1.0)

1) S'inscrire sur le site recaptcha.net

La première étape consiste à s'inscrire sur le site http://recaptcha.net. Sachant que le projet recaptcha.net essaie de combattre le spam, vous pouvez presque est certain que votre adresse email utilisé pour l'inscription ne sera pas revendu à des tiers.

A la fin de l'inscription, il faut prendre note de la clé publique et de la clé privée. Sans ces deux informations, il ne sera pas possible d'utiliser la librairie.

2) Installer la librairie

Il existe plusieurs versions de la librairie et il existe également des plugins (notamment un plugin WordPress). Dans la liste des librairies reCaptacha il faut télécharger la version pour PHP. Une fois téléchargé, le fichier doit être décompressé puis installer quelque part sur l'hébergement du site web. Les débutants peuvent installer la librairie au même endroit où se trouve le formulaire qui utilisera la librairie. Les webmasters expérimentés peuvent installer la librairie dans un fichier où se situe toutes les librairies.

3) Code PHP pour afficher le captcha

Une fois que la librairie est sur l'espace web, il est possible de commencer à coder la page qui utilisera le captcha. Le code pour afficher ce captcha est relativement simple:

<?php
require_once('recaptchalib.php'); // Vérifier que l'URL relative correspond à l'emplacement du fichier (adapter si nécessaire)
$publickey = "..."; // Utiliser la clé que vous avez eu lors de l'inscription sur recaptcha.net
echo recaptcha_get_html($publickey); // Affiche le captcha
?>

Attention: il faut bien veiller à ce que l'URL relative corresponde à l'emplacement du fichier. Dans le cas contraire, il y aura une erreur sur la page car celle-ci n'aura pas réussi à accéder au fichier.

4) Code PHP de vérification

Le code PHP présenté ici est volontairement présenté à part de l'autre code. La raison est simple, il arrive que le formulaire de validation soit présent sur une autre page web. Dans le cas où le formulaire envois vers la même page, il est possible de joindre les codes sur la même page.

<?php
require_once('recaptchalib.php'); // Ne pas réafficher cette ligne dans le cas où ce code est sur la même page que le formulaire
$privatekey = "..."; // Utiliser la clé privée qui est donnée sur votre compte recaptcha.net
$resp = recaptcha_check_answer ($privatekey,
                                $_SERVER["REMOTE_ADDR"],
                                $_POST["recaptcha_challenge_field"],
                                $_POST["recaptcha_response_field"]);

if (!$resp->is_valid) { // Test si le captcha a bien été rempli
  // Si le captcha n'est pas valide
  echo 'Oups, le captcha antispam n\'est pas valide. Veuillez recommencer';
}
else{
  // Si le captcha est valide
  // Ici, utiliser votre code PHP pour traiter le formulaire
}
?>

5) Personnaliser l'aperçu du captcha

Les couleurs par défaut sont malheureusement très tape-à-l'œil. Le rouge ne va pas forcément avec le design de votre site. Il est alors pratique de pouvoir adapter le design du formulaire. Il y a quelques thèmes par défaut qu'il est possible d'utiliser. Pour cela il faut utiliser le code suivant sur votre page web entre <head> et </head>:

<script type="text/javascript">
var RecaptchaOptions={
lang: 'fr',
theme: 'clean'
};
</script>

A noter: ce code permet par la même occasion de franciser l'interface.

Il faut également savoir qu'il y a plusieurs thèmes de base possible. Il est possible de remplacer "clean" par une des valeurs suivantes: white, red (par défaut), blackglass ou custom. N'hésitez pas à tester pour voir à quoi ressemble l'interface dans chacun de ces cas.