Requirements
:
You will need PHP and GD Graphics Library library
installed. To see if you have gd installed on your server, create a
file named info.php, plece the following content in it:
<?php
phpinfo();
?>
It should appear a page with infos and you can find if you have gd
installed or not.
A few rules :
1. Place an info message to instruct the user what to do.
2. Do not use too many letters! You want to secure your form, not to
annoy the user.
3. A hack to this security measure is using OCR systems to "read" the
text image. Use different types of fonts, rotate them in different
angles and use a background image to prevent that.
The code
explained:
Create a php
file random_image_sample.php. This file will generate the an
image with a random 5 letters text.
//random_image_sample.php contents
//start a session
session_start();
//this function is called recursivelly
function random_string($len=5, $str='')
{
for($i=1; $i<=$len; $i++)
{
//generates a random
number that will be the ASCII code of the character. We only want
numbers (ascii code from 48 to 57) and caps letters.
$ord=rand(48, 90);
if((($ord >= 48) && ($ord <= 57))
|| (($ord >= 65) && ($ord <= 90)))
$str.=chr($ord);
//If the number is not
good we generate another one
else
$str.=random_string(1);
}
return $str;
}
//create the random string using the upper
function (if you want more than 5 characters just modify the parameter)
$rand_str=random_string(5);
//We memorize the md5 sum of the string into a
session variable
$_SESSION['image_value'] = md5($rand_str);
//Get each letter in one valiable, we will format
all letters different
$letter1=substr($rand_str,0,1);
$letter2=substr($rand_str,1,1);
$letter3=substr($rand_str,2,1);
$letter4=substr($rand_str,3,1);
$letter5=substr($rand_str,4,1);
//Creates an image from a png file. If you want
to use gif or jpg images, just use the coresponding functions:
imagecreatefromjpeg and imagecreatefromgif.
$image=imagecreatefrompng("images/noise.png");
//Get a random angle for each letter to be
rotated with.
$angle1 = rand(-20, 20);
$angle2 = rand(-20, 20);
$angle3 = rand(-20, 20);
$angle4 = rand(-20, 20);
$angle5 = rand(-20, 20);
//Get a random font. (In this examples, the fonts
are located in "fonts" directory and named from 1.ttf to 10.ttf)
$font1 = "fonts/".rand(1, 10).".ttf";
$font2 = "fonts/".rand(1, 10).".ttf";
$font3 = "fonts/".rand(1, 10).".ttf";
$font4 = "fonts/".rand(1, 10).".ttf";
$font5 = "fonts/".rand(1, 10).".ttf";
//Define a table with colors (the values are the
RGB components for each color).
$colors[0]=array(122,229,112);
$colors[1]=array(85,178,85);
$colors[2]=array(226,108,97);
$colors[3]=array(141,214,210);
$colors[4]=array(214,141,205);
$colors[5]=array(100,138,204);
//Get a random color for each letter.
$color1=rand(0, 5);
$color2=rand(0, 5);
$color3=rand(0, 5);
$color4=rand(0, 5);
$color5=rand(0, 5);
//Allocate colors for letters.
$textColor1 = imagecolorallocate ($image,
$colors[$color1][0],$colors[$color1][1], $colors[$color1][2]);
$textColor2 = imagecolorallocate ($image,
$colors[$color2][0],$colors[$color2][1], $colors[$color2][2]);
$textColor3 = imagecolorallocate ($image,
$colors[$color3][0],$colors[$color3][1], $colors[$color3][2]);
$textColor4 = imagecolorallocate ($image,
$colors[$color4][0],$colors[$color4][1], $colors[$color4][2]);
$textColor4 = imagecolorallocate ($image,
$colors[$color5][0],$colors[$color5][1], $colors[$color5][2]);
Write text to the image using TrueType fonts.
$size = 20;
imagettftext($image, $size, $angle1, 10, $size+15, $textColor1, $font1,
$letter1);
imagettftext($image, $size, $angle2, 35, $size+15, $textColor2, $font2,
$letter2);
imagettftext($image, $size, $angle3, 60, $size+15, $textColor3, $font3,
$letter3);
imagettftext($image, $size, $angle4, 85, $size+15, $textColor4, $font4,
$letter4);
imagettftext($image, $size, $angle5, 110, $size+15, $textColor5,
$font5, $letter5);
header('Content-type: image/jpeg');
Output image to browser
imagejpeg($image);
Destroys the image
imagedestroy($image);
The html file random_sample.html
is a sample of how to use the random image.
<?php
session_start();
?>
<HTML>
<HEAD>
<TITLE>Random image sample</TITLE>
<META HTTP-EQUIV=\"Content-Type\" CONTENT=\"text/html;
charset=iso-8859-1\">
</HEAD>
<BODY>
<?php
$errors=0;
if(isset($_POST['Submit']))
{
$number = $_POST['number'];
if(md5($number) != $_SESSION['image_value'])
echo '<h1>Validation string not valid! Please try
again!</h1>';
else
{
echo '<h1>Your string is valid!</h1>';
//do something with the data
}
}
?>
<form name="form1" method="post" action="random_sample.php">
<table cellspacing="0" width="600" align="center">
<tr><td valign="top" align="right">Comments</td>
<td><input name="message" size=40 value="...your message
here">
</td></tr>
<tr><td colspan=2 align="center">
<font size="1" face="Geneva, Arial, Helvetica,
sans-serif"><strong><font size="2">
Please enter the string shown in the image in the form.<br> The
possible characters are letters from A to Z in capitalized form and the
numbers from 0 to 9.
</font></td></tr>
<tr><td align="center" colspan=2><input name="number"
type="text" id=\"number\"></td></tr>
<tr><td colspan=2 align="center"><img
src="random_image.php"></td></tr>
<tr><td colspan=2 align="center"><input name="Submit"
type="submit"
value="Submit"></td></tr>
</table>
</form>
</BODY>
</HTML>
|
|