codeFX.biz

Recently I implemented the reCATPCHA API into a Smarty PHP
contact form and thought this might be something useful to share.
The example provided by Google Code has one certain flaw:
It doesn’t consider if the page was loaded for the first time
whether or not – and also empty submissions
were not considered.


Here’s the simplified PHP code of my contact form – just without the business logic, of course:

<?php
require("../smarty/loader.php");
require_once("../libs/recaptchalib.php");

$pubkey  = "<your public reCAPTCHA API key>";
$privkey = "<your private reCAPTCHA API key>";
$rsp = null;

/* assuming it's the first page load, when there's no $_POST */
if(!$_POST) {
   $smarty->assign(
      "recaptcha",
      recaptcha_get_html($pubkey)
   );
}
else {
   if($_POST["recaptcha_response_field"] &&
      $_POST["recaptcha_response_field"]!=''){

      	/* request validation from the reCAPTCHA API */
      	$rsp = recaptcha_check_answer (
      	   $privkey,
      	   $_SERVER["REMOTE_ADDR"],
      	   $_POST["recaptcha_challenge_field"],
      	   $_POST["recaptcha_response_field"]
         );		

         /* process form when the API has confirmed validation */
         if ($rsp->is_valid) {

            /* the business logic happens here ...      */
            /* e.g. process form, send mail, whatever */

            /* return "success" in order to switch the template */
            $smarty->assign(
               "recaptcha",
               "success"
            );
         }
         else {
            /* return an error if the CAPTCHA was incorrect */
            $smarty->assign(
               "recaptcha",
               recaptcha_get_html($pubkey,$rsp->error)
            );
         }
      }
      else {
         /* return an error if an empty CAPTCHA was submitted */
         $smarty->assign(
            "recaptcha",
            recaptcha_get_html($pubkey,'incorrect-captcha-sol')
         );
      }
}

/* output to template */
$smarty->display("contact.tpl");
?>

And the Smarty Template contact.tpl either shows a form -
or a success message if the form has been processed.

$smarty.request is used to restore previously posted user entries
in order to preserve them whilst the page has been reloaded:

{if $recaptcha!="success"}
   <h1>Contact Us!</h1>
   <form id="contact_form" action="contact.php" method="post">
      <ul id="contact">
         <li class="row">
            <label for="name">Name:</label>
            <input type="text" id="name" name="name"
             value="{$smarty.request.name}">
         </li>
         <li class="row">
            <label for="email">E-Mail:</label>
            <input type="text" id="email" name="email"
             value="{$smarty.request.email}">
         </li>
         <li class="row">
            <label for="subject">Subject:</label>
            <input type="text" id="subject" name="subject"
             value="{$smarty.request.subject}">
         </li>
         <li class="msg">
            <label for="message">Message:</label>
            <textarea id="message" name="message">
               {$smarty.request.message}
            </textarea>
         </li>
         <li class="row">
            <label for="phone">Phone:</label>
            <input type="text" id="phone" name="phone"
             value="{$smarty.request.phone}">
         </li>
         <li class="row">
            <label for="website">Website:</label>
            <input type="text" id="website" name="website"
             value="{$smarty.request.website}">
         </li>
         <li class="captcha">
            <label for="recaptcha">&nbsp;</label>
            {nocache}{$recaptcha}{/nocache}
         </li>
         <li class="row">
            <label for="submit">&nbsp;</label>
            <input type="submit" value="Send Mail">
         </li>
      </ul>
   </form>
{else}
   <h1>Thank You</h1>
   <div class="success">
      Your Message has been submitted successfully &mdash;<br/>
      we will contact you as soon as possible.
   </div>
{/if}

Of course one could switch two separate template files as well -
that just depends how granulated the template-bits shall be:

if $recaptcha=="success"
   $smarty->display("success.tpl");
else {
   $smarty->display("contact.tpl");
}

Relevant Links

Smarty Template Engine 3.x / Google reCAPTCHA API.

This entry was posted on Tuesday, October 4th, 2011 at 18:47 and is filed under PHP. You can follow any responses to this entry through the RSS 2.0 feed. Both comments and pings are currently closed.