Tutorial PHP: Pembuatan Captcha dengan Font & Sudut Tertentu

CAPTCHA atau Captcha adalah suatu bentuk uji tantangan-tanggapan (challange-response test) yang digunakan dalam perkomputeran untuk memastikan bahwa jawaban tidak dihasilkan oleh suatu komputer. Proses ini biasanya melibatkan suatu komputer (server) yang meminta seorang pengguna untuk menyelesaikan suatu uji sederhana yang dapat dihasilkan dan dinilai oleh komputer tersebut. Karena komputer lain tidak dapat memecahkan CAPTCHA, pengguna manapun yang dapat memberikan jawaban yang benar akan dianggap sebagai manusia. Oleh sebab itu, uji ini kadang disebut sebagai uji Turing balik, karena dikelola oleh mesin dan ditujukan untuk manusia, kebalikan dari uji Turing standar yang biasanya dikelola oleh manusia dan ditujukan untuk suatu mesin. CAPTCHA umumnya menggunakan huruf dan angka dari citra terdistorsi yang muncul di layar.

Kali ini kita akan belajar membuat captcha dengan class SimpleCaptcha yang dibuat oleh Ver Pangonilo. Source code dari simplecaptcha ini sbb:
[sourcecode language=”php”]
<?php

class SimpleCaptcha {

function SimpleCaptcha( $params = null )
{
$this->BackgroundImage = $params[‘BackgroundImage’]; //background image
$this->BackgroundColor = $params[‘BackgroundColor’];
$this->Height = $params[‘Height’]; //image height
$this->Width = $params[‘Width’]; //image width
$this->FontSize = $params[‘Font_Size’]; //text font size
$this->Font = $params[‘Font’]; //text font style
$this->TextMinimumAngle = $params[‘TextMinimumAngle’];
$this->TextMaximumAngle = $params[‘TextMaximumAngle’];
$this->TextColor = $params[‘TextColor’];
$this->TextLength = $params[‘TextLength’];
$this->Transparency = $params[‘Transparency’];

$this->generateCode();
//initially, png is used
header("Content-type: image/png");
$this->generateImage($this->Code);

}
//Background Images
function getBackgroundImage()
{
return $this->BackgroundImage;
}

function setBackgroundImage( $background_image = null )
{
$this->BackgroundImage = $background_image;
}

//Backgroung Color
function getBackgroundColor()
{
return $this->BackgroundColor;
}

function setBackgroundColor( $background_color )
{
$this->BackgroundColor = $background_color;

}

//Image Height
function getHeight()
{
return $this->Height;
}

function setHeight( $height = null )
{
$this->Height = $height;
}
//Image Width
function getWidth()
{
return $this->Width;
}

function setWidth( $width = null )
{
$this->Width = $width;
}
//Font size
function getFontSize()
{
return $this->FontSize;
}

function setFontSize( $size = null )
{
$this->FontSize = $size;
}

//Font
function getFont()
{
return $this->Font;
}

function setFont( $font = null )
{
$this->Font = $font;
}

//Text Minimum Angle
function getTextMinimumAngle()
{
return $this->TextMinimumAngle;
}

function setTextMinimumAngle( $minimum_angle = null )
{
$this->TextMinimumAngle = $minimum_angle;
}

//Text Maximum Angle
function getTextMaximumAngle()
{
return $this->TextMaximumAngle;
}

function setTextMaximumAngle( $maximum_angle = null )
{
$this->TextMaximumAngle = $maximum_angle;
}

//Text Color
function getTextColor()
{
return $this->TextColor;
}

function setTextColor( $text_color )
{
$this->TextColor = $text_color;
}

//Text Length
function getTextLength()
{
return $this->TextLength;
}

function setTextLength( $text_length = null )
{
$this->TextLength = $text_length;
}

//Transparency
function getTransparency()
{
return $this->Transparency;
}

function setTransparency( $transparency = null )
{
$this->Transparency = $transparency;
}

//get Captcha Code
function getCode()
{
return $this->Code;
}

//Generate Captcha
function generateCode()
{
$length = $this->getTextLength();
$this->Code = "";
while(strlen($this->Code)<$length){
mt_srand((double)microtime()*1000000);
$random=mt_rand(48,122);
$random=md5($random);
$this->Code .= substr($random, 17, 1);
}

return $this->Code;
}

function generateImage($text = null)
{
$im = imagecreatefrompng( $this->getBackgroundImage() );
$tColor = $this->getTextColor();
$txcolor = $this->colorDecode($tColor);
$bcolor = $this->getBackgroundColor();
$bgcolor = $this->colorDecode($bcolor);
$width = $this->getWidth();
$height = $this->getHeight();
$transprency = $this->getTransparency();
$this->im = imagecreate($width,$height);
$imgColor = imagecolorallocate($this->im, $bgcolor[red], $bgcolor[green], $bgcolor[blue]);
imagecopymerge($this->im,$im,0,0,0,0,$width,$height,$transprency);
$textcolor = imagecolorallocate($this->im, $txcolor[red], $txcolor[green], $txcolor[blue]);
$font = $this->getFont();
$fontsize=$this->getFontSize();
$minAngle = $this->getTextMinimumAngle();
$maxAngle = $this->getTextMaximumAngle();
$length = $this->getTextLength();

for($i=0;$i<$length;$i++){
imagettftext(
$this->im,
$fontsize,
rand(-$minAngle,$maxAngle),
$i*15+10,
$this->FontSize*1.2,
$textcolor,
$font,
substr($text, $i, 1));
}

imagepng($this->im);
imagedestroy($this->im);
}

function colorDecode( $hex ){

if(!isset($hex)) return FALSE;

$decoded[red] = hexdec(substr($hex, 0 ,2));
$decoded[green] = hexdec(substr($hex, 2 ,2));
$decoded[blue] = hexdec(substr($hex, 4 ,2));

return $decoded;

}
}
?>
[/sourcecode]

Untuk menggunakannya, silakan buat satu file php baru (misalnya: img.php) dan isi dengan source sbb:
[sourcecode language=”php”]
<?php
session_start();
require_once(‘class.simplecaptcha.php’);
/*
*****CONFIGURATION STARTS*****
*/
//Background Image
$config[‘BackgroundImage’] = "white.png";

//Background Color- HEX
$config[‘BackgroundColor’] = "F5F5F5";

//image height – same as background image
$config[‘Height’]=30;

//image width – same as background image
$config[‘Width’]=100;

//text font size
$config[‘Font_Size’]=23;

//text font style
$config[‘Font’]="arial.ttf";

//text angle to the left
$config[‘TextMinimumAngle’]=5;

//text angle to the right
$config[‘TextMaximumAngle’]=15;

//Text Color – HEX
$config[‘TextColor’]=’000000′;

//Number of Captcha Code Character
$config[‘TextLength’]=6;

//Background Image Transparency
$config[‘Transparency’]=50;

/*
*******CONFIGURATION ENDS******
*/

//Create a new instance of the captcha
$captcha = new SimpleCaptcha($config);

//Save the code as a session dependent string
$_SESSION[‘string’] = $captcha->Code;

?>
[/sourcecode]

Untuk menggunakan captcha ini, silakan load sebagai image:
[sourcecode language=”html”]
<img src="http://localhost/latihan/img.php" />
[/sourcecode]

atau contoh lengkapnya dalam satu form:
[sourcecode language=”php”]
<?php
session start();
<html>
<head>
<title>Simple CAPTCHA Class Application</title>
</head>
<body>
<?php
if (!$_POST[‘code’])
{
?>
<form id="demo" action="<?php echo $_SERVER[‘PHP_SELF’]; ?>?goto=login" method="POST">

Message:
<br/>
<textarea name="message" cols="25" rows="5" id="message" ></textarea>
<br/>
Validation Code:
<br/>
<img src="./captcha.php" alt="CAPTCHA">
<br>
<input type="text" name="code" size="30">
<br>
<input type="submit" value="Go">
</form>
<?php
}else{

//Check if userinput and CAPTCHA Code are equal
if ($_SESSION[‘string’] == $_POST[‘code’])
{
echo ‘<script>alert("Correct Code.");history.go(-1);</script>’;
}
else
{
echo ‘<script>alert("Incorrect Code.");history.go(-1);</script>’;
}
}
?>
</body>

</html>
[/sourcecode]

Menggunakan Custom Font

Dengan class ini, secara default font yang digunakan untuk dirender pada image captcha adalah font Arial. Kita bisa mengganti jenis font tersebut dengan mengganti pada parameter $config[‘font’] dengan (misalnya) calibri.ttf. Untuk mendapatkan file font tersebut, silakan browse ke C:\windows\fonts\ atau download dari internet.

Mengubah sudut tulis (angle) dari Font Captcha

Untuk mengubah sudut tulis dari huruf/angka captcha, silakan ubah variabel $config[‘TextMinimumAngle’] atau $config[‘TextMaximumAngle’].