Criando um CAPTCHA

Como todos devem saber, segurança é algo essencial no mundo digital. Existem pessoas que invadem sistemas para mostrar vulnerabilidades deste e alertar seu criador para aumentar a segurança, mas também existem aquelas pessoas que invadem com más intenções. Uma das formas mais utilizadas para descobrir senhas de sistemas é o método tentativa e erro. Só que ser humano nenhum tem paciência e nem tempo para testar mais de um milhão de combinações atrás de uma correta, logo, criam robôs para executarem tais tentativas. Devido a isso, foi elaborado um tipo de sistema chamado CAPTCHA (Completely Automated Public Turing Test To Tell Computers and Humans Apart ou, Teste Público Totalmente Automatizado Para Diferenciar Computadores de Seres Humanos).
Neste tutorial, você irá aprender como usar uma imagem CAPTCHA para um sistema de login mais seguro. O primeiro passo para desenvolver qualquer sistema realmente bom, é entender como ele realmente funciona, ou deveria funcionar. Assim, analisemos o CAPTCHA.
O CAPTCHA é exibido ao usuário em forma de uma imagem com extensão PNG ao lado com um campo de digitação dos caracteres nela exibido. Sendo assim, aprenderemos a criar imagens PNG com PHP.
Para trabalharmos com imagens PNG no Php devemos escolher uma imagem como base para a editarmos. Para tal utilizaremos a função:

$imagemCaptcha = imagecreatefrompng(<caminho_imgem_base>);

A imagem utilizada com plano de fundo de um CAPTCHA deve ser bem abstrata ou conter muitos elementos, uma vez que é possível criar scripts que lêem pixel por pixel de imagens a procura de padrões de seqüência que formam letras. Um bom exemplo de imagem seria:

Além de uma imagem de fundo é necessário escrever algo nela, e para isso devemos definir todos os padrões de fonte da escrita, como cor e tipo de fonte (lembre-se de que o arquivo que contém a fonte deve estar na mesma pasta que o arquivo gerador do CAPTCHA)

$fonteCaptcha = imageloadfont("anonymous.gdf");
// Nos três ultimos parâmetos da função imageclorallocate são passados os valores para RGB respectivamente.
$corCaptcha = imagecolorallocate($imagemCaptcha,0,0,0);

Agora precisamos definir qual texto será usado na string exibida na imagem e armazená-la em uma sessão:

$textoCaptcha = substr(md5(uniqid('')),-9,9);
        $_SESSION["string_seguranca"] = $textoCaptcha;

Agora precisamos agrupar a imagem de fundo ao texto gerado, exibi-la e limpar a memória para evitar problemas futuros da seguinte forma:

  //O 3º e o 4º parametros passados são a posição do texto na imagem
 imagestring($imagemCaptcha,$fonteCaptcha,15,5,$textoCaptcha,$corCaptcha);
 //Exibe a imagem
 imagepng($imagemCaptcha);

 //Limpa a memória
 imagedestroy($imagemCaptcha);

O arquivo inicial deverá ficar da seguinte forma:

<?php
 session_start();

 //Carrega imagem para utilização na criação do captcha
 $imagemCaptcha = imagecreatefrompng("background/bg7.png");

 //Tipo de fonte a ser usada na imagem //Dê preferencia a fontes GD
 $fonteCaptcha = imageloadfont("anonymous.gdf");

 //Gera String unica para captcha
 $textoCaptcha = substr(md5(uniqid('')),-9,9);

 $_SESSION["string_seguranca"] = $textoCaptcha;

 //Define a cor da fonte da imagem
 $corCaptcha = imagecolorallocate($imagemCaptcha,0,0,0);

 //Monta imagem com o novo texto
 imagestring($imagemCaptcha,$fonteCaptcha,15,5,$textoCaptcha,$corCaptcha);

 //Mosta a imagem em formato PNG
 imagepng($imagemCaptcha);

 //Libera a memória
 imagedestroy($imagemCaptcha);
?>

Para usarmos a imagem a chamaremos da seguinte forma em um arquivo HTML.

<img src="captcha.php" />

E ao checar o usuário e senha digitados comparamos o texto digitado pelo usuário com o da sessão.
Para utilizar a função de troca de imagem caso fique ilegível utilize um pouco de JQuery.
Mudaremos um pouco a forma de chamar a imagem. Criaremos um arquivo php com o nome imagem_seguranca.php com o seguinte conteúdo:
<?php

 //Isto servirá para a troca de imagens de fundo do CAPTCHA
 $imagem = rand(0,4)
?>
<img src="captcha.php?iu=<?php echo $imagem; ?>" />

E no arquivo HTML login chamaremos o arquivo imagem_seguranca.php da seguinte forma:

<span id="img_captcha">
 <?php require_once "imagem_seguranca.php"; ?>
</span>

Para trocar as imagens utilizaremos um link com um id “troca_imagem” que servirá para identificá-lo no JQuery.
Não consegue visualizar a imagem? <a href=”#imagem” id=”troca_imagem”>Clique aqui</a>
O seguinte código JQuery servirá para recarregar uma área especifica do site toda vez que o link com id troca_imagem for clicado, assim chamar novamente a cada clique no link a página imagem_segurança.php (Não se esqueça de importar a biblioteca jQuery).

<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript">
 $(function(){
 $('#troca_imagem').click(function(){
 $('#img_captcha').load('imagem_seguranca.php');
 });
 });
</script>

Por fim modificaremos o arquivo captcha.php para que o sistema de troca de imagens de fundo funcione, tendo no final três arquivos para a geração do captcha.

//Array Imagens de Fundo
$imagensCaptcha[0] = "background/bg3.png";
$imagensCaptcha[1] = "background/bg4.png";
$imagensCaptcha[2] = "background/bg5.png";
$imagensCaptcha[3] = "background/bg6.png";
$imagensCaptcha[4] = "background/bg7.png"; 
//Carrega imagem para utilização na criação do captcha
$imagemCaptcha = imagecreatefrompng($imagensCaptcha[$_GET["iu"]]);