Antes que nada me gustaría pedir disculpas a todas las personas que ingresaron a mi blog en estos últimos días, pues he estado mudando mis sitios webs a un servidor privado, varias personas me han escrito por correo pero con este articulo les confirmo que ya todo está de lujo, ya no deberíamos tener problemas con la web. Esto fue porque quería mejorar el sitio web, cosa que en un hosting compartido no iba a lograr.


Formulario de contacto con Google reCAPTCHA


En el articulo Formulario de contacto seguro con PHP, AJAX Y HTML5 les compartí el código de un script que desarrolle que lo que hacia era generar una cadena de texto aleatoria y en base a eso se creaba una sesión cada que un usuario rellenaba un formulario y lo enviaba.

A varias personas les gusto ese aporte, es por eso que me doy a la tarea de compartir una nueva creación, una versión mejorada, te explico su funcionamiento:

Funcionamiento

  1. Hacemos validación de forma nativa con HTML5 en el formulario
  2. Se envía el formulario con la request a la API de Google reCAPTCHA
  3. Obtenemos la g-recaptcha-response y la procesamos en caso de que sea true, en caso contrario se muestra un error al cliente
  4. Se procesa g-recaptcha-response y hacemos validación SMTP
  5. Enviamos el email

El funcionamiento es demasiado sencillo, no hace falta tener mucha experiencia en programación para hacer la integración de este formulario de contacto con Google reCAPTCHA.

Librerías utilizadas (probado en un servidor con  PHP7.0):


Hacemos git al repositorio


Esto nos permitirá descargar el proyecto completo desde mi repositorio de GitHub, tecleamos en nuestra terminal el siguiente comando:

git clone https://github.com/sonlux/formulario-de-contacto-con-google-recaptcha.git

Una vez lista la descarga nos deberia aparecer de la siguiente forma:

Formulario de contacto con Google reCAPTCHA

Ingresamos la carpeta del proyecto con nuestro editor de texto favorito.


Configurar archivo enviar.php


Cuando estaba haciendo el código pensé que lo iba a utilizar para varios sitios por lo que tenia que simplificar toda la configuración en un solo archivo, es por eso que dentro de enviar.php podrás establecer todos los parámetros necesarios de configuración.

Campos a modificar:

$secret = “AQUI TU PON TU KEY SECRET”; = establecer dentro del string tu key secret de reCAPTCHA.

$mail->Host = “TU SERVIDOR DE CORREO”; = ingresa la ip o dominio en donde está tu servidor.

$mail->Username = TU CORREO PARA HACER LOGIN SMTP;  = correo para hacer login SMTP (tiene que estar alojado en la variable de arriba)

$mail->Password = “CONTRASENA DE SMTP”;  = tu password, debe coincidir con el correo que ingresaste anteriormente.

$mail->From = CORREO DEL ENVIADOR“; = ingresa el correo sender que verán tus clientes

$mail->Fromname = NOMBRE DEL ENVIADOR; = nombre del enviador

$mail->AddAddress(“EMAIL DESTINATARIO”,”NOMBRE DEL DESTINATARIO”);  = en el primer string ingresamos el correo a donde llegará el mensaje, en el segundo ingresamos el nombre del destinatario.

$mail->Subject = Contacto desde tu sitio web; = asunto del mensaje


Editar index.php


Busca la siguiente linea:

<div class="g-recaptcha" data-sitekey="6Lf9WDkUAAAAAORqPy5AodvdMkBE_ZKJQ0W56Rly"></div>

Reemplaza el campo “data-sitekey” por tu sitekey que generaste desde la API de reCAPTCHA.

Una vez realizados todos los pasos anteriores tendrás corriendo un formulario de contacto validado por Google reCAPTCHA, el cual tiene mensajes de error personalizados.

Si te ha gustado este aporte por favor compártelo en redes sociales y deja un comentario, me ayudaras a seguir trayendo contenido de calidad para el blog.

Recuerda que si tienes problemas con el script puedes escribirme por medio del repositorio en GitHub, dejando un comentario o por medio del mi formulario de contacto, con gusto te ayudare. Un abrazo virtual!!! 😀

Obtén beneficios exclusivos

Suscríbete al boletín y obtén beneficios exclusivos directo en tu correo.

Gracias por suscribirte...

Algo salió mal...