É fato que muitos dos formulários, como de contato, cadastro, entre outros, são diariamente alvos de bots (robôs) pré-programados para espalharem SPAM pela internet. Uma vez que seu site esteja indexado nos buscadores, seu site se torna alvo fácil deste tipo de ataque, não se apavore, isso é algo corriqueiro de acontecer, com todo mundo.

Infelizmente, hoje, a solução adotada por grande maioria (e até por mim, até conhecer essa) era de incluir um captcha, mas os bots já conseguem interpretar as letras e números oriundos da imagem através de um processo de OCR, logo, dificultamos, colocando somas e divisões simples, o que resolveu o problema, mas acabou com a usabilidade.

Esta solução, encontrei no blog DA2K, já apliquei em um site pessoal, e realmente funcionou, pretendo começar a utilizar mais seguidamente dela, vou tornar a publicação um pouco mais didática do que a original e mostrar como a solução funciona como um todo.

Resumo

Na verdade, é muito simples: Trata-se de criar um campo no formulário em questão que seja invisível visualmente (NOTA: Você precisa utilizar um “alpha” ou “opacity” para isto, um campo do tipo “hidden” não irá funcionar), como esses bots trabalham processando somente o HTML e não o formulário visual, sempre preencherá este campo. No caso de uma pessoa, como o campo é invisível, essa pessoa não o preencherá. O outro lado da solução, se dá no backend (no processador da linguagem, seja PHP, ASP, ou o que for), basta que façamos a validação se este campo invisível foi preenchido ou não.

Origem

Segundo o autor da publicação original, ele percebeu esta solução na ferramenta MailChimp, e não é por menos, o pessoal de lá tem colaborado exponencialmente com a comunidade de desenvolvedores.

Explicando melhor

Como mencionei anteriormente, basta criarmos no nosso formulário um campo “fantasma” que não receberá nenhum valor (passará pela validação), quando um bot interpretar o HTML do formulário, tentará preencher todos os campos, inclusive este, desta forma, não passará pela nossa validação.

HTML:

<form method="post" ...>
...
<input type="text" id="txtInvisibleValidation" name="txtInvisibleValidation" style="display:block;width:1px;height:1px;border:0;padding:0px;background:transparent;" onfocus="document.getElementById('#txtName').focus();" />
...
</form>

A validação se dará no back-end por maior segurança (isso não quer dizer que você não possa tentar fazer no front), segue um exemplo escrito em PHP:

<?php

$nome = $_POST['txtName'];
$mail = $_POST['txtMail'];
$mensage = $_POST['txtMensage'];
$validation = $_POST['txtInvisibleValidation'];

if ($validation != '') { die('Error on validate form: you are human?!'); }

...

?>

Gostou?

Deixe seu comentário abaixo e me motive a escrever mais artigos. Se gostou muito, compartilhe.