KidsLovePC Contact Us
  Home   PHP  Graphics ASP  JavaScript   J2EE  HTML  JAVA   Swing   Webtip  Forums  Lyric  Free sheet music  Ringtones

Anti-spam image creation

Before you start this lesson, before read the lesson PHP Image processing introduction and make sure you enable GD library.

This tutorial will demonstrate how to create Anti-Spam images. This is an image contains (some random) text which is very, very hard for any OCR program to decipher but easy for a human to read. This is used to prevent automatic signup to mailing lists and various on-line services.

Many users have run across the verification image containing numbers and letters that you must plug into an input box for verification. And maybe you thought, "How could I do that ?"
This tutorial will show you how.

Here is the anti-spam image (image verification) live demo.

Create Image

Before we start this lesson, it is better to see the whole flow chart of this verification procedure. First we need create an image with a verification string in it and meanwhile use a session variable to store this random generated verification string. Then we compare user input with the session variable. If match, pass. Other wise, prompt error message.

Now, it is our first step. We need create a verification image, which is generated randomly on fly.

In this tutorial, we create an image with black background and white foreground.


/* initialize a session. */

/*We'll set this variable later.*/

/*random string generator.*/
/*The seed for the random number*/


/*Runs the string through the md5 function*/
$string = md5(rand(0,9999));

/*creates the new string. */
$new_string = substr($string, 17, 6);

//register session variable

/*You will need these two lines below.*/
/* set up image, the first number is the width and the second is the height*/

$im = ImageCreate(200, 40);

/*creates two variables to store color*/
$white = ImageColorAllocate($im, 255, 255, 255);
$black = ImageColorAllocate($im, 0, 0, 0);

/*fill image with black*/
ImageFill($im, 0, 0, $black);

/*writes string */
ImageString($im, 4, 96, 19, $new_string, $white);

/* output to browser*/
Header("Content-Type: image/png");

First step, we will create a random string generator to place as the verification code inside the image. I won't discuss how the random generator code works, but will only lay out the code with comments.

Use $new_string storing 6 letters from random generated string as verification string and meanwhile save the verification string to session variable $_SESSION['new_string'].

Second step, we need write the verification string to image. Use ImageCreate to create an image with size of 200 X 40 pixels.

ImageColorAllocate function is called twice. The first time is to set the color for white, the second to set the color for black. The function take 4 arguments: The image pointer variable $im, and the RGB (red, green, blue) components that are separated by commas. (255, 255, 255, is the code for white, while 0, 0, 0, is the code for black. You can play with the numbers to produce any color you want.)

Then, ImageFill function is called. It takes 4 arguments: Again we add the image pointer variable $im, the second and third are x, y coordinates in our image, 0, 0, being at the top left corner. Our image size is 200x40, therefore, the bottom right corner would be 200, 40. The fourth argument tell us with what color to fill the image with: In our case it is black.

ImageString adds a string to the image. It takes six arguments. The first is the image pointer variable, the second argument can be any number from 1 to 5,(which calls for one of the built in fonts). The next two arguments are the coordinates, first the x (width) then the y (height). This is for the placement of our string. The next argument calls for the string variable. In our case it is $new_string. The last argument is the variable containing the color, which is $white.

The last step is to output the created image to browser. Header("Content-Type: image/png"); tells the browser the image is in png format. Finally ImageDestroy function is called , it has one argument: the pointer variable. Destroying the image frees up server memory. Your server administrator will like you for this.

Save the above code as createimage.php.

Input form

The following is the verification form to get the user input.

<img src="createimage.php">
Type the code you see in the image in the box below. (case sensitive)
<form action="formhandler.php" method=post>
<input name="random" type="text" value="">
<input type="submit">

Verification code

Save the following code as formhandler.php.

If you have read the lesson: PHP working with form, you may feel easy to see the following code.

$random retrieves the user input $_POST['random']. Then compare $random with the session variable $new_string

/*This starts the session that we created on the last page*/
/*This trims the random variable of any white space that the user may have unknowingly put in.*/
$random = trim($random);

/* if the string that the user put into the text box is equal to what is in the image then print to the screen, "You are verified." If they are not equal it tells the user to go back and try again.*/

/*We can use the variable $new_string because we registered it into our session on the last page, it retains its value that it had on the first page.*/
if ($_SESSION['new_string'] == $random){
echo "You are verified";
echo "Please go back and get verified.";



Warning: mysql_connect(): Access denied for user 'kidslove'@'localhost' (using password: YES) in /home1/chinesel/public_html/kidslovepc/php-tutorial/pullcom2.php on line 9
Unable to specified database