Integrar captcha y reCaptcha v3 de Google en tu aplicación Web con PHP

Integrar captcha y reCaptcha  v3 de Google en tu aplicación Web con PHP

El proceso se explica completamente en el vídeo a continuación:

¿Qué es un captcha?

Un captcha es un sistema de pruebas que distorsionan carácteres de una imagen para confirmar que el validador es efectivamente una persona y no un software que ejecuta tareas automatizadas.

Por ejemplo un captcha puede evitar que se hagan demasiados intentos fallidos en un sistema de acceso de usuario con contraseña. Un bot podría intentar 10000 veces acceder con diferentes contraseñas y romper la seguridad de una aplicación.

Un captcha puede evitar que un software malicioso acceda a tu aplicación, por fuerza bruta, si cada intento requiere de un prueba de imagen. Para los bots aún es difícil reconocer caracteres deformes en una imagen que no corresponden una fuente específica.

¿Qué es un recaptcha?

Un recaptcha es la reinvención de Google de los captcha, que en sus pruebas para confirmar que efectivamente es un humano quien accede a los recursos de una aplicación. Incluye imágenes con características específicas, por ejemplo, ¿de las fotos descritas cualquier incluyen un puente? Entre otros.

¿Qué es un recaptcha invisible?

De los recaptcha hay diferentes versiones, actualmente hay una tercera versión, menos invasiva, donde automáticamente, según tus cookies, tu ip y algunos procesos que Google mantiene ocultos, el mismo sistema concluye que eres un humano o una máquina y por si mismo puede decidir banear tu ip o hacer alguna prueba de confirmación que efectivamente es un humano quien intenta acceder.

Puesta a punto de un Captcha y un Recaptcha Versión 3 de Google en un servidor local

Explicación del proceso de instalación de un Captcha en servidor local

Descarga de aplicaciones requeridas para el funcionamiento del proyecto

Para la puesta a punto como es habitual es necesario, descargar las siguientes aplicaciones:

  • XAMPP, para habilitar un servidor local.
  • GIT, para descargar el proyecto de GitHub
  • Visual Studio Code, para manipular el código, esta última sugerencia no es requerida obligatoriamente, pero si está directamente relacionado con el vídeo del post.

Debes realizar la descargar he instalar las aplicaciones listadas anteriormente con todos los parámetros por defecto en tu ordenador.

Descarga del proyecto de GitHub

El proyecto para descargar de GitHub es el siguiente:

Ubicación del Proyecto en tu ordenador

El proyecto se debe descargar en la siguiente ubicación. Si realizaste la instalación de XAMPP con todos sus parámetros por defecto.

C:\xampp\htdocs

Código de descarga del proyecto de GitHub

Si estás realizando el proceso con Visual Studio Code, abres la carpeta htdocs, en la ubicación descrita anteriormente.

Posteriormente abres la consola ubicada en la opción View, Terminal y ejecutas el comando a continuación, se previamente realizaste la instalación de GIT

git clone https://github.com/configuroweb/recaptcha.git

Re abres el proyecto en la siguiente ubicación desde Visual Studio Code

C:\xampp\htdocs\recaptcha

Activación del Servidor Local

Para este punto solo tendrás que acceder a XAMPP, activar el servicio de Apache y en la siguiente ubicación en tu navegador, preferiblemente Chrome

http://localhost/recaptcha/captcha/

Explicación del proceso de instalación del reCaptcha versión 3 en un servidor local

Debes acceder a la página de Google reCaptcha para registrar tu sitio y de ese modo obtener las llaves para que funcione el proyecto a nivel local

https://www.google.com/recaptcha/admin/create

Luego en la opción de Tipo de reCAPTCHA eliges la opción de v3, que es la de recaptcha invisible. La mostrada en el vídeo.

Posteriormente donde dice Dominios, pulsas en el apartado de Añade un dominio. Allí pones lo siguiente http://localhost/

Por último acepta las condiciones de servicio y dale clic a enviar

Claves Google reCaptcha

Modificación del archivo config.php

Las claves que te genera el sistema de Google después de agregar el sitio, las debes poner en el archivo config.php del proyecto, donde dice client-key pones la clave de sitio web y donde dice secret-key diligencias con la clave secreta.

El código de la config.php es el siguiente:

<?php
return [
	'client-key' => 'xx',
	'secret-key' => 'xx'
];

Visualización del Proyecto reCaptcha V3 en tu servidor local

Para visualizar el proyecto ya instalado en tu ordenador con XAMPP activado en el servicio de Apache y posterior a la modificación de los parámetros config.php solo queda acceder a la siguiente URL

http://localhost/recaptcha/login.php

Y en pantalla te debe aparecer una página con el siguiente mensaje

Cualquier duda, estaré al pendiente.

1 thought on “Integrar captcha y reCaptcha v3 de Google en tu aplicación Web con PHP

Deja una respuesta

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

×
¿Qué te interesa?
Selecciona los temas de interés sobre
los que deseas recibir noticias: