Um dos grandes problemas que enfrentamos em nossos sites é a utilização dos formulários por partes de “bots”, com o intuito de propagar “spams” e que acaba acarretando em uma super utilização de recursos do nosso servidor, como CPU e memória.
Basicamente, esse procedimento é o resultado de algoritmos que identificam os formulários de nossos sites (de contato por exemplo) e começam a submeter informações neles de forma demasiada e automática. Com isso, a produção de “spam” acaba se tornando um problema para nossos serviços de email ou mesmo para o banco de dados da nossa aplicação.
Uma forma de proteger nosso site (nossos formulários) desses robôs é implementando uma verificação do tipo “captcha”, na qual é adicionada um campo que consegue verificar se o utilizador é realmente um ser humano.
Pois bem. Nesse post vou mostrar para vocês como utilizar o “reCAPTCHA” do Google (https://google.com/recaptcha/admin) dentro do seu site, e evitar assim o acúmulo de “spam”.
O primeiro passo é se autenticar com sua conta do Google e acessar o endereço: https://google.com/recaptcha/admin
Nessa página vamos adicionar um novo site. No campo “Etiqueta” você define o nome que quiser, para se lembrar melhor caso tenha vários “recaptchas” para vários sites distintos. Eu coloquei o próprio domínio.
Em “Tipo de reCAPTCHA” você tem diversas opções. No meu caso, eu selecionei a opção “reCAPTCHA v2” e depois a sub-opção “Caixa de seleção ‘Não sou um robô’ “.
No campo “Domínios” eu insiro o domínio do site que utilizará o “reCAPTCHA”.
Em “Proprietários” aparecerá o seu email e caso você queira pode adicionar outros endereços de quem poderá acompanhar e gerenciar esse reCAPTCHA.
Feito isso, “aceite os termos de serviço do reCAPTCHA” e depois clique em “Enviar“.
Na próxima página, serão geradas 2 chaves.
É importante que você copie essas 2 chaves que foram geradas (a chave de site e a chave secreta). Utilizaremos a primeira para criar o campo “Eu não sou um robô” no nosso formulário e a segunda utilizaremos para validar a verificação sempre que o nosso formulário for submetido.
Em nosso site agora, a primeira coisa que temos que fazer é adicionar o arquivo “javascript” que vai nos auxiliar a inserir e validar o captcha. Antes de fechar a tag “head” da página que contém o formulário coloque o seguinte código:
<script src='https://www.google.com/recaptcha/api.js'></script> |
Agora vamos até o formulário que desejamos inserir o reCAPTCHA.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <html> <head> <title>reCAPTCHA</title> <script src='https://www.google.com/recaptcha/api.js'></script> </head> <body> <form method="post" action="verify.php"> <label>Nome:</label><input type="text" name="nome" /><br /> <label>Email:</label><input type="email" name="email" /><br /> <div class="g-recaptcha" data-sitekey="COLE-SUA-CHAVE-DE-SITE-AQUI"></div> <button type="submit">Enviar</button> </form> </body> </html> |
Veja que na linha 10 eu coloquei a div “g-recaptcha” e no atributo “data-sitekey” deveremos inserir justamente a chave de site que copiamos lá do painel de reCAPTCHA do Google. (OBS: A “action” desse formulário submete as informações para a página/arquivo verify.php e portanto será nesse arquivo que vou verificar se o reCAPTCHA foi interagido corretamente).
Executando a página, podemos ver que o reCAPTCHA é apresentado:
Agora no arquivo verify.php vamos verificar se tudo ocorreu de forma correta com o reCAPTCHA. Para fazer isso vamos recuperar a informação “g-recaptcha-response“, que foi submetido via POST junto com os outros dados do formulário.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | <?php $captcha = isset($_POST['g-recaptcha-response']) ? $_POST['g-recaptcha-response'] : null; if(!is_null($captcha)){ $res = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=COLE-SUA-CHAVE-SECRETA-AQUI&response=".$captcha."&remoteip=".$_SERVER['REMOTE_ADDR'])); if($res->success === true){ //CAPTCHA validado!!! echo 'Tudo certo =)'; } else{ echo 'Erro ao validar o captcha!!!'; } } else{ echo 'Captcha não preenchido!'; } |
Na linha 6 fazemos uma requisição para verificar se o captcha é válido. Veja que devemos passar a nossa chave secreta na URL para que o processo dê certo. Essa requisição retornará um json com a informação success. Caso ela esteja valendo true significa que o captcha foi validado.
E pronto! Dessa forma o seu formulário estará mais protegido!
No painel do Google você consegue visualizar um relatório contendo as requisições/verificações, solicitações suspeitas e etc.
Espero que esse conteúdo lhe seja útil.
Abs!
Rafael Wendel Pinheiro
É formado em Sistemas de Informação, pós-graduado em Sistemas de Banco de Dados e mestre em Educação com foco em Tecnologias Sociocomunitárias. Trabalha como professor de ensino técnico e tecnológico no Instituto Federal de Educação, Ciência e Tecnologia de São Paulo ministrando disciplinas nas áreas de programação, banco de dados, desenvolvimento de projetos e engenharia de software.
Estava precisando exatamente desse conteúdo.
Agora posso te fazer uma pergunta? A partir do momento que eu crio o recaptcha, eu posso colocar o mesmo somente no site principal ou eu posso utilizar esse mesmo em sub sites ou subdomínios?
Olá Wanessa,
Pode usar sim nas páginas internas e subdomínios.
Abs!
Porque fica esta coisa Nāo sou robo
Muito obrigado Brother, excelente conteúdo
De todos que eu pesquisei para colocar recaptcha em qualquer site de uma maneira simples (mais simples e eficiente até do que a explicação do próprio Google), este teu é o melhor!
Excelente, inclusive a verificação depois no PHP, simples e eficiente como deve ser.