Formulario de contacto en PHP con Google reCAPTCHA

Un formulario de contacto con los datos validados mediante un captcha puede ser la mar de útil si queremos discernir si quien está utilizando el formulario es un bot o un humano. En este tutorial, vamos a integrar el Google reCAPTCHA en un formulario de contacto desarrollado en PHP. Utilizando este código, podrás distinguir a los usuarios humanos y proteger el envío de tu formulario ante los bots.

En este ejemplo, cargo las dependencias de la librería de Google reCAPTCHA. Ojo, para utilizar esta librería primero tendremos que registrar nuestro sitio web, obtener las keys necesarias y configurar dichas keys en nuestro código. En el formulario de contacto, se mostrará el captcha y se validará al usuario al hacer submit.

Formulario de contacto con Google reCAPTCHA

Además, cargo un archivo de recursos de Javascript y renderizaremos el widget de reCAPTCHA utilizando DIV tageado como g-recaptcha. En este tag, definimos la key de la API para el sitio utilizando el atributo de HTML5 data-site-key.

Cuando el usuario resuelva el captcha, se devolverá el token correspondiente. Se creará un nuevo elemento HTML dinamicamente llamado g-recaptcha-response que almacenará el token del usuario. Este token también se enviará a nuestro script PHP cuando se haga submit del formulario.

<form id="frmContact" action="" method="POST" novalidate="novalidate">
    <div class="label">Name:</div>
    <div class="field">
        <input type="text" id="name" name="name"
            placeholder="enter your name here"
            title="Please enter your name" class="required"
            aria-required="true" required>
    </div>
    <div class="label">Email:</div>
    <div class="field">
        <input type="text" id="email" name="email"
            placeholder="enter your email address here"
            title="Please enter your email address"
            class="required email" aria-required="true" required>
    </div>
    <div class="label">Phone Number:</div>
    <div class="field">
        <input type="text" id="phone" name="phone"
            placeholder="enter your phone number here"
            title="Please enter your phone number"
            class="required phone" aria-required="true" required>
    </div>
    <div class="label">Comments:</div>
    <div class="field">
        <textarea id="comment-content" name="content"
            placeholder="enter your comments here"></textarea>
    </div>
    <div class="g-recaptcha" data-sitekey="<?php echo SITE_KEY; ?>"></div>
    <div id="mail-status"></div>
    <button type="Submit" id="send-message" style="clear: both;">Send
        Message</button>
</form>

Validación en PHP de nuestro formulario

El código PHP leerá el token de respuesto del usuario que se ha enviado junto a los datos del formulario de contacto. Después, realizaremos una solicitud a la API con este token y la key de la misma. Una vez validado el token, la API nos devolverá la respuesta en formato JSON.

<?php
if($_POST)
{
require('constant.php');
    
    $user_name      = filter_var($_POST["name"], FILTER_SANITIZE_STRING);
    $user_email     = filter_var($_POST["email"], FILTER_SANITIZE_EMAIL);
    $user_phone     = filter_var($_POST["phone"], FILTER_SANITIZE_STRING);
    $content   = filter_var($_POST["content"], FILTER_SANITIZE_STRING);
    
    if(empty($user_name)) {
		$empty[] = "<b>Name</b>";		
	}
	if(empty($user_email)) {
		$empty[] = "<b>Email</b>";
	}
	if(empty($user_phone)) {
		$empty[] = "<b>Phone Number</b>";
	}	
	if(empty($content)) {
		$empty[] = "<b>Comments</b>";
	}
	
	if(!empty($empty)) {
		$output = json_encode(array('type'=>'error', 'text' => implode(", ",$empty) . ' Required!'));
        die($output);
	}
	
	if(!filter_var($user_email, FILTER_VALIDATE_EMAIL)){ //email validation
	    $output = json_encode(array('type'=>'error', 'text' => '<b>'.$user_email.'</b> is an invalid Email, please correct it.'));
		die($output);
	}
	
	//reCAPTCHA validation
	if (isset($_POST['g-recaptcha-response'])) {
		
		require('component/recaptcha/src/autoload.php');		
		
		$recaptcha = new ReCaptchaReCaptcha(SECRET_KEY, new ReCaptchaRequestMethodSocketPost());

		$resp = $recaptcha->verify($_POST['g-recaptcha-response'], $_SERVER['REMOTE_ADDR']);

		  if (!$resp->isSuccess()) {
				$output = json_encode(array('type'=>'error', 'text' => '<b>Captcha</b> Validation Required!'));
				die($output);				
		  }	
	}
	
	$toEmail = "[email protected]";
	$mailHeaders = "From: " . $user_name . "<" . $user_email . ">rn";
	if (mail($toEmail, "Contact Mail", $content, $mailHeaders)) {
	    $output = json_encode(array('type'=>'message', 'text' => 'Hi '.$user_name .', thank you for the comments. We will get back to you shortly.'));
	    die($output);
	} else {
	    $output = json_encode(array('type'=>'error', 'text' => 'Unable to send email, please contact'.SENDER_EMAIL));
	    die($output);
	}
}
?>

 

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP