[Dizainoff]

На мой взгляд, проверку на соответствие введенного кода с кодом отображенного на рисунке, необходимо производить на стороне сервера. Следовательно и сервер должен генерировать такое изображение.

Пример генерации изображения с защитным кодом с поддержкой ttf шрифта. [PHP - На скорую руку]

<?php
//session_start();
header ("Content-type: image/jpeg");
function captcha_generator_print_string(&$image, $width, $height, $font, $font_size, $text,$clr_start,$clr_end) {
	$bbox 		= imagettfbbox($font_size, 0, $font, $text);
	$textwidth 	= $bbox[2] - $bbox[0];
  
  	$captcha_len	= strlen($text);
	$spacing = ($width - $textwidth) / ($captcha_len);
	
	$jittering_x = 0.3 * $font_size;
	$jittering_y = 0.3 * $font_size;	
	
	$x = $spacing/2;		
	for($i=0;$i<$captcha_len;$i++){
		$character = $text[$i];
		$bbox = imagettfbbox($font_size, 0, realpath($font), $character);
		$character_width 	= $bbox[2] - $bbox[0];
		$character_height 	= $bbox[5] - $bbox[3];
		
		$y = 0.5 * ($height - $character_height);
    
		$pos_x = $x + mt_rand(-$jittering_x, $jittering_x);
    		$pos_y = $y + mt_rand(-$jittering_y, $jittering_y);	
		
		$r = mt_rand($clr_start,$clr_end);
		$g = mt_rand($clr_start,$clr_end);
		$b = mt_rand($clr_start,$clr_end);	
		
		$color = imagecolorallocate($image,$r,$g,$b);
 		
		imagettftext($image, $font_size, 0, $pos_x, $pos_y, $color, $font, $character);	
		$x += $character_width + $spacing;
	}	
}

$seccode_array 		= array("S","A","P","W","E","R","T","Y","U","I","O");
$seccode 		= "";
$s_count 		= 5;
$captcha_string 	= "";	
$font_size 		= 30;
$character_spacing	= 1.2;
$font 			= realpath("./fonts/frizzed.ttf");

$background_color	= 0xFFFFFF;

$clr_rnd_start		= 64;
$clr_rnd_end		= 255;

$noise_quantity_k	= 2.0; 
$line_quantity_k	= 2.0; 

$sh_clr_start		= 200;
$sh_clr_end		= 200;

$s_clr_start		= 0;
$s_clr_end		= 128;

	
for($i=0;$i<$s_count;$i++){
	$ind = mt_rand(0,count($seccode_array)-1);
	$captcha_string .=	$seccode_array[$ind];	
}

//$_SESSION['captcha']['seccode'] = $captcha_string;

$captcha_len		= strlen($captcha_string);
$width 			= $character_spacing * $font_size * $captcha_len+100;
$height 		= 2 * $font_size;

$image = imagecreatetruecolor($width, $height);	 
imagefilledrectangle($image, 0, 0, $width, $height, $background_color);

captcha_generator_print_string($image,$width, $height,$font,$font_size,$captcha_string,$sh_clr_start,$sh_clr_end);
captcha_generator_print_string($image,$width, $height,$font,$font_size,$captcha_string,$s_clr_start, $s_clr_end );

	
// Добавляем шум
$noise_colors = array();
for ($i = 0; $i < 20; $i++) {
	$color_r = mt_rand($clr_rnd_start, $clr_rnd_end);
	$color_g = mt_rand($clr_rnd_start, $clr_rnd_end);
	$color_b = mt_rand($clr_rnd_start, $clr_rnd_end);
    $noise_colors[] = imagecolorallocate($image, $color_r, $color_g, $color_b);
}

$noise_quantity = ($width * $height)/ $noise_quantity_k * 0.3;
for ($i = 0; $i < $noise_quantity; $i++ ) {
	imagesetpixel($image, mt_rand(0, $width), mt_rand(0, $height), $noise_colors[array_rand($noise_colors)]);
}

$line_quantity = $width * $height/($line_quantity_k * 100) * 0.3;
for ($i = 0; $i <  $line_quantity; $i++) {
	imageline($image, mt_rand(0, $width), mt_rand(0, $height), mt_rand(0, $width), mt_rand(0, $height), $noise_colors[array_rand($noise_colors)]);
}

if($image){ 
	imagepng($image);
}
?>