Lenguaje PHP

Crear CAPTCHA PHP para formulario: Ejemplo Completo

Crear CAPTCHA PHP para formulario. Si usted posee un sitio web, necesitara de un formulario de registro de usuarios, login de usuarios o quizá un formulario de contacto para que nuestros usuarios puedan comunicarse con nosotros sobre un asunto en específico.

Esta es una estrategia importante de una página web. Ahora, el proceso de completar los campos de los formularios puede ser automatizado por robot que generan spam para enviar una gran cantidad de correo no deseado acerca de publicidad.

Esta técnica de spam puede actuar en cualquier formulario. Los robots también se pueden usar para llenar tus foros con publicaciones de spam o comentarios que enlazan a sitios web dañinos con virus, etc.

Crear CAPTCHA PHP para formulario

A continuación, veremos preguntas frecuentes acerca del script.

Crear CAPTCHA PHP para formulario
Crear CAPTCHA PHP para formulario

¿Qué hacer frente a esta amenaza existente?

Una forma para evitar este problema es crear una barrera para los que intentan difundir el spam y los usuarios reales que desean ponerse en contacto con la página web. Por lo tanto, la solución es implementar un sistema de CAPTCHA.

¿Que son los CAPTCHA PHP?

En grandes rasgos, son imágenes con un fondo personalizado y que muestra caracteres entre números y letras de manera aleatoria. La estrategia de este sistema es que un humano podrá leer el texto dentro de la imagen, pero un robot no podrá hacerlo.
CAPTCHA o código de seguridad es un código de desafío utilizado en aplicaciones web para determinar si la acción es realizada por el ser humano. Es una combinación de algunos textos, números en la imagen distorsionada para leer sólo por los seres humanos.

¿Para qué se utiliza el CAPTCHA?

El CAPTCHA se utiliza en todas las aplicaciones web donde se envían formulario por parte de los usuarios, con esto podemos agregar seguridad, nos asegura que el envío de formularios sean personas reales y no robots.

¿Qué lenguaje se usará para crear el script?

Sera desarrollado con PHP y si está buscando implementar su propio CAPTCHA entonces estás el lugar correcto. En este artículo, aprenderemos cómo crear nuestros propios CAPTCHA hechos íntegramente con el lenguaje PHP y luego agregaremos a los formularios que deseamos implementar.

PASOS PARA CREAR CAPTCHA PHP

La creación e implementación lo haremos con 4 pasos fundamentales. Además, detallaremos los contenidos de los ficheros para este ejemplo:

  • index.php.- Sera el encargado de mostrar el formulario validado
  • get_captcha.php.- Este script tenga como papel fundamental crear el CAPTCHA
  • load_captcha.js.- Su rol será recargar otro CAPTCHA

a) Primer paso: Diseñar formulario HTML con código Captcha

Primero crearemos el archivo con nombre index.php y diseñaremos el formulario HTML con dos campos (Nombre, Email) y con una entrada para ingresar el código Captcha. Sin embargo, para darle una interfaz profesional usaremos la librería Bootstrap 3.5.
Además, agregaremos un archivo PHP llamado «get_captcha.php» para mostrar el código Captcha en modo imagen. También crearemos una opción una con id «reloadCaptcha» para recargar el nuevo código Captcha.

Formulario Captcha
Formulario Captcha
<div class="container">
<h2>Crea tu captcha para formulario PHP</h2>
<div class="row">
<div class="col-md-6">
<div class="col-md-12">
<form name="form" class="form" action="" method="post">
<div class="form-group">
<input type="text" name="nombre" class="form-control" placeholder="Ingrese nombre">
</div>
<div class="form-group">
<input type="email" name="email" class="form-control" placeholder="Ingrese Email">
</div>
<div class="form-group">
<label for="captcha" class="text-info">
<?php if($message) { ?>
<span class="text-warning"><strong><?php echo $message; ?></strong></span>
<?php } ?>
</label><br>
<input type="text" name="securityCode" id="securityCode" class="form-control" placeholder="Código de seguridad">
</div>
<div class="form-group">
<label class="col-md-4 control-label"> <img style="border: 1px solid #D3D0D0" src="get_captcha.php?rand=<?php echo rand(); ?>" id='captcha'></label>

<div class="col-md-8"><br>
<a href="javascript:void(0)" id="reloadCaptcha"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span></a> Recargar codigo
</div>

</div>
<div class="clearfix"></div>
<div class="form-group">
<label class="col-md-4 control-label"><input type="submit" name="submit" class="btn btn-info btn-md" value="Enviar Formulario"> </label>
</div>
</form>
</div>
</div>
</div>
</div>

b) Segundo Paso: Crear código Captcha con PHP

Crearemos otro archivo llamado «get_captcha.php» y programaremos un script para generar una imagen con un fondo dinámico y caracteres dinámico usando el lenguaje PHP. Sin embargo, tenemos que definir la altura de la imagen Captcha, anchura, color de texto, tamaño de fuente, estilo de fuente, etc.

