Diga Adeus ao Spam! Um Guia Completo para reCAPTCHA

Em 2013, a Target agora infamemente comprometeu os dados de dezenas de milhões de compradores em um evento que reduziu as vendas, provocou processos judiciais e até causou a renúncia do CEO.

O que aconteceu?

Hackers obtiveram acesso à Target através de um fornecedor terceirizado que não possuía CAPTCHA ou qualquer tipo de autenticação para garantir que havia um humano — e não um Bot malicioso — entrando no sistema deles.

Daí, não demorou muito para que o Bot infiltrasse a organização deste fornecedor terceirizado e avançasse para a rede de pagamento do grande varejista.

Qual é a lição aqui?

Se atores mal-intencionados procuram uma forma de invadir seu site, um CAPTCHA pode ser uma poderosa primeira linha de defesa, e até mesmo convencê-los a procurar um alvo mais fácil target (o trocadilho é *altamente* intencional).

Intrigado com este conceito de CAPTCHA?

Então continue lendo para aprender:

• A diferença entre CAPTCHA e reCAPTCHA (e o que significam todas essas letras!)
• Os principais tipos de CAPTCHAs em uso hoje
• Como os CAPTCHAs podem ajudar os proprietários de sites a evitar Spam e abuso
• Alguns pontos negativos a considerar com os CAPTCHAs
• Duas maneiras de adicionar um Google reCAPTCHA ao seu site WordPress

O que é reCAPTCHA?

Preparem-se, pessoal, porque esta tem várias camadas.

Vamos começar com uma definição básica: “reCAPTCHA é um serviço do Google que ajuda a proteger sites de Spam e abusos.”

reCAPTCHA da Google é uma versão popular e marcada de CAPTCHA. A ideia original do CAPTCHA foi concebida na Universidade Carnegie Mellon por volta de 2000. O reCAPTCHA também foi criado por desenvolvedores da mesma universidade, sendo comprado pela Google por volta de 2009.

Agora para a próxima camada: O que todas as letras em “CAPTCHA” realmente significam?

A sigla CAPTCHA é uma abreviação para “teste de Turing público totalmente automatizado para diferenciar computadores e humanos.”

E essa explicação nos leva a desvendar mais uma camada lógica: O que é um Teste de Turing?

Se você é como nós, sua principal exposição ao Teste de Turing vem do filme de 2014 The Imitation Game, apresentando o matemático e cientista da computação Alan Turing.

Alan Turing desenvolveu o Teste de Turing (que ele originalmente chamou de jogo da imitação — modesto) para responder à pergunta, “As máquinas podem pensar?”

Hoje, os Testes de Turing são usados principalmente para distinguir humanos de bots ao testar a capacidade de um bot de exibir o mesmo comportamento inteligente que um humano exibiria. Bots, neste caso, referem-se a programas de software automatizados, frequentemente impulsionados por inteligência artificial (IA).

Os CAPTCHAs ajudam a prevenir Spam e abuso em sites, bloqueando bots com desafios que são relativamente fáceis para nós humanos resolvermos e realizarmos, mas que frequentemente expõem os bots como os programas que são.

Agora que você sabe o suficiente para definitivamente escrever um romance sobre o contexto do CAPTCHA, vamos falar sobre todas as diferentes maneiras que vemos esse conceito aparecer no dia a dia.

Diferentes Tipos de CAPTCHAs

Os CAPTCHAs evoluíram em várias direções ao longo dos anos na tentativa de fazer a distinção entre humanos e bots. Hoje, existem vários tipos comuns de CAPTCHAs que requerem diferentes formas de raciocínio e entrada.

CAPTCHAs Baseados em Texto

Os CAPTCHAs baseados em texto mostram caracteres em arranjos estranhos, utilizando fontes incomuns e em fundos coloridos.

Esses CAPTCHAs exigem raciocínio e tradução para determinar o que cada letra e número deve ser — uma tarefa inteligente que muitos bots pré-programados não conseguem executar.

CAPTCHAs Baseados em Imagem

Com um CAPTCHA baseado em imagens, o usuário do site deve identificar quais fotos exibidas correspondem ao prompt fornecido. Ao usar fotos de aparência semelhante que exigem um nível de lógica para distinguir, essa opção também pode enganar bots.

Os testes de reCAPTCHA do Google utilizam este método com frequência — o que faz sentido considerando sua vasta fonte de fotos do Google Street View.

CAPTCHAs Baseados em Áudio

Com CAPTCHAs baseados em áudio, o som é o meio. Este método é frequentemente combinado com outros, como CAPTCHAs de texto e visuais.

Os CAPTCHAs de áudio não são apenas mais acessíveis para pessoas com deficiência visual – eles também são um poderoso bloqueador de Bot, pois dependem da dificuldade em distinguir palavras reais de ruídos de fundo.

CAPTCHAs Baseados em Caixa de Seleção

Embora esses CAPTCHAs possam parecer simples à primeira vista, eles estão na verdade avaliando como os usuários do site interagem com a caixa de seleção.

Bots preenchem formulários e completam caixas de seleção instantaneamente, enquanto humanos navegam por esse processo mais lentamente.

Este método pode ser combinado com outros CAPTCHAs se você deseja ainda mais garantia de que um usuário não é secretamente um programa de software inteligentemente disfarçado como um humano usando moletom e bebendo Starbucks.

CAPTCHAs Baseados em Comportamento

A questão é que o software ficou tão inteligente que muitos dos CAPTCHAs mencionados acima podem ser contornados atualmente.

É por isso que a versão mais recente do reCAPTCHA — o reCAPTCHA v3 do Google — mudou o jogo com um método CAPTCHA que funciona em segundo plano.

reCAPTCHA v3 é um reCAPTCHA praticamente invisível, que utiliza uma API JavaScript e um motor de análise de risco adaptativo, alimentado por aprendizado de máquina, para pontuar usuários com base em seu comportamento à medida que interagem com suas páginas web.

Nos bastidores, o reCAPTCHA v3 atribui a cada usuário uma pontuação que tenta determinar se eles são humanos ou Bot. Claro, em alguns casos, esse monitoramento pode não ser suficiente para deter os Bots realmente inteligentes.

Além disso, em uma época em que o pêndulo está voltando para a privacidade na internet, esse método pode ser controverso, pois monitora sua atividade no site, sendo que o único aviso muitas vezes é o pequeno distintivo do reCAPTCHA.

O que discutimos aqui são apenas os CAPTCHAs mais comuns. Outros tipos de programas fazem coisas como pedir ao usuário do site para arrastar objetos para um ponto específico na tela, jogar um “microgame”, e assim por diante. Confira mais exemplos de CAPTCHA aqui.

Casos de Uso: Onde Aplicar CAPTCHAs para Prevenir Spam

O software automatizado com inteligência artificial possui muitas aplicações extraordinárias, como ajudar empresas a completar tarefas mundanas e repetitivas para economizar tempo dos trabalhadores.

No entanto, atores hostis certamente encontraram maneiras de usar essa tecnologia para atacar sites.

Aqui estão alguns dos melhores casos de uso, onde aplicar CAPTCHAs pode proteger seu site de spam e abusos.

Enquetes e Questionários

Empresas utilizam enquetes e questionários por diversos motivos.

Externamente, eles podem ajudar você a reunir feedback e novas ideias para produtos, serviços, marketing, marca, conteúdo e tudo mais voltado para o usuário.

Internamente, pesquisas e questionários podem ajudar a garantir a felicidade dos funcionários e coletar insights sobre novas políticas e ofertas.

Você não gostaria de distorcer esses resultados com um número esmagador de respostas automáticas e falsas, não é mesmo?

Bem, os bots certamente podem.

Logins de Usuário

Os Bots são frequentemente implantados para ajudar hackers a acessar sites através de contas existentes que os usuários já configuraram.

Normalmente, eles fazem isso por meio de ataques de força bruta que utilizam software para adivinhar automaticamente centenas de senhas em segundos.

Por que eles desejariam acessar essas contas? Às vezes é para que possam roubar informações das contas e usá-las para invadir outras propriedades online. Hacking geralmente ocorre em eventos sequenciais.

Outras vezes, é para que possam usar a conta para postar material promocional ou outras informações que sabem que serão rapidamente bloqueadas.

Seções de Comentários

Você provavelmente já viu muito spam aparecendo em seções de comentários em sites e redes sociais.

Os Bots são usados para deixar comentários em massa para espalhar publicidade, um ponto de vista particular (como um político em época de eleições), ou links para fontes nefastas onde hackers estão à espera para roubar informações dos visitantes.

Formulários

Assim como as seções de comentários, formulários que não estão protegidos usando CAPTCHAs podem ser sobrecarregados com submissões falsas de bots programados para tentar vender algo, espalhar uma narrativa específica, ou até mesmo phish para obter dados sensíveis.

Finalizações de Compra

Existem várias razões pelas quais hackers desejariam direcionar seus bots para a página de finalização de compra de um site.

O primeiro é óbvio: comprar ingressos ou outros inventários em uma velocidade que os humanos não conseguem acompanhar. E então, provavelmente, revendê-los em outro lugar por preços mais altos. (Não estamos nada amargos por ter perdido os ingressos da Taylor Swift de jeito nenhum…)

Secundariamente, os bots podem usar fluxos de checkout desprotegidos para realizar algo chamado teste de cartão. Isso ocorre quando eles executam scripts automatizados em seu sistema de checkout para testar se os números de cartões de crédito roubados são utilizáveis ou não.

Ao exigir que CAPTCHAs sejam resolvidos antes que as ações acima sejam concluídas — seu site deverá ser capaz de identificar e interromper a maioria dos abusos automatizados realizados por bots.

Desvantagens Potenciais do Uso de CAPTCHAs

Embora os CAPTCHAs tenham claramente seus benefícios, existem algumas desvantagens a considerar quando você está configurando esse sistema em seu site:

• CAPTCHAs podem tornar seu site menos acessível para pessoas com deficiência auditiva e/ou visual, ou para aqueles que não conhecem o idioma usado no seu CAPTCHA.
• CAPTCHAs podem interromper a experiência do usuário, e se forem muito difíceis, podem impedir a interação até mesmo de usuários humanos.
• CAPTCHAs não são completamente infalíveis, portanto, os proprietários de sites não devem se iludir com uma falsa sensação de segurança — ainda precisamos permanecer vigilantes quanto a sinais de Spam e ataques.

Além disso, existem alguns elementos do reCAPTCHA do Google em particular que os proprietários de sites devem conhecer:

• reCAPTCHA v3 pode parecer invasivo para os usuários porque monitora o comportamento em todo o site para funcionar, o que pode levar indivíduos preocupados com a privacidade a evitar o uso do seu site.
• O modelo de negócios do Google é usar ou vender dados para publicidade, o que pode afastar proprietários de sites (e usuários) que não querem que seu comportamento ou dados sejam monetizados.
• reCAPTCHA se aproveita do trabalho do usuário ao coletar dados das interações dos usuários para treinar os sistemas de identificação visual do Google, com o que algumas pessoas podem se sentir desconfortáveis.
• Às vezes, o Google é bloqueado em países como a China, então instalar tecnologia do Google pode limitar severamente o alcance global de um site.

Como Adicionar reCAPTCHA ao WordPress via Plugin (6 Passos)

Prefácio: CAPTCHAs de todos os tipos podem ser adicionados a websites de todos os tipos.

Entretanto, como o WordPress é uma das plataformas de sites mais populares e o reCAPTCHA do Google é poderoso, gratuito (até um milhão de avaliações) e muito popular — integrar esses dois é o que vamos focar hoje.

Agora, vamos proteger seu site.

Etapa 1: Registre Seu Site

Primeiro de tudo, registre seu site WordPress no painel administrativo do reCAPTCHA do Google. Para completar esta etapa, você deve entrar ou criar uma conta Google.

Durante o registro, você preencherá informações como o que deseja chamar o seu site, qual tipo de verificação reCAPTCHA deseja usar, etc.

Etapa 2: Pegue suas Chaves

Com o registro enviado, o Google fornecerá uma chave do site e uma chave secreta. É assim que você fará seu Google reCAPTCHA se comunicar com seu site WordPress.

Copie-os, porque vamos utilizá-los em breve.

Passo 3: Instalar Plugin do WordPress

Agora, faça login no WordPress.

Se você ainda não tem um plugin de reCAPTCHA instalado, vá para Painel > Plugins > Adicionar Novo e procure por “reCAPTCHA.” reCaptcha by BestWebSoft, CAPTCHA 4WP, e Contact Form 7 são todas opções populares.

Uma vez instalados, a maioria desses plugins orientará você na conexão do seu site ao seu Google reCAPTCHA. Continuaremos o restante deste tutorial usando o Contact Form 7 como exemplo de como isso pode ser acessível.

Etapa 4: Ative o reCAPTCHA

Com o Contact Form 7 instalado, vá até Contact > Integration no WordPress. Localize a caixa de integração do reCAPTCHA e inicie o processo de configuração.

Você será solicitado a colar as chaves de site e secretas que acabou de obter do Google. Uma vez que elas sejam adicionadas e as alterações salvas, o reCAPTCHA estará funcionando em seu site.

Para um guia de configuração do Contact Form 7, consulte nosso artigo no Centro de Ajuda sobre Solução de problemas de formulários de contato do WordPress.

Etapa 5: Adicionar reCAPTCHA a um Formulário

Agora que a funcionalidade reCAPTCHA está ativada, você precisará adicioná-la a qualquer formulário que deseje proteger contra submissões de Bot.

Para fazer isso, vá até Contact > Painel no WordPress e adicione um novo formulário.

Aqui, você vai editar levemente o código do template de formulário para injetar um reCAPTCHA.

Adicione “[recaptcha]” logo antes da linha “[submit “Submit”]”. Depois de salvar, você deverá ver um shortcode aparecer abaixo do título do formulário.

Passo 6: Publique Seu Formulário reCAPTCHA em Seu Site

Copie esse shortcode que você acabou de criar.

Agora, vá em frente e cole esse código em posts, páginas ou widgets de texto para instalar um novo formulário completo com reCAPTCHA!

Como Adicionar reCAPTCHA ao WordPress Manualmente (4 Passos)

Como alternativa ao caminho do plugin, você pode adicionar um reCAPTCHA manualmente a qualquer formulário em seu site.

Isso exigirá um pouco de ajuste no código. Se você é sensível a coisas como tags head e trechos de JavaScript, então pode se sentir mais confortável aderindo a uma opção pronta para uso.

Mas se você está pronto para arregaçar as mangas, configurar as coisas é bastante fácil em uma escala de super fácil (lançar um novo site com DreamHost) até super difícil (resolver o problema dos três corpos).

Vamos começar.

Etapa 1: Registre Seu Site e Pegue Suas Chaves

Assim como com a rota do plugin, você precisará começar se inscrevendo no reCAPTCHA pelo site do Google.

Você pode fazer isso em dois passos rápidos:

1. Registre seu site WordPress no painel administrativo do reCAPTCHA do Google e selecione o tipo de reCAPTCHA.
2. Copie tanto sua chave do site quanto a chave secreta para uso futuro.

Agora, vamos voltar ao site em questão. Existem três partes principais que fazem o reCAPTCHA funcionar:

• A biblioteca JavaScript (reCAPTCHA API)
• O elemento do formulário HTML
• O código de verificação de resposta

Vamos começar com a biblioteca JavaScript reCAPTCHA.

Etapa 2: Adicione a Biblioteca JavaScript do reCAPTCHA

Para começar, precisamos adicionar a biblioteca JavaScript ao seu site. Este é um pequeno trecho de código que precisa ser adicionado em cada página que utilizará o reCAPTCHA:

“<script src="https://www.google.com/recaptcha/api.js" async defer></script>”

A maneira mais fácil de garantir que isso esteja acessível em todas as páginas necessárias é adicionar ao seu cabeçalho universal antes da tag de fechamento “</head>”.

Você pode fazer isso de duas maneiras:

1. Manualmente, acessando o header.php diretamente no admin do WordPress, ou o gerenciador de arquivos dentro do seu painel de hospedagem
2. Usando um plugin para adicionar o código ao seu cabeçalho

Adicionando o Código Manualmente

Se você escolher a primeira opção, precisará usar o editor de arquivos de tema dentro do WordPress ou seu gerenciador de arquivos para acessar o header.php diretamente.

Nota Importante: Editar os arquivos do seu tema diretamente pode quebrar seu site, e suas alterações podem ser sobrescritas sempre que você atualizar o tema. Se você não tem experiência com a edição direta dos arquivos do tema, avance para “Usando um Plugin para Adicionar o Código” para uma solução menos arriscada.

