Expert of PHP: Create a Simple Captcha Script Using PHP

We all have encountered captcha validation in online web forms. Basically captcha are used to check that weather you are human or a bot. These captcha images contains some readable text with some noise, shape, distortion, lines and dots, which are readable by human and who can write it into the captcha input field to confirm that user is human, not a bot.

There are ready made third party captcha plugins available on the internet such as ReCaptcha, aim of this tutorial is to share knowledge that how captcha works and how can we create our own custom captcha.

Requirement:

Please make sure that GD(Graphics Draw) library is installed on your host. Mostly web host already have it. But if you don’t then you can install it, follow instructions or ask you web hosting company to install it.

Steps to create a Captcha Using PHP

Create an index.php file
Create a captcha.php file

1. Create an index.php file

First of all i will create an index file, in this file i will create a html form of captcha. I will also add javascript that will refresh captcha without refreshing page. After captcha form submission, entered captcha code will be validated with the generated captcha code. If both are same user will see a message of success otherwise failure.

Now create index.php page and copy paste the below html captcha form in it.

HTML

1

2

3

4

5

6

7

8

9

10

11

<form name="form" method="post" action="">

<label><strong>Enter Captcha:</strong></label><br />

<input type="text" name="captcha" />

<p><br />

<img src="captcha.php?rand=<?php echo rand(); ?>" id='captcha_image'>

</p>

<p>Can't read the image?

<a href='javascript: refreshCaptcha();'>click here</a>

to refresh</p>

<input type="submit" name="submit" value="Submit">

</form>

JavaScript

1

2

3

4

5

6

7

8

9

<script>

//Refresh Captcha

function refreshCaptcha(){

    var img = document.images['captcha_image'];

    img.src = img.src.substring(

 0,img.src.lastIndexOf("?")

 )+"?rand="+Math.random()*1000;

}

</script>

Add the above javascript in the footer of index.php. This script will refresh the captcha if it is very difficult to read, so that user can insert new captcha code.

PHP Script

Enter the below php validation script in the header of index.php file, before starting the <html> tag.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

<?php

session_start();

$status = '';

if ( isset($_POST['captcha']) && ($_POST['captcha']!="") ){

// Validation: Checking entered captcha code with the generated captcha code

if(strcasecmp($_SESSION['captcha'], $_POST['captcha']) != 0){

// Note: the captcha code is compared case insensitively.

// if you want case sensitive match, check above with strcmp()

$status = "<p style='color:#FFFFFF; font-size:20px'>

<span style='background-color:#FF0000;'>Entered captcha code does not match! 

Kindly try again.</span></p>";

}else{

$status = "<p style='color:#FFFFFF; font-size:20px'>

<span style='background-color:#46ab4a;'>Your captcha code is match.</span>

</p>"; 

 }

}

echo $status;

?>

The above script is matching the captcha code with the users input and showing message of success or failure.

2. Create a captcha.php file

Now most important step, create a captcha.php file and copy paste the below script in it.

PHP Script

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

83

84

85

86

87

88

89

90

91

92

93

94

95

96

97

98

99

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

<?php

session_start();

//You can customize your captcha settings here

$captcha_code = '';

$captcha_image_height = 50;

$captcha_image_width = 130;

$total_characters_on_image = 6;

//The characters that can be used in the CAPTCHA code.

//avoid all confusing characters and numbers (For example: l, 1 and i)

$possible_captcha_letters = 'bcdfghjkmnpqrstvwxyz23456789';

$captcha_font = 'monofont.ttf';

$random_captcha_dots = 50;

$random_captcha_lines = 25;

$captcha_text_color = "0x142864";

$captcha_noise_color = "0x142864";

$count = 0;

while ($count < $total_characters_on_image) { 

$captcha_code .= substr(

 $possible_captcha_letters,

 mt_rand(0, strlen($possible_captcha_letters)-1),

 1);

$count++;

}

$captcha_font_size = $captcha_image_height * 0.65;

$captcha_image = @imagecreate(

 $captcha_image_width,

 $captcha_image_height

 );

/* setting the background, text and noise colours here */

$background_color = imagecolorallocate(

 $captcha_image,

 255,

 255,

 255

 );

$array_text_color = hextorgb($captcha_text_color);

$captcha_text_color = imagecolorallocate(

 $captcha_image,

 $array_text_color['red'],

 $array_text_color['green'],

 $array_text_color['blue']

 );

$array_noise_color = hextorgb($captcha_noise_color);

$image_noise_color = imagecolorallocate(

 $captcha_image,

 $array_noise_color['red'],

 $array_noise_color['green'],

 $array_noise_color['blue']

 );

/* Generate random dots in background of the captcha image */

for( $count=0; $count<$random_captcha_dots; $count++ ) {

imagefilledellipse(

 $captcha_image,

 mt_rand(0,$captcha_image_width),

 mt_rand(0,$captcha_image_height),

 2,

 3,

 $image_noise_color

 );

}

/* Generate random lines in background of the captcha image */

for( $count=0; $count<$random_captcha_lines; $count++ ) {

imageline(

 $captcha_image,

 mt_rand(0,$captcha_image_width),

 mt_rand(0,$captcha_image_height),

 mt_rand(0,$captcha_image_width),

 mt_rand(0,$captcha_image_height),

 $image_noise_color

 );

}

/* Create a text box and add 6 captcha letters code in it */

$text_box = imagettfbbox(

 $captcha_font_size,

 0,

 $captcha_font,

 $captcha_code

 ); 

$x = ($captcha_image_width - $text_box[4])/2;

$y = ($captcha_image_height - $text_box[5])/2;

imagettftext(

 $captcha_image,

 $captcha_font_size,

 0,

 $x,

 $y,

 $captcha_text_color,

 $captcha_font,

 $captcha_code

 );

/* Show captcha image in the html page */

// defining the image type to be shown in browser widow

header('Content-Type: image/jpeg'); 

imagejpeg($captcha_image); //showing the image

imagedestroy($captcha_image); //destroying the image instance

$_SESSION['captcha'] = $captcha_code;

function hextorgb ($hexstring){

  $integar = hexdec($hexstring);

  return array("red" => 0xFF & ($integar >> 0x10),

               "green" => 0xFF & ($integar >> 0x8),

               "blue" => 0xFF & $integar);

    }

?>

In the above code i include a font name monofont $captcha_font = 'monofont.ttf'; you can use any font that you want otherwise you can download this font from here.

Make sure that you keep this font in the same folder where you are keeping index.php and captcha.php files.

Now you can browse index.php file on your local host or online web host if you have. Our captcha form is now ready to use.

Explanation:

I have used comments to explain each step in the above code, however i will also explain their working separately. Captcha.php file is performing the following actions to create a captcha:

Creating a blank image with white background
Creating random dots
Creating random lines
Creating random 6 letters on image

Creating a blank image with white background

Following script is generating a blank image with height 50px and width 130px.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

$captcha_image_height = 50;

$captcha_image_width = 130;

$captcha_image = @imagecreate(

 $captcha_image_width,

 $captcha_image_height

 );

$background_color = imagecolorallocate(

 $captcha_image,

 255,

 255,

 255

 );

header('Content-Type: image/jpeg'); 

imagejpeg($captcha_image);

Creating random dots

Following script is generating random dots in the image background.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

$random_captcha_dots = 50;

$captcha_noise_color = "0x142864";

$array_noise_color = hextorgb($captcha_noise_color);

$image_noise_color = imagecolorallocate(

 $captcha_image,

 $array_noise_color['red'],

 $array_noise_color['green'],

 $array_noise_color['blue']

 );

for( $count=0; $count<$random_captcha_dots; $count++ ) {

imagefilledellipse(

 $captcha_image,

 mt_rand(0,$captcha_image_width),

 mt_rand(0,$captcha_image_height),

 2,

 3,

 $image_noise_color

 );

}

function hextorgb ($hexstring){

  $integar = hexdec($hexstring);

  return array("red" => 0xFF & ($integar >> 0x10),

               "green" => 0xFF & ($integar >> 0x8),

               "blue" => 0xFF & $integar);

    }

Creating random lines

Following script is generating random lines in the image background.

1

2

3

4

5

6

7

8

9

10

11

12

$random_captcha_lines = 25;

for( $count=0; $count<$random_captcha_lines; $count++ ) {

imageline(

 $captcha_image,

 mt_rand(0,$captcha_image_width),

 mt_rand(0,$captcha_image_height),

 mt_rand(0,$captcha_image_width),

 mt_rand(0,$captcha_image_height),

 $image_noise_color

 );

}

Creating random 6 letters on image

Following script is generating random 6 letters and putting them on the captcha image.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

$captcha_code = '';

$total_characters_on_image = 6;

$possible_captcha_letters = 'bcdfghjkmnpqrstvwxyz23456789';

$captcha_font = 'monofont.ttf';

$captcha_text_color = "0x142864";

$count = 0;

while ($count < $total_characters_on_image) { 

$captcha_code .= substr(

 $possible_captcha_letters,

 mt_rand(0, strlen($possible_captcha_letters)-1),

 1);

$count++;

}

$captcha_font_size = $captcha_image_height * 0.65;

$array_text_color = hextorgb($captcha_text_color);

$captcha_text_color = imagecolorallocate(

 $captcha_image,

 $array_text_color['red'],

 $array_text_color['green'],

 $array_text_color['blue']

 );

$text_box = imagettfbbox(

 $captcha_font_size,

 0,

 $captcha_font,

 $captcha_code

 ); 

$x = ($captcha_image_width - $text_box[4])/2;

$y = ($captcha_image_height - $text_box[5])/2;

imagettftext(

 $captcha_image,

 $captcha_font_size,

 0,

 $x,

 $y,

 $captcha_text_color,

 $captcha_font,

 $captcha_code

 );

Always destroy the image instance after creating captcha image, using imagedestroy($captcha_image);

You may also noticed that i started session_start(); in the beginning of the page because i need to store a random generated captcha value in session variable $_SESSION['captcha'] = $captcha_code; to compare with the user input value for validation purpose.

If you found this tutorial helpful, kindly share it with your friends and developer groups.

Expert of PHP

Thursday, July 25, 2019

Create a Simple Captcha Script Using PHP

Steps to create a Captcha Using PHP

1. Create an index.php file

HTML

JavaScript

PHP Script

2. Create a captcha.php file

PHP Script

Explanation:

No comments:

Post a Comment