This requires that you have the GD library for PHP installed to work.
This tutorial requires 2 files, login.php and action.php.
The first step is to create a sub-folder to store the temporary images, for the purposes of this tutorial,this folder should be called images. Now upload a image in there called verify.php and chmod just that image(not the folder) to 777 so that image can change as our functions generate new images.
Ok, after you've done that, we can get to the code:
in login.php:
Code:
CODE
<?php
//the first number
$im = ImageCreate(200, 40); //create image
$white = ImageColorAllocate($im, 0,0, 0);
$black = ImageColorAllocate($im, 120, 200, 68);
srand((double)microtime()*1000000);
$string = rand(1,10); //the first number
$string2=rand(1,10); //the second number
$string3="$string + $string2";
$verification = $string3;
$thevalue=$string+$string2;
ImageFill($im, 0, 0, $black);
ImageString($im, 4, 70, 10, $verification, $white);
Imagejpeg($im, "images/verify.jpeg");
ImageDestroy($im);
print "<form action='action.php' method='post'>";
print "Please enter the answer to the math question below to verify your not an evil bot:<br>";
print "<input type='hidden' value='$thevalue' name='hiddenvalue'>";
print "<input type='text' name='yourcode' size='20'><br>";
print "<img src='images/verify.jpeg' border='0'><br><br>";
print "<input type='submit' name='submit' value='submit'></form>";
?>
//the first number
$im = ImageCreate(200, 40); //create image
$white = ImageColorAllocate($im, 0,0, 0);
$black = ImageColorAllocate($im, 120, 200, 68);
srand((double)microtime()*1000000);
$string = rand(1,10); //the first number
$string2=rand(1,10); //the second number
$string3="$string + $string2";
$verification = $string3;
$thevalue=$string+$string2;
ImageFill($im, 0, 0, $black);
ImageString($im, 4, 70, 10, $verification, $white);
Imagejpeg($im, "images/verify.jpeg");
ImageDestroy($im);
print "<form action='action.php' method='post'>";
print "Please enter the answer to the math question below to verify your not an evil bot:<br>";
print "<input type='hidden' value='$thevalue' name='hiddenvalue'>";
print "<input type='text' name='yourcode' size='20'><br>";
print "<img src='images/verify.jpeg' border='0'><br><br>";
print "<input type='submit' name='submit' value='submit'></form>";
?>
The first step is to create the image, the ImageCreate function in php does just that. The 200 and the 40 are the dimensions of the image created. The image created is stored in $img. $white and $black define the text color of the numbers and the background color of the image respectively. In this tutorial, the background color is greenish and the text is black for easy contrast.
Next we set the random seed with the srand function. We do this by time so when we do call the random function, we get a different number each time.
Then we generated two numbers between one and ten with the rand() function and store them in $string and $string2. In $string3, we combine them to make the actual text on the image. $string3 is not actually the sum of the numbers, it is just the text string and is not numeric. $thevalue is the actual sum of the two numbers when they are added. There's no real reason to set $verification equal to $string3 because we can just directly use $string3 but I do it by habit.
Then these lines of code:
Code:
CODE
ImageFill($im, 0, 0, $black);
ImageString($im, 4, 70, 10, $verification, $white);
Imagejpeg($im, "images/verify.jpeg");
ImageString($im, 4, 70, 10, $verification, $white);
Imagejpeg($im, "images/verify.jpeg");
Fill the image with our defined ours and stores the image into images/verify.jpeg.
Now we have to write the form. Its a pretty basic form. We store the actual value of the answer in the form field 'hidden value', which is a non-visible hidden field. The answer to the math question the user types in is $yourcode. Of couse we have to display images/verify.php so people can actually see what the math question really is.
Now we move to action.php:
Code:
CODE
<?php
if(isset($_POST['submit']))
{
$yourcode=$_POST['yourcode'];
$hiddenvalue=$_POST['hiddenvalue'];
if($yourcode==$hiddenvalue)
{
print "Correct, put your content here";
}
else
{
print "You verification code is not right. Please go back and try again.";
}
}
?>
if(isset($_POST['submit']))
{
$yourcode=$_POST['yourcode'];
$hiddenvalue=$_POST['hiddenvalue'];
if($yourcode==$hiddenvalue)
{
print "Correct, put your content here";
}
else
{
print "You verification code is not right. Please go back and try again.";
}
}
?>
This is a very simple file that basically gets the two variables from the two input fields from login.php and compares them to see if they are equal. If they are equal, it goes to the "You are correct" case, if they are not equal, it goes to the "your code is incorrect case". In a real application, you would put your actual content in the "You are correct" case and a redirect back to some other page in the "You are incorrect" case.