Seu gerenciador de arquivos terá uma aparência diferente dependendo do seu provedor de hospedagem, mas se você estiver usando DreamHost, navegue até WordPress > Hospedagem Gerenciada do WordPress na barra lateral. Encontre o domínio ao qual você deseja adicionar um reCAPTCHA e selecione Gerenciar.

Em seguida, clique no botão Gerenciar Arquivos na seção Detalhes.

Abra a pasta que tem o nome do seu domínio. A partir daí, navegue até wp-content > themes e encontre a pasta do seu tema atual do WordPress.

Encontre o arquivo chamado header.php, abra-o e encontre a tag de fechamento <code>“&lt;/head&gt;”</code> dentro do código.

Copie e cole o trecho de JavaScript do reCAPTCHA logo antes dessa linha.

Usando um Plugin para Adicionar o Código

Se o que foi mencionado acima parece demais, não se preocupe. Nós cuidaremos de tudo para você.

Em vez disso, você pode instalar um plugin do WordPress que adicionará automaticamente código diretamente ao seu cabeçalho, sem necessidade de hacking.

Usando um plugin como WPCode, você pode facilmente adicionar trechos de código relevantes em partes chave do seu tema do WordPress.

Do painel de administração do seu WordPress, vá em Plugins > Adicionar Novo e busque por WPCode.

Clique Instalar, depois Ativar.

Uma vez ativado o WPCode, você deve ver uma nova seção no menu do lado esquerdo chamada Code Snippets.

Vá até Code Snippets > Header & Footer.

Dentro da página de Cabeçalho & Rodapé, cole o código JavaScript na seção Cabeçalho e salve suas alterações.

Boom — código adicionado!

Etapa 3: Adicione reCAPTCHA ao Seu Formulário

Agora, vamos ajustar o código no formulário real onde você deseja ver seu reCAPTCHA.

Novamente, você pode usar um gerenciador de arquivos, o editor do WordPress ou até mesmo FTP.  Ele deve estar dentro da pasta wp-content , que contém todos os seus plugins, temas e mídia.

No código do formulário, cole o seguinte código antes da linha de envio para adicionar o reCAPTCHA:

“<div class="g-recaptcha" data-sitekey="your_site_key"></div>”

Aqui está um exemplo de como pode parecer:

Substitua “your_site_key” pelo site key que você recebeu do Google.

Passo 4: Lidar com a Resposta

Talvez a parte mais complicada do processo seja adicionar código para lidar com a resposta do reCAPTCHA. Isso basicamente indica ao seu site se deve processar o formulário ou bloqueá-lo.

Para configurar isso, você precisará adicionar outro trecho de código ao formulário (a função de callback):

$secretKey = "your_secret_key";
$response = $_POST['g-recaptcha-response'];
$remoteIp = $_SERVER['REMOTE_ADDR'];

$url = "https://www.google.com/recaptcha/api/siteverify?secret=".$secretKey."&response=".$response."&remoteip=".$remoteIp;
$response = file_get_contents($url);
$responseKeys = json_decode($response,true);

if(intval($responseKeys["success"]) !== 1) {
    // Tratar falha na validação do reCAPTCHA
} else {
    // Processar a submissão do formulário
}”

Neste código, você precisa substituir “your_secret_key” pela chave secreta fornecida pelo Google.

Este é apenas um exemplo de uma implementação que permitiria personalizar como o envio é tratado. Existem muitos outros métodos para lidar com a validação do lado do servidor e funções de retorno de chamada.

Para mais informações sobre como lidar com essa parte do processo, consulte a documentação oficial do Google.

Adeus Spam, Olá Segurança

Enquanto devemos reiterar que o reCAPTCHA e CAPTCHAs não são a solução definitiva quando se trata de segurança de sites, eles são um passo crucial para ajudá-lo a se defender de bots automatizados e hackers mal-intencionados.

Para mais dicas sobre proteger seu site WordPress e além, fique atento ao DreamHost blog. Estamos sempre publicando recursos para ajudá-lo a manter seu site seguro, rápido e online, para impressionar tanto os visitantes quanto os motores de busca.

Você Sonha, Nós Programamos

Aproveite mais de 20 anos de experiência em programação ao escolher nosso serviço de Desenvolvimento Web. Apenas nos informe o que você deseja para seu site — nós cuidamos do resto.

Saiba Mais

Alex Brown