Create Captcha in php

How to create captcha in PHP using class object?

CAPTCHA stands for Completely Automated Public Turing test to tell Computers and Humans Apart. It is used for prevention of automated script from spammers. Normally it contains some random alphabets and number in image. User has to write same in text box provided.

Introduction

Pre-requisite

It requires PHP GD library, ie. GD library should be enabled in php.ini

Features

Background images
Random string
Case Sensitive
Random lines for security features

Scripts

Following script file helps to create it

Create index.php to show captcha in form

Use following code into it

<?php
session_start();
?>
<!DOCTYPE html>
<html>
<head>
<title>Create Captcha in PHP</title>
<meta charset="utf-8">
<script src="//www.fbchandra.com/include/js/jquery-2.2.4.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="//www.fbchandra.com/include/styles/bootstrap.min.css" />
<script src="//www.fbchandra.com/include/js/bootstrap.min.js" type="text/javascript"></script>
<script src="//www.fbchandra.com/demo/captcha/captcha.js"></script>
<link rel="stylesheet" type="text/css" href="//www.fbchandra.com/demo/captcha/captcha.css" />
</head>
<body>
<?php
$msg='';
if(isset($_POST['btnSubmit'])) {
	if($_POST['txtSWord']==$_SESSION['CAPTCHAVALUE']) {
		$msg="<span class='success'>Validated successfully</span>";
	}
	else {
		$msg="<span class='failure'>Enter correct security word</span>";
	}
}

?>
<div class="container">
	<div class="row captcha_heading">CAPTCHA</div>
	<div class="row">
		<div class="msg"><?php echo $msg ?></div>
	</div>
	<form name="frmCaptcha" method="POST">
		<div class="row">
			<div class="col-sm-3"><b>Security Word:</b></div>
			<div class="col-sm-9" style="height:35px;">
				<img id="imgCaptcha" src="//www.fbchandra.com/demo/captcha/captcha.php" alt="Loading" />
				<a href="javascript:void(0)" onclick="reloadCaptcha()">Reload</a>
			</div>
		</div>
		<div class="row" style="margin-top:10px;">
			<div class="col-sm-3"><b>Enter Security Word:</b></div>
			<div class="col-sm-9">
				<input type="text" name="txtSWord" class="txtSWord">
			</div>
		</div>
		<div class="row btn">
			<input type="submit" name="btnSubmit" value="Submit" onclick="return validate()" />
		</div>
	</form>
</div>
</body>
</html>

Create class.captcha.php to create captcha

Use following content in it

<?php
class createcaptcha
{
	public function captcha()
	{
		$captRandVal=substr(md5(rand()),4,5);
		$width=70;
		$height=35;
		$img=imagecreatetruecolor($width, $height);

		// Image color allocation
		$white=ImageColorAllocate($img, 255,255,255);
		$white=ImageColorAllocate($img, 255,255,255);
		$black=ImageColorAllocate($img, 0,0,0);
		$grey=ImagecolorAllocate($img, 204,204,204);
		imagecolortransparent($img, $black);

		// Fill color
		ImageFill($img, 0, 0, $grey);
		imagearc($img, 100, 100, 200, 200,  0, 360, $white);
		imagestring($img, 20, 10, 10, $captRandVal, $black);

		$_SESSION['CAPTCHAVALUE']=$captRandVal;

		header('Content-type: image/jpeg');
		imagejpeg($img);

		imagedestroy($img);
	}
}	
?>

Create a file captcha.php to call class file

<?php
session_start();
require_once('class.captcha.php');
$objCaptcha=new createcaptcha();
$objCaptcha->captcha();
?>

Create captcha.js for validation and reload call

function reloadCaptcha()
{
	document.getElementById('imgCaptcha').src='';
	document.getElementById('imgCaptcha').src="//www.fbchandra.com/demo/captcha/captcha.php";
}

function validate()
{
	var txtSWord = $('.txtSWord').val();
	if(txtSWord=="") {
		$('.msg').html('Enter security word');
		$('.msg').css('color','red');
		return false;
	}
	return true;
}

Create captcha.css for style

.captcha_heading { padding:20px;background-color:#d4b385; margin:10px 0;}
.btn { margin-top:10px; text-align:center;}
.success { color:green;}
.failure { color:red;}
.msg { margin:17px;}

Live Demo & Download

Live Demo | Download Script

Conclusion

CAPTCHA is used in form where data gets inserted into database. We store Alphabets and numbers shown in CAPTCHA image into session variable and compare it to the text provided by user in textbox.

Like Share Tweet Share

Support : team at fbchandra dot com

PHP