É 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.