Google reCAPTCHA – Cómo agregar en tus formularios
Agrega Google reCAPTCHA en tus formularios y evita que los robots vulneren la seguridad de tu sitio Web.
¿Estás recibiendo correo electrónico masivo (spam) desde alguno de los formularios de tu página Web? ¿Se están registrando en tu sitio Web usuarios extraños de forma masiva? ¿Te están llegando mensajes rusos o chinos sin sentido?
reCAPTCHA es un servicio gratuito que ofrece Google para proteger tu sitio web del spam y del abuso. Es una de las formas más populares para parar los bots.
Además utiliza un avanzado motor de análisis de riesgos y desafíos adaptativos para evitar que el software automatizado participe en actividades abusivas en tu sitio.
Con la instalación de reCAPTCHA, los usuarios pueden rellenar los formularios de tu sitio Web con facilidad pero no así los robots.
Google reCAPTCHA garantiza una seguridad avanzada. Lo último en protección contra el spam y el abuso para un sitio Web de forma gratuita.
Google reCAPTCHA está construido para la seguridad. Equipado con la tecnología más avanzada y siempre a la vanguardia de las tendencias de la lucha contra el spam y el abuso.
El diseño y la lógica que el usuario debe seguir para habilitar un formulario en tu sitio Web son fáciles para las personas pero no son fáciles de adivinar para los robots.
Los usuarios deben emplear una pequeña lógica, principalmente a través de imágenes asociativas para poder enviar el formulario. Una lógica simple que los robots no pueden adivinar.
El código CAPTCHA puede ser pensado y realizado por un programador pero reCAPTCHA hace un uso positivo de este esfuerzo humano canalizando el tiempo dedicado a resolver CAPTCHAs en la anotación de imágenes y la creación de conjuntos de datos de aprendizaje automático.
La creación de valor de tu sitio Web también queda garantizada ya que te aseguras que la gente que te contacta o envía tus formularios sean personas humanas.
Creación del Google reCAPTCHA
Instalar Google reCAPTCHA en tu sitio Web es bastante sencillo si tienes conocimientos técnicos en materia de creación de páginas Webs.
En primer lugar, debes crear el reCAPTCHA que más se ajuste a tus necesidades desde:
https://www.google.com/recaptcha/
Debes tener una cuenta de Google para crear los reCAPTCHA para tus sitios Webs.
Para crear un reCAPTCHA tan solo debes pulsar en el botón “+” que aparece por la parte derecha del Admin console.
Para registrar un nuevo sitio web debes especificar:
- Etiqueta: Sirve para identificar el sitio Web. Lo ideal es escribir el dominio donde vamos a emplear el reCAPTCHA.
- Tipo de reCAPTCHA: reCAPTCHA v3 y reCAPTCHA v2.
- Dominios: Si el reCAPTCHA lo vas a usar en distintos dominios puedes especificarlo en esta lista.
- Preferencia de seguridad: Puedes definir varios grados de seguridad. La más fácil para los usuarios, nivel intermedio o la más segura.
Existen varios tipos de reCAPTCHA:
- reCATPCHA v3 para verificar las solicitudes con una puntuación.
- reCAPTCHA v2 para verificar las solicitudes con un reto.
La opción más antigua (reCAPTCHA v2) permite:
- Utilizar la casilla “No soy un robot” que valida solicitudes con la casilla “No soy un robot”. El usuario debe checkear una casilla y a menudo aparece una interfaz para conseguir un reto. Por ejemplo, mostrar x imágenes y seleccionar las imágenes que contengan un semáforo.
- Utilizar la Insignia de reCAPTCHA invisible para validar solicitudes en segundo plano.
- Utilizar reCAPTCHA para Android que permite validar solicitudes en tu aplicación para Android.
Al guardar el formulario de registro del reCAPTCHA te aparece la clave del sitio Web y la clave secreta que debes copiar para agregarlas en el script de tu página Web.
Si deseamos utilizar Google reCAPTCHA v2 con la casilla “No soy un robot”, el método más sencillo para presentar el widget reCAPTCHA en tu página Web es incluir el recurso JavaScript necesario y una etiqueta g-recaptcha dentro de tu formulario.
Inclusión del API
Agrega el siguiente código dentro de la cabecera o dentro de la etiqueta <head>:
Donde estamos incluyendo la API para utilizar el reCAPTCHA.
Contenedor reCAPTCHA
La etiqueta g-recaptcha es un elemento DIV con el nombre de la clase “g-recaptcha” y la clave del sitio en el atributo data-sitekey.
Dentro del formulario que quieres evitar el spam o abuso debes agregar justo antes del botón de enviar o donde tu quieras:
Como resultado puedes ver en tus formularios el siguiente bloque reCAPTCHA:
Recepción de los datos del formulario con PHP
El código PHP que recibe la información del formulario y permite verificar el estado del elemento reCAPTCHA puede ser algo como lo que sigue:
<?php
if (isset($_POST['submitForm'])) {
$captcha_response = true;
$recaptcha = $_POST['g-recaptcha-response'];
$url = 'https://www.google.com/recaptcha/api/siteverify';
$data = array(
'secret' => '6LcPn6MUAAAAAGMPw-wB4AXjlj0eDFA-8IMobSj0',
'response' => $recaptcha
);
$options = array(
'http' => array (
'method' => 'POST',
'content' => http_build_query($data)
)
);
$context = stream_context_create($options);
$verify = file_get_contents($url, false, $context);
$captcha_success = json_decode($verify);
$captcha_response = $captcha_success->success;
if ($captcha_response) {
echo '<p class="alert alert-success">Procesar datos...</p>';
} else {
echo '<p class="alert alert-danger">Debes indicar que no eres un robot.';
}
}
?>Si el usuario ha pulsado el botón “Enviar” del formulario, hacemos una verificación del elemento reCAPTCHA para conseguir su respuesta para actuar en consecuencia.
Es importante saber que el script debe cargarse utilizando el protocolo HTTPS y puede incluirse en cualquier punto de la página sin restricciones.
Conclusiones
Probablemente, a día de hoy es imprescindible no contar con un elemento de estas características.
Agregar uno de estos elementos en tu página Web es un seguro que permite evitar que los robots llenen de basura tu base de datos o tu bandeja de entrada.
Si no tienes conocimientos técnicos para hacer esta instalación en tu sitio Web, solicita presupuesto sin compromiso enviándonos todos los detalles del problema enviando un ticket al centro de soporte técnico.
Autor
Te ha servido? Valora esta entrada!
Comparte en las redes sociales
¿Buscas trabajo de programador?
¿en que parte del codigo devo meter la direccion electronica don de se envia el formulario?
Gracias
donde pongo el correo donde va destinado?
Gracias
Hola,
Este tutorial no informa de como enviar y procesar el formulario. Tan solo se comenta como incrustar Google reCaptcha en tus formularios.
NO recuerdo tener algún tutorial disponible para mostrarte como se procesan los datos de un formulario.
Saludos
El correo lo envía, pulse o no el reCaptcha. A qué se debe?
Hola Eugenio,
Revisa bien tu código y los pasos de este tutorial.
He estado probando la demo y veo que si que funciona.
Si no seleccionas la casilla de verificación de que no eres un robot te aparece el siguiente mensaje:
Debes indicar que no eres un robot.
Gracias por la ayuda/info!
Hola,
Viendo tu código, me preguntaba como se puede hacer la comprobación de «Debes indicar que no eres un robot» en la misma pagina que se envía, ya que lo tengo en una pagina separada donde se procesa el formulario y se envía. y creo que tu lo haces en la misma pagina.
No consigo replicar lo mismo con dos paginas diferentes, ni que me funcione como tu demo.
Mucha gracias.
Hola,
El ejemplo en funcionamiento está todo en una misma página pero si el post submit tu lo haces en otra página, este código debería valer, aunque no lo he probado para confirmarlo.
Saludos
BUENAS NOCHES, SERIA BUENO QUE COLOCARAS LA FECHA EN CADA ARTICULO, YA QUE UNO NO SABE SI ES VIEJO O ACTUAL, PERO MUY BIEN QUE HAGAS ESTA TAREA
Gracias por compartir este tipo de información.