PHP TIPS AND TRICKS - Securing Forms with Random Noisy Images

This tutorial is intended for those who want to ensure that the data retrieved by a form processor PHP is sent by the expected form, not another application or by hand.

(For more about Zend Technologies, please visit www.zend.com)

An understanding form data processing is assumed. A basic knowledge of image creation and manipulation functions is also required.

Introduction

Every site administrator wants to be sure that a real person filled out the form on their site, not a ‘script’. Especially if the form returns valuable information that others would like. This info may be subscription, domain query, currency rates, weather etc. Almost every programmer (with HTTP and sockets knowledge) can build a script to fill out your form automatically. As you know, ‘Grabbing a Web Site’ is a popular tutorial topic on The Net.

You can never completely protect your sources being grabbed, but you can set some traps that scripts can’t jump over. The most widely used trap is a noisy image, which a human’s eye can read easily but no algorhytm can.

The only constraint that we shouldn’t forget is that the text displayed on the image shouldn’t also be written in the source, otherwise another application or script can grab the source and decipher the text from there. Hence we have to key the information by creating a request ID / code pair, and have a data source where this pair is stored.

Creating a unique information key (or “request id”) is not difficult with PHP. Let’s use uniqid(md5(time( ))) which returns a 45-character-length string. And, as a code displayed on image, generate random 6-digit-number with rand(100000, 999999) function. Every time the form displayed, we’ll generate a pair of values, and insert it into database.

Pseudo Code and Flow Diagram

Before displaying the form, the first PHP (form.php) generates a pair of request id-codes, and inserts them into database (1),

then passes the request id to image creating PHP (image.php) on querystring (2).

This PHP queries the database to retrieve the code associated with this request id (3). After retrieval, a noisy image is created with random parameters, then returns the image to the form (4).

form.php shows the image beside the form, and puts a text field asking the client “what do you see in the box”. The request id is also placed in a HIDDEN field in the form. Hidden request id (5) and code entered by user (6) are posted to the processing script (processor.php).

Proccessing script retrieves the text in the same way, with image.php (7), then compares this code with the user input (8).

Data Schema

Create a table named auth_code in database test:

CREATE TABLE auth_code (

Status code abbreviations stands for “Waiting”, “Approved”, “Expired”, “Not Approved” respectively.

Randomization of Image

When creating the image, we should modify as much as parameter we can every time. Those parameters are;

• Colors. Background, font and noise colors. For readibility, there should be a contrast between background and font colors. So, background colors are generated using red, green, blue values below 132, which make darker colors, while font colors’ are generated with RGB values between 191 and 255, which makes lighter colors. Light colors on dark background can be read easily. Noise color are generated relative to background color. See get_random_colors( ) function in image.php
• Font. Font selection can either be random or fixed. If you want the font randomly selected, set $ font_selection variable’s value to “random” and supply the font directory’s path with $ font_folder and a list of available fonts with $ fonts array. Otherwise, set the value to “fixed”. Also supply $ fonts array, and set the $ default_font’s value to the index of default font in this array.
• Text Angle. This can be either random or fixed, too. If you want the text angle randomly change, set $ angle_selection variable’s value to “random” and supply the angle range. If you set 10 to $ max_angle, script will treat this as a unsigned value and change the range to signed equivalent of this value. (like -5..5). Otherwise, set the value to “fixed” and $ default_angle value to default angle.
• Noise Methods. Will the noise effect be achieved, with dots, rectangles or lines? Just set the $ noise_method variable to “line”, “dots” or “rectangle”.Noise count is equal to $ freq variable’s value. A point (x,y) is randomly selected $ freq times. This point is the pixel where the dot is placed (if you chose “dots”), the center of the 3x3 rectangle (if you chose “rectangle”), or the starting point of the line (if you chose “lines”).

The other parameters are not random but can also be set.

• Size of Image. Set $ x as width and $ y as height of image. Also change the WIDTH and HEIGHT attributes of IMG tag calling image.php as SRC on form.php.
• Noise Frequency. How many dots/lines/rectangles will be on the image?
• Font Size.

Sample Codes

form.php

< HTML >

<

<

< /

< ? php

@

@

< BODY BGCOLOR="#FFFFFF" >

<

<

<

<

<

<

<

<

< /

<

<

< /

< /

< /

< /

< /

< /

image.php

< ? php

if (

@

} else {

}

//////////////////////////////////////////////////////////////////////////

//////////////////////////////////////////////////////////////////////////

// Set font

} else {

}

} else {

}

// $ dot = array of noise (R,G,B) values

// $ txt = array of text (R,G,B) values

}

}