To make a good interactive website, customer feedback-forms / contacts forms are must. However, with online simple forms, we will get response from the visitors as well as spammers.   For avoiding auto-submissions / robotic spam abuse, one has to take proper care in the coding those forms.  Different methods are available to get relief from these spam abuses and the best one is using image verification, called also captcha.   

Captcha is nothing but creating an image with a random string displayed on it. Then visitor is asked to type that string in a text field provided. Once the form is submitted, the php code checks if the string on the image matches the one inputted by the user. Because there is no easy way to read a text from an image (image recognition) this is a good way to protect your web forms from spammers.

Most of captcha plug-ins being used are coming with different back-ground images and fonts on downloading pattern . By downloading these remote files, the page loading will take extra time and a good website does not prefer. Instead of tailor made captch codes or premium codes, one can use the simple php base code.

There are lots of php functions available to create simple image files. Instead of remote image files /font directories which will take more time on loading, the inbuilt php functions are simple and user friendly in style.  The main motto is to check the auto-spammers but not decorating the captcha with tones of external files.

Hence, we discuss the php  captcha code in detail and how it works.  For form submission, we should have three file.

 Captcha .php     -   this is the php file generates random numbers in png format.
 Form.html          -  this is the submission html file.  The user fills the required information
                               along with  captcha image code on this form.
 Validation.php    - this the simple php file which checks the captcah code of image with
                               the code  entered in the form.
Let us discuss about the coding part of the captcha file in this article.  We may segregate this code in sequential manner so that we understand the code in clear and simple method.

            -    Starting the session
       -    Random number and store in the system
       -    Preparing image - width and height, background color
       -    Text color and Font size - the string to be appeared with the color and font 
            on the background image.
       -    Padding: position of the string on the image with left, top pattern.
              -         Image - define and display of the string.

Build a new php page and save the page as  "captcha.php". (php file comes with .php extension). Then add following commands:


With this command, system generates strings and displayed on the dynamic images. If we miss to put this command, the image generated will not be stored in the system and we get error message even though the correct cpatcha code is entered.  Moreover, this command to be put at the beginning of php script.

        $num = rand(1000,9999);
       $_SESSION["captcha"] = $num; 

The above command is to generate a random integer number from 100 to 999 and then assign it to $_SESSION['captcha'].  If you want to put single digit number, then put $num=rand(1,9). The number is stored in $-SESSION - captcha   and should be match with the form having same name.

        $height = 25;
       $width = 65;
       $img = imagecreate($width, $height);
       $bg = imagecolorallocate($img, 139, 0, 0);

Then it generates a 25 x 65 pixels image with a background of pink.  Here you can edit the width and height as per your requirement. Also you can modify the background color in RGB format. If you want red color- 255,0,0  ; for green color- 0,255,0  ; for blue- 0,0,255 

        $text = imagecolorallocate($img, 255, 255, 255);
       $font = 15;

The above code generates the string color in white with font size 15 pixels; the color code is in RGB format.  You may modify the color of the string and font in pixel as per your requirement.

        imagestring($img, $font, 5, 4, $num, $text);

This code create image with all the strings (here $img- display the 25x65 pixel black background, $font - the size in pixel, 8 - pixel from left; 5- pixel from top; $num- the random number between 10000-99999; $text- display the number in the color specified above.  You may change the functions as per the requirement.  If you want to put the captcha number on top - left, then put 0,0, instead of 8,5 ).

        header("Content-type: image/png");
       imagejpeg($img, null, 80); 

The first function defines the image as PNG and the second one displays the image as PNG.  Here the null specifics, where there is no path for the image (skipping file name) and 80  signifies the quality as 80%. Where quality is optional, and ranges from 0 (worst quality, smaller file) to 100 (best quality, biggest file). The default value for quality is about 75.

By adding starting and closing php tags, you will get the complete php file.  When you upload the captcha.php file on your web site (i.e you will see an image displaying random integer. You will receive a new random integer every time when you refresh the page.

You may simply put the following url to get the captcah without php code.

No comments:

Click Here To add Comment

Post a Comment