De sobra es conocido el envío de correo desde los formularios de contacto de las páginas web, produciendo muchísimos dolores de cabeza, incluso marcando la IP de nuestro servidor en listas negras, haciendo que no podamos enviar y recibir correo correctamente.
Últimamente está surgiendo este problema en muchas de las tiendas online Prestashop relacionado con el formulario de contacto por defecto. Así que, vamos a explicar como poder insertar el reCaptcha de Google para evitar el envío masivo realizado por robots.
A continuación puedes ver un ejemplo en video, o leer cómo integrarlo paso a paso.
Índice de contenidos
Creando un nuevo reCaptcha
- Entra en https://www.google.com/recaptcha, escribe el nombre de tu proyecto, selecciona el tipo de captcha (reCAPTCHA V2 o Invisible reCAPTCHA) y pulsa en Register.
- Anota la clave de sitio generada, ya que deberás usarla más adelante.
Insertando reCaptcha en Prestashop
Editar el archivo header.tpl de tu plantilla (/themes/<tu-tema>/header.tpl) y añade el siguiente código antes del cierre </head>:
<script src="https://www.google.com/recaptcha/api.js"></script>
Edita el archivo contact-form.tpl (/themes/<tu-tema>/contact-form.tpl) y añade el siguiente código antes del botón de enviar:
<div class="g-recaptcha" data-sitekey="clave-de-sitio-a-copiar"></div>
Haz una copia del archivo «/controllers/front/ContactController.php» y mételo en el directorio «/override/controllers/front/ContactController.php».
Edita este nuevo archivo. Al inicio de la función “postProcess”, aparecen varios “else if” donde se valida cada campo del formulario:
Antes del “else”, añade una validación más para el captcha:
else if (!($gcaptcha = (int)(Tools::getValue('g-recaptcha-response'))))
$this->errors[] = Tools::displayError('Captcha no verificado');
A partir de este momento, ya debe aparecer el captcha funcionando correctamente.
Eso es todo, si tenéis alguna duda o conocéis alguna otra manera de evitar el envío masivo del formulario de contacto de prestashop, estaremos encantados de leer vuestras opiniones.
Hola Rubén gracias por tu explicación, es lo más cerca que he estado de solucionar el problema. Pero en override/controlers/front/ tenía otro contactcontroller.tpl del anterior módulo de captcha el v1.0.
El caso es que me aparece el recpatcha v2 pero cuando envío el formulario de contacto me aparece que ocurrió un error al enviar el mensaje. Reviso todos los pasos y continúa.
Muchas gracias por el aporte y un saludo
Hola David,
Podrías probar a desactivar el captcha v1.0 y poner el nuevo código, por si entrara en conflicto tener ambos códigos. Por si acaso, haz un backup antes del fichero contactcontroller.tpl que comentas que tienes en /override.
También decirte que he entado a tu web y he probado a enviar el formulario, pero me ha dado el error como dices. Abriendo la consola de Chrome he visto que tienes varios errores, que posiblemente no tengan nada que ver, pero nunca se sabe… en concreto, tienes un error en el código de facebook, cuando lanzas el evento “AddToCart”, porque envías la moneda sin comillas. Esto es lo que tienes:
fbq(‘track’, ‘AddToCart’, {
value: 1,
currency: €,
});
Prueba a poner currency: ‘€’.
Un saludo.
También decir que en prestashop tengo la plantilla Arce
Hola David,
No creo que la plantilla influya para este tema… pero has llegado a probar lo que te he comentado?
Un saludo.
Ok gracias! probaré lo que me dices
Hola, si lo he probado y no hay manera. He desinstalado el v1.0 y he hecho todas las combinaciones de código posibles. A mi los «Else» me aparecen elseif no me aparece exactamente igual. El mio es 1.6.1.18
Gracias por el tutorial muy pragmático.
Una duda conoces alguna vulnerabilidad en el paquete https://github.com/dusterio/lumen-passport?
Por último un pequeño detalle las imagenes del punto Modificar el modelo “User”, añadiendo el trait “HasApiTokens” y Abrir el archivo app/Providers/AuthServiceProvider, y añadir lo siguiente, estan invertidas. Saludos.
Hola,
No conozco ninguna vulnerabilidad con este paquete, la verdad.
Gracias por avisar del intercambio de imágenes, ya está corregido.
Un saludo.
2 preguntas
1) en ningún lugar es necesario la secret key de google captcha?
2) hice todo lo que explicas pero he hecho una prueba y el mensaje se envía de todas formas pese a NO tildar la opción «no soy un robot». Qué puede estar sucediendo?
saludos
Hola Sebastian,
1) No, no es necesario.
2) Algo debes tener mal en el archivo /override/controllers/front/ContactController.php, porque no te está validando. Tendría que verlo para poder decirte la causa.
Un saludo.
Hola, Gracias por la información, ‘
sabes si es posible aplicar esto al formulario de creación de cuentas par nuevos usuarios,
desde hace unos dias recibo como 30 registros de spam .
Gracias
Hola, habría que revisar cómo tienes todo configurado… en principio sí.
Olá winamic, obrigado pela dica.
Isso funcionou comigo, no entanto, envia mensagem de qualquer maneira mesmo sem marcar caixa de «eu não sou um robô». Já existe solução para isso?
Hola,
Algún paso estarás haciéndolo mal, porque debería validar correctamente.
Saludos.
Obrigado pela resposta.
Já repus todos os 3 ficheiros originais, voltei a fazer tudo de novo seguindo todos os passos e mesmo assim envia mensagens sem marcar a caixa recaptcha.
Antes não aparecia o recaptcha no formulário de contactos, agora sim aparece, mas não funciona como esperado!
Que poderá estar errado?