La verdad esto es muy sencillo, pero hay mucha gente que no sabe hacerlo, aca aprenderemos a hacerlo paso a paso todo muy sencillo.
1.-Primero necesitamos una imagen de fondo, pueden usar la que quieran, en los formatos jpg,gif o png, teniendo nuestra imagen procederemos al código php:
Acá creamos una función que nos genera un texto aleatorio, con los caracteres que agreguemos a la variables $caracteres, pueden agregar más si lo desean, yo solo puse esos porque el estilo de fuente que use no tiene muchos caracteres especiales, tengan en cuenta que solo tomara los caracteres que se enumeren en rand(0,38), osea solo tomara 38 caracteres, si agregan más caracteres deben aumentar el número 38, de lo contrario no los tomara.
2.-Ahora debemos almacenar nuestro texto en una variable de sesion para pdoer utilizarlo, de esta forma :
$_SESSION['texto'] = palabra(9);
creamos la variable con el nombre que queramos, y le damos de valor nuestra función para crear texto, en la función el número que coloquemos dentro de los paréntesis determinara la cantidad de caracteres que tendrá el captcha.
3.-Ahora pasamos a crear la imagen de fondo :
$captcha = imagecreatefromgif("captcha.gif");
en mi caso es una imagen .gif , si fuera una .png la función sería imagecreatefrompng, y si fuera .jpg sería imagecreatefromjpeg.
4.-Creamos el color para el texto :
$colText = imagecolorallocate($captcha, 0, 0, 0);
Esto es simple, como primer parámetro la imagen donde aplicaremos el color, y los otros 3 son para el color en RGB.
5.-Luego creamos el texto para colocar sobre la imagen :
ImageTTFText ($captcha, 45, 4, 22, 55, $colText, "CREATURE.TTF",$_SESSION['texto']);
Los parametros que usamos aca son, primero la imagen, luego el tamaño del texto, luego la inclinación, luego los pixeles de la imagen de fondo desde donde se comenzara a escribir el texto(deben jugar un poco con eso para encontrar el mejor lugar según su imagen), luego el color, debe ser un color creado con al función imagecolorallocate() , sigue el archivo que contiene la fuente, tengan en cuenta que solo pueden ser archivos .ttf , en mi caso utilize esta ya que es algo deforme XD perfecto para un captcha, y por ultimo la variable de sesión que contiene el texto a escribir en la imagen.
Hasta ahora llevamos esto:
6.-Solo nos queda generar la imagen completa, lo cual haremos de la siguiente forma :
header("Content-type: image/gif");
Primero enviamos la cabecera para indicar que lo que se leerá será una imagen .gif
imagegif($captcha);
Ahora creamos la imagen, vean que la generamos con la variable donde guardamos la imagen de fondo, y a la cual se le aplico la función para escribirle un texto encima.
imagedestroy ($captcha);
Por ultimo destruimos la imagen para qeu no pueda ser usada, y asi hacer más seguro nuestro captcha.
Habiendo terminado el resultado seria algo asi :
7.-Ahora como un extra, podemos agregarle lineas, rectas o curvas, como queramos, con la función imageline() de la siguiente forma :
imageline($captcha,10,40,149,12,$clinea);
en el primer parámetro colocamos la imagen sobre la cual ira la linea, los demas parametros determinan el punto de inicio y fin de la linea, los primeros dos son las posiciones x & y del punto de inicio, y los otros dos las posiciones x & y del punto final, la variable $clinea es el color de la linea, que debe ser creado por la función imagecolorallocate(), de esta forma :
$clinea = imagecolorallocate($captcha, 0, 0, 0);
Esto debe ir antes de las funciones de imageline()
Veamos como quedara el captcha si le agregamos unas cuantas lineas, algo asi :
$clinea = imagecolorallocate($captcha, 0, 0, 0);
imageline($captcha,10,40,149,12,$clinea);
imageline($captcha,14,16,152,38,$clinea);
imageline($captcha,97,6,167,46,$clinea);
imageline($captcha,0,10,70,38,$clinea);
imageline($captcha,34,11,110,38,$clinea);
aca hay cinco lineas que se posicionan en diferentes partes de la imagen con diferentes orientaciones, agreguemoslas al captcha para ver como queda.
Hasta ahora nuestro código es este :
Y vean como queda el captcha ahora :
NOTA: si quieren lineas más gruesas pueden colocar dos lineas casi juntas, que se separen solo por 1 pixel de distancia, esto dará la sensación de grosor.
8.-Hasta ahora se nos ha pasado por alto un detalle muy importante, y es que para poder utilizar el captcha con la variable de sesión debemos iniciar una sesión, asi que debemos agregar al principio de nuestro archivo un session_start(); por lo que nos quedaría asi :
Nuestro Captcha esta listo para usarse, ahora vamos a ver como colocarlo en un form HTML de forma correcta.
if ($_POST['submit'] == "Verificar Codigo") {
if ($_SESSION['texto'] == $_POST['texto']) {
echo 'El captcha es correcto';
}
else {
echo 'El captcha no puede estar vacio';
}
}
?>
Lo que hacemos es crear un form que actué en el archivo captcha2.php, que es como llame yo a el archivo donde esta el formulario.
En un tag de imagen llamamos al archivo captcha.php, que al haber enviado las cabeceras indicando que es una imagen .gif lo leera como tal.
Creamos un campo input llamado texto, ya que ese nombre fue el que le colocamos a nuestra variable de sesión que contiene el captcha.
Y por ultimo esta el boton que hará el llamado al php para que haga la comprobación del texto del input con la variable de sesion del captcha.
Esto nos quedaría algo así :
NOTA: el session_start() debe ser lo primero en el archivo, de lo contrario nos mostrara un error diciendo que las cabeceras ya han sido enviadas.
P.D: No les dejo ni la fuente ni la imagen de fondo que yo utilice ya que es algo personal, cada uno debe hacerlo de la forma que mejor le parezca, con su propio estilo.