<?php
session_start();
$captcha = "";
$captchaHeight = 60;
$captchaWidth = 140;
$totalCharacters = 6;
$possibleLetters = "123456789mnbvcxzasdfghjklpoiuytrewwq";
$captchaFont = "monofont.ttf";
$randomDots = 50;
$randomLines = 25;
$textColor = "6d87cf";
$noiseColor = "6d87cf";
$character = 0;
while ($character < $totalCharacters) {
$captcha .= substr($possibleLetters, mt_rand(0, strlen($possibleLetters)-1), 1);
$character++;
}
$captchaFontSize = $captchaHeight * 0.65;
$captchaImage = @imagecreate($captchaWidth,$captchaHeight);
$backgroundColor = imagecolorallocate($captchaImage,255,255,255);
$arrayTextColor = hextorgb($textColor);
$textColor = imagecolorallocate($captchaImage,$arrayTextColor['red'],$arrayTextColor['green'],$arrayTextColor['blue']);
$arrayNoiseColor = hextorgb($noiseColor);
$imageNoiseColor = imagecolorallocate($captchaImage,$arrayNoiseColor['red'],$arrayNoiseColor['green'],$arrayNoiseColor['blue']);
for( $captchaDotsCount=0; $captchaDotsCount<$randomDots; $captchaDotsCount++ ) {
imagefilledellipse($captchaImage,mt_rand(0,$captchaWidth),mt_rand(0,$captchaHeight),2,3,$imageNoiseColor);
}
for( $captchaLinesCount=0; $captchaLinesCount<$randomLines; $captchaLinesCount++ ) {
imageline($captchaImage,mt_rand(0,$captchaWidth),mt_rand(0,$captchaHeight),mt_rand(0,$captchaWidth),mt_rand(0,$captchaHeight),$imageNoiseColor);
}
$text_box = imagettfbbox($captchaFontSize,0,$captchaFont,$captcha);
$x = ($captchaWidth - $text_box[4])/2;
$y = ($captchaHeight - $text_box[5])/2;
imagettftext($captchaImage,$captchaFontSize,0,$x,$y,$textColor,$captchaFont,$captcha);
header('Content-Type: image/jpeg');
imagejpeg($captchaImage);
imagedestroy($captchaImage);
$_SESSION['captcha'] = $captcha;
function hextorgb ($hexstring){
$integar = hexdec($hexstring);
return array(
"red" => 0xFF & ($integar >> 0x10),
"green" => 0xFF & ($integar >> 0x8),
"blue" => 0xFF & $integar
);
}
?>

c) Tercer Paso: Recargar o actualizar el código Captcha

Crearemos archivos JavaScript «load_captcha.js» e implementaremos funcionalidad para volver a cargar otro código Captcha usando el identificador «reloadCaptcha«. Sin embargo, este código funcionara cuando el usuario le dé clic al icono refrescar y desencadenara la función para recargar el código CAPTCHA.

$(document).ready(function(){
$("#reloadCaptcha").click(function(){
var captchaImage = $('#captcha').attr('src');
captchaImage = captchaImage.substring(0,captchaImage.lastIndexOf("?"));
captchaImage = captchaImage+"?rand="+Math.random()*1000;
$('#captcha').attr('src', captchaImage);
});
});

d) Cuarto Paso: Validación de código Captcha

Cuando el formulario sea enviado tendremos que validar el código de Captcha en el formulario. Por lo tanto, el código debe de coincidir con el código Captcha almacenado en SESSION PHP y si son idénticos permitirá la publicación o envío de la información al destino final.

<?php
session_start();
$message = '';
if ( isset($_POST['securityCode']) && ($_POST['securityCode']!="")){
if(strcasecmp($_SESSION['captcha'], $_POST['securityCode']) != 0){
$message = "¡Ha introducido un código de seguridad incorrecto! Inténtelo de nuevo.";
}else{
$message = "Ha introducido el código de seguridad correcto.";
}
} else {
$message = "Introduzca el código de seguridad.";
}
include('main/header.php');
?>

Conclusión de Crear Captcha PHP

En este articulo hemos aprendido a crear nuestro propio código Captcha personalizado ya sea de fondo y caracteres aleatorios mediante el desarrollo de un script PHP.

Recordemos que el código CAPTCHA para que funcione al 100% tenemos que tener la GD library del PHP. Caso contrario no cargara la imagen generada por el PHP

Este es un script Captcha reutilizable con PHP para usarlo más en sus proyectos según sus necesidades. También puede mejorar esto para que sea más difícil y seguro.

Puede ver la demostración en vivo desde el enlace Demo y puede descargar el script desde el enlace Descargar a continuación.

Demostración

Demostración

Nestor Tapia

Bloggero, amante de la programación PHP, innovador y me fascina compartir información. Desde que conocí el entorno informatico y el internet me llamó la atención la programación, Por tal motivo he creado mi blog BAULPHP.COM para compartir mis experiencias con todos ustedes. ¡Gracias por leerme!.

2 comentarios

  1. Estoy probando este script tan interesante en localhot (XAMPP para Windows 7.4.2) , parece viendo el phpinfo que las librerias estan activadas
    ________________________________________________________________________________________________________________________
    Soporte GD habilitado
    Versión GD incluido (compatible con 2.1.0)
    Soporte FreeType habilitado
    Enlace FreeType con freetype
    Versión FreeType 2.9.1
    Soporte de lectura de GIF habilitado
    GIF Crear soporte habilitado
    Soporte JPEG habilitado
    libJPEG Versión 9 compatible
    Soporte PNG habilitado
    Versión libPNG 1.6.34
    Soporte WBMP habilitado
    Soporte XPM habilitado
    Versión libXpm 30512
    Soporte XBM habilitado
    Soporte WebP habilitado
    Soporte BMP habilitado
    Soporte de lectura TGA habilitado
    ___________________________________________________________________________________________________________________________
    Pero no me funciona para hacer pruebas , antes de subirlo al servidor

    Estoy implementando herramientas para tenerlas en mis aplicaciones y un captcha ( al margen de google( es necesario.

    Si puedes comentarme algo al respecto.

    Gracias de antemano

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Botón volver arriba