Captcha (anti-robot)

[mars073]

Bonjour à tous,
J'ai fais un topic sur la création d'image et la sécu, et j'ai eu aucun commentaire :E
mais bon là je vais faire un mélange des 2 je vais vous expliquer comment faire une captcha de base.

Pour ceux qui ne qui n'ont jamais entendu parler des captcha, et non chapka (le chapeau russe), c'est le plus nouveau une suite de chiffre ou/et de lettre qu'il faut recopier lorsque l'on inscrit ou que l'on fait appel à un service sur un site.

Contexte: On doit généré un code qui fait entre 3 et 5 caractères alphanumérique en majuscule sauf 0 (car c'est lourd mélanger le O et le 0).

<?php
	$chars = "123456789AZERTYUIOPQSDFGHJKLMWXCVBN"; // La liste des caractères possible
	$code = "";
	$code_len = rand(3, 5); // longueur de code aléatoire
	for ($i = 0; $i < $code_len; $i++) {
		$code .= $chars[rand(0, strlen($chars)-1)]; // ajout d'un caractère au hasard
	}

	echo $code;
	?>

maintenant on génère un image avec:

<?php
	header('Expires: Mon, 1 Jan 2000 01:00:00 GMT'); // date à la quelle l'image doit d'être supprimée (il y a +14 ans xD)
	header('Cache-Control: no-store, no-cache, must-revalidate'); // on dit que ça doit pas mettre sauvegardé dans le cache
	header('Cache-Control: post-check=0, pre-check=0', false); // même chose
	header("Content-type: image/png"); // type d'image png, vous pouvez aussi mettre en jpeg et diminuer la qualité pour avoir un truc pour perturber les robots...

	$img = imagecreatetruecolor(120, 30); // génération d'une image de 120px de large et 30px de haut
	imagefill($img, 0, 0, 0xFFFFFF); // la couleur de fond est blanc dans ce cas-ci

	$chars = "123456789AZERTYUIOPQSDFGHJKLMWXCVBN"; // La liste des caractères possible
	$code = "";
	$code_len = rand(3, 5); // longueur de code aléatoire
	for ($i = 0; $i < $code_len; $i++) {
		$code .= $chars[rand(0, strlen($chars)-1)]; // ajout d'un caractère au hasard
	}

	imagestring($img, 5, 20, 10, $code, 0x000000);

	imagepng($img);
	imagedestroy($img);
	?>

rendu:
fonction non-vu dans mon autre topic:

• imagecratetruecolor() crée une image avec toute les couleurs (+16 million).
• imagefill() ça vous permet de remplir votre image d'une certaine couleur.
• imagestring() écrire un simple texte sur l'image.

0x000000 est l'équivalent du code couleur hexadécimal #000000 le système souvent utilisé en html, css, lua, etc. Normalement on utilise une variable (car les couleurs ne sont pas correctes de mémoire) le code pour le remplissage aurait donc due être:

<?php
	$blanc = imagecolorallocate($img, 255, 255, 255);
	imagefill($img, 0, 0, $blanc); // la couleur de fond est blanc dans ce cas-ci
	?>

la fonction imagecolorallocate() permet de déclarer une couleur en peu comme en css avec par exemple: "rgb( 255, 255, 255);".

une image php peut se mettre au même titre que n'importe quelle image dans un code html:

<!-- Contexte: L'image php s'appel "captcha.php" et se trouve dans le même dossier que le code html -->
<img src="captcha.php" border="0">
<input type="text" name="antirobot" placeholder="Recopier le code...">

Mais comment on fait pour connaître code après? simplement avec une variable $_SESSION et au passage on va ajouter entre 2 et 6 lignes en arrière-plan.

<?php
	session_start();
	header('Expires: Mon, 1 Jan 2000 01:00:00 GMT'); // date à la quelle l'image doit d'être supprimée (il y a +14 ans xD)
	header('Cache-Control: no-store, no-cache, must-revalidate'); // on dit que ça doit pas mettre sauvegardé dans le cache
	header('Cache-Control: post-check=0, pre-check=0', false); // même chose
	header("Content-type: image/png"); // type d'image png, vous pouvez aussi mettre en jpeg et diminuer la qualité pour avoir un truc pour perturber les robots...

	$img = imagecreatetruecolor(120, 30); // génération d'une image de 120px de large et 30px de haut
	imagefill($img, 0, 0, 0xFFFFFF); // la couleur de fond et blanc dans ce cas-ci

	$chars = "123456789AZERTYUIOPQSDFGHJKLMWXCVBN"; // La liste des caractères possible
	$code = "";
	$code_len = rand(3, 5); // longueur de code aléatoire

	$line_n = rand(2, 6); // nombre de ligne aléatoire entre 2 et 6
	for ($i=0; $i < $line_n; $i++) { 
		// position du point de départ et de fin de la ligne au hasard
		imageline($img, rand(1, imagesx($img)), rand(1, imagesy($img)), rand(1, imagesx($img)), rand(1, imagesy($img)), 0x000000);
	}

	for ($i = 0; $i < $code_len; $i++) {
		$code .= $chars[rand(0, strlen($chars)-1)]; // ajout d'un caractère au hasard
	}
	$_SESSION['code'] = $code;
	imagestring($img, 5, 20, 10, $code, 0x000000);

	imagepng($img);
	imagedestroy($img)
	?>

fonctions:

• imageline() tracer une ligne sur une image avec un point de départ et un point de fin.
• imagesx() retourne la largeur de l'image.
• imagesy() retourne la hauteur de l'image.

Protégé contre les robots? haha t'es marrant, je te tuerais en dernier. En faite il est extrêmement compliqué... enfin les vrai robot pas les trucs en mousse codé en javascript ou en vb.

maintenant on va faire en sorte que les lettres soient positionnées un peu aléatoirement:

<?php
	session_start();
	header('Expires: Mon, 1 Jan 2000 01:00:00 GMT'); // date à la quelle l'image doit d'être supprimée (il y a +14 ans xD)
	header('Cache-Control: no-store, no-cache, must-revalidate'); // on dit que ça doit pas mettre sauvegardé dans le cache
	header('Cache-Control: post-check=0, pre-check=0', false); // même chose
	header("Content-type: image/png"); // type d'image png, vous pouvez aussi mettre en jpeg et diminuer la qualité pour avoir un truc pour perturber les robots...

	$img = imagecreatetruecolor(120, 30); // génération d'une image de 120px de large et 30px de haut
	imagefill($img, 0, 0, 0xFFFFFF); // la couleur de fond et blanc dans ce cas-ci

	$chars = "123456789AZERTYUIOPQSDFGHJKLMWXCVBN"; // La liste des caractères possible
	$code = "";
	$code_len = rand(3, 5); // longueur de code aléatoire

	$line_n = rand(2, 6); // nombre de ligne aléatoire entre 2 et 6
	for ($i=0; $i < $line_n; $i++) { 
		// position du point de départ et de fin de la ligne au hasard
		imageline($img, rand(1, imagesx($img)), rand(1, imagesy($img)), rand(1, imagesx($img)), rand(1, imagesy($img)), 0x000000);
	}

	for ($i = 0; $i < $code_len; $i++) {
		$char = $chars[rand(0, strlen($chars)-1)]; // un caractère au hasard
		$code .= $char; // ajout du catactère
		imagestring($img, 5, 20+($i*12)+rand(-2, 2), 10+rand(-10, 5), $char, 0x000000);
	}
	$_SESSION['code'] = $code;

	imagepng($img);
	imagedestroy($img)
	?>

maintenant on va mettre des couleurs et flouter l'image avec une matrix:

<?php
	session_start();
	header('Expires: Mon, 1 Jan 2000 01:00:00 GMT'); // date à la quelle l'image doit d'être supprimée (il y a +14 ans xD)
	header('Cache-Control: no-store, no-cache, must-revalidate'); // on dit que ça doit pas mettre sauvegardé dans le cache
	header('Cache-Control: post-check=0, pre-check=0', false); // même chose
	header("Content-type: image/png"); // type d'image png, vous pouvez aussi mettre en jpeg et diminuer la qualité pour avoir un truc pour perturber les robots...

	$img = imagecreatetruecolor(120, 30); // génération d'une image de 120px de large et 30px de haut
	imagefill($img, 0, 0, 0xA3A3A3); // la couleur de fond et blanc dans ce cas-ci

	$chars = "123456789AZERTYUIOPQSDFGHJKLMWXCVBN"; // La liste des caractères possible
	$code = "";
	$code_len = rand(3, 5); // longueur de code aléatoire

	$line_n = rand(2, 6); // nombre de ligne aléatoire entre 2 et 6
	for ($i=0; $i < $line_n; $i++) { 
		// position du point de départ et de fin de la ligne au hasard
		imageline($img, rand(1, imagesx($img)), rand(1, imagesy($img)), 
			rand(1, imagesx($img)), rand(1, imagesy($img)), "0x".dechex(rand(20, 200)).dechex(rand(20, 200)).dechex(rand(20, 200)));
	}

	for ($i = 0; $i < $code_len; $i++) {
		$char = $chars[rand(0, strlen($chars)-1)]; // un caractère au hasard
		$code .= $char; // ajout du catactère
		imagestring($img, 5, 20+($i*12)+rand(-2, 2), 10+rand(-10, 5), $char, "0x".dechex(rand(180, 255)).dechex(rand(180, 255)).dechex(rand(180, 255)));
	}
	$_SESSION['code'] = $code;

	$flou = array(
		array(1.0, 2.0, 1.0), 
		array(2.0, 4.0, 2.0), 
		array(1.0, 2.0, 1.0)
	);
	imageconvolution($img, $flou, 16, 0);

	imagepng($img);
	imagedestroy($img)
	?>

ps: la fonction dechex() permet de transformer un chiffre décimal en hexadécimale pour le code couleur.
et donc le test de la captcha en requête POST (par exemple) donnerait:

<?php
	session_start();
	if (isset($_POST['antirobot'])) {
		if ($_POST['antirobot']==$_SESSION['code']) {
			echo "Le code est valide";
		} else {
			echo "Le code est incorrect";
		}
	}
	?>

Rendu final:
moche et compliqué à lire, c'est ça le principe? non à vous de modifier

Bonne programmation à tous!
Cordialement,
Mars073

[Soulalex]

C'est compliqué pour moi tout ça ^^ Est-ce qu'on pourrait avoir une image du rendu final ?

[mars073]

un peu de patience il y avait "... rédaction en cours ..." en bas, pour dire que je n'avais pas fini

s'il y a des trucs un peu chaud à comprendre faut me le dire je mets plus d'explications

[Azad]

Merci de ce tutoriel, je compte m'en servir rapidement sur un prochain site.

+1 Rep.