PHP & MySQL, Demos, Tutorials

Creating a simple captcha form with validation

This tutorial will show you how to create a captcha form to stop automatic submissions, to premis is simple out of 6 letter there's 3 black ones these must match when the form is submitted or an error message is presented.

There are 3 files required:

  • Index.php - where the form is
  • captcha.php - generated the captcha image
  • gaptcha.jpg - captcha image

The Form

The form consists of an image in the src we pass the path to captcha.php this will generate the captcha image, we also provide a link to change the image without having to reload the page.

The input field is where the user will enter the 3 black characters from the image.

<form action="" method="post">
<p>Only enter the 3 <b>black</b> characters:</p>
<p><img src="captcha.php" alt="captcha image" id="captcha"><a href="#" onclick="document.getElementById('captcha').src = 'captcha.php?' + Math.random(); return false">Reload Image</a><br /><input type="text" id="captcha" name="captcha" size="3" maxlength="3"></p>
<p><input type="submit" name="submit" value="Submit" />
</form>

Validation

To validate the correct sequence has been entered we need to check what's in the session in order to use sessions we need to turn sessions on at the very top of the file add:

session_start();

To run the validation a check is made to make sure the form has been submitted if it has the it will run the code inside the { }

The session captcha is created inside captcha.php

The next step is to check the contents of the session matches the form input field called captcha, if there is no match an error is shown, likewise if there is a match a message is shown.

//run the code only if the form has been submitted
if(isset($_POST['submit'])){

    if($_SESSION["captcha"]!==$_POST["captcha"])
    {
        echo 'Characters do not match the black characters on the image.';
    } else {
        echo 'Matched';
    }
}

The captcha file

The following is placed in its own file it creates the characters that are embedded onto the captcha image, the image is simple a background image to start with: 

The image should be in the same directory as the captcha.php file if its not change the path accordingly below:

<?php
session_start();
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

function _generateRandom($length=6)
{
    $_rand_src = array(
        array(48,57) //digits
        , array(97,122) //lowercase chars
//        , array(65,90) //uppercase chars
    );
    srand ((double) microtime() * 1000000);
    $random_string = "";
    for($i=0;$i<$length;$i++){
        $i1=rand(0,sizeof($_rand_src)-1);
        $random_string .= chr(rand($_rand_src[$i1][0],$_rand_src[$i1][1]));
    }
    return $random_string;
}

$im = @imagecreatefromjpeg("captcha.jpg");
$rand = _generateRandom(3);
$_SESSION['captcha'] = $rand;
ImageString($im, 9, 2, 2, $rand[0]." ".$rand[1]." ".$rand[2]." ", ImageColorAllocate ($im, 0, 0, 0));
$rand = _generateRandom(3);
ImageString($im, 9, 2, 2, " ".$rand[0]." ".$rand[1]." ".$rand[2], ImageColorAllocate ($im, 255, 0, 0));
Header ('Content-type: image/jpeg');
imagejpeg($im,NULL,100);
ImageDestroy($im);
?>

That's it with 2 files you can stop automatic submissions extremely useful for contact forms.

David Carr

David Carr

For the past 12 years, I’ve been developing applications for the web using mostly PHP. I do this for a living and love what I do as every day there is something new and exciting to learn.

In my spare time, the web development community is a big part of my life. Whether managing online programming groups and blogs or attending a conference, I find keeping involved helps me stay up to date. This is also my chance to give back to the community that helped me get started, a place I am proud to be apart of.

Besides programming I love spending time with friends and family and can often be found together going out catching the latest movie, staying in playing games on the sofa or planning a trip to someplace I’ve never been before.