40

Estou tentando implementar o reCAPTCHA da Google no meu site, e não consigo fazer a integração Server-Side (Utilizo a linguagem PHP). Como posso fazer para que o reCAPTCHA funcione, e realize a validação antes enviar os dados do meu formulário?

Fonte e Documentação do Google reCAPTCHA

3
  • seu server side é o que ? java, php, .net ou assembly ? Edite sua pergunta e adicione a tag da linguagem :o)
    – wryel
    24/04/2015 às 16:31
  • Campos editados. Meu serv-side é php
    – Odair
    24/04/2015 às 16:38
  • 1
    Achei sua pergunta interessante porque parece que não existe a página do reCAPTCHA em português. Sei que muitos acham que todo programador tem que saber inglês, mas acho que não faz mal ter algo como um "guia" do reCAPTCHA por aqui... (ou é fora de escopo?) Acho que ajudaria se você melhorasse um pouco mais a pergunta, incluindo o erro específico que não está conseguindo resolver, e colocasse ao menos algum código que já esteja utilizando.
    – gustavox
    24/04/2015 às 23:30

3 Respostas 3

55

Introdução ao reCAPTCHA

O reCAPTCHA é uma nova ferramenta do Google para proteger seu site contra spammers e bots. Ele vem de uma ideia novadora, pois até então os captchas eram vistos mais como um obstáculo do que um auxiliar pelos usuários. Com o reCAPTCHA isso é diferente, pois tudo que o usuário precisa fazer é clicar em um checkbox, confirmando que não é um robô. Dessa forma todos ganham, o usuário tem acesso mais rápido às informações desejadas, e você mantém visitantes indesejáveis de seu site.

Incrível! Quero ter um desses, como faço?

O primeiro passo é você conseguir uma chave para o seu site. Vá até o site abaixo e clique no botão azul localizado na posição superior-direita do site, escrito "Get reCAPTCHA": https://www.google.com/recaptcha/intro/index.html

Após ter cadastrado seu site, você terá em mãos duas informações importantes: a chave do site, e a secret (chamarei de chave secreta). O primeiro passo para implementar o reCAPTCHA em seu site é inserir a API em seu site. Insira o código dentro da tag head de seu site:

<script src='https://www.google.com/recaptcha/api.js'></script>

Tudo pronto para o próximo passo.

Criando o formulário

Crie um formulário comum, eu fiz com dois campos: um para o usuário colocar o nome, e outro para uma mensagem qualquer. A marcação ficou assim:

<h1>Exemplo de formulário com o reCaptcha</h1>
		
<form action="formulario.php" method="post">
  Digite seu nome: <input type="text" name="nome"><br><br>
  Deixe sua mensagem: <br>
  <textarea name="mensagem" rows="7" cols="35"></textarea><br><br>
  <input type="submit" value="Submit" name="formulario">
</form>

Inserir o reCAPTCHA no formulário é extremamente simples, você só precisa adicionar o seguinte elemento na posição que deseja que ele apareça:

<div class="g-recaptcha" data-sitekey="SUA-CHAVE"></div>

Não esqueça de substituir SUA-CHAVE pela chave que você recebeu no site, lembrando que é a chave do site, não a chave secreta!

Substitua a propriedade action na tag form para o nome do arquivo PHP que irá validar o formulário. Você pode validar na mesma página, mas eu preferi deixar em uma separada para o código ficar mais simples.

Mas não posso validar usando JavaScript na hora?

Não :) Você já irá entender o motivo.

Criando o código PHP para validar o formulário

Vamos obter o valor do campo de nome e da mensagem que o usuário enviou:

if (isset($_POST['nome'])) {
    $nome = $_POST['nome'];
}

if (isset($_POST['mensagem'])) {
    $mensagem = $_POST['mensagem'];
}

A partir daqui que a validação do captcha realmente acontece. É nos enviada via POST um valor fornecido pelo reCAPTCHA, é possível recuperar esse valor pela variável $_POST['g-recaptcha-response']. Logo:

if (isset($_POST['g-recaptcha-response'])) {
    $captcha_data = $_POST['g-recaptcha-response'];
}

// Se nenhum valor foi recebido, o usuário não realizou o captcha
if (!$captcha_data) {
    echo "Por favor, confirme o captcha.";
    exit;
}

Parece que acabou, né? Não! Agora que vem a parte divertida, lembra quando eu disse que era necessário que o captcha tinha que passar por uma validação PHP? Isso é necessário pois o reCAPTCHA usa informações no banco de dados do Google, que contém diversas informações sobre o usuário que "efetuou" o captcha. Dessa forma é possível distinguir um usuário comum de um bot. Para validarmos o usuário, precisamos fazer uma requisição para a API do reCAPTCHA, utilizando o file_get_contents. Observe:

$resposta = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=SUA-CHAVE-SECRETA&response=".$captcha_data."&remoteip=".$_SERVER['REMOTE_ADDR']);

Procure no meio da URL por SUA-CHAVE-SECRETA e substitua pela sua. O que esse comando faz é recuperar dados na API do reCAPTCHA por informações sobre os valores que foram fornecidos pelo captcha, além de enviar o IP do usuário para futuras avaliações.

Com a requisição enviada, só nos falta tratar a resposta:

if ($resposta.success) {
    echo "Obrigado por deixar sua mensagem!";
} else {
    echo "Usuário mal intencionado detectado. A mensagem não foi enviada.";
    exit;
}

Espero que tenha entendido como o sistema funciona. Qualquer dúvida já sabe, estamos aqui para ajudar. ;)

1
  • 1
    Cara , depois de quase arrancar meus cabelos por 2 dias, eis que aqui consegui resolver o problema de um ReCaptcha não estava funcionado em um cliente novo. Por algum motivo nao tinha jeito de funcionar e com suas orientações DEU CERTO! :) Obrigada
    – Paulinha
    5/11/2019 às 17:52
16

RESPOSTA TOTALMENTE REFORMULADA. Motivo: eu coloquei as informações conforme fui descobrindo e ficou muito ruim. Agradeço ao Rafael Almeida, pela primeira resposta, que me ajudou muito e me levou a descobrir mais coisas. E aos administradores, que fizeram alterações que me orientaram a melhorar a resposta. A minha resposta existe só para acrescentar informações ao excelente trabalho já feito por Rafael Almeida.

Código no lado do cliente (HTML e JavaScript)

Uma questão levantada: mas não posso validar usando JavaScript na hora?

Até daria para fazer, na verdade, usando AJAX: mandar a informação para o PHP e obter a resposta antes de submeter o formulário inteiro, com o restante dos campos. No entanto, não parece um esforço necessário, pois, ao clicar no reCAPTCHA, ele não libera enquanto o usuário não der a resposta certa. Pelo menos, não vi acontecer outra coisa senão com ou sem a marca "check" para indicar que está tudo OK (por exemplo, não vi um X vermelho no lugar). Em outras palavras, o reCAPTCHA é tudo ou nada: ou o usuário não respondeu ou respondeu e respondeu certo.

O que parece ser útil aqui fazer a verificação no JS antes de enviar para o PHP para saber se o usuário ao menos usou o reCAPTCHA, para evitar o envio do formulário inteiro. Isso é muito fácil, pois a API já tem a função, é só colocar alguma coisa assim na função que executa no onsubmit do formulário:

 if (grecaptcha.getResponse() == "")
 {
      alert("Você não clicou no reCAPTCHA, por favor, faça!")
      return false;
 }

Código no lado do servidor (PHP)

O que me levou a obter mais informações é que o código com file_get_contents não deu certo para mim. Inicialmente, achei que o problema fosse o método de envio da função (GET, enquanto o site do reCAPTCHA diz que precisa ser POST). Depois, descobri que funciona perfeitamente na cópia do site hospedada no meu PC. Ou seja, é o servidor da hospedagem (eu uso Hostmídia) que bloqueia. Eu ainda tentei, mas sem sucesso:

ini_set('allow_url_fopen', 1)

A resposta alternativa, baseada em cURL, pode ser útil para quem tem o site na mesma hospedagem ou em outra que também bloqueie. De qualquer forma, pode ser interessante para evitar que, em caso de warning, no fique registrado no log a URL incluindo a chave secreta. Segue o código:

# Os parâmetros podem ficar em um array
$vetParametros = array (
    "secret" => "SUA-CHAVE-SECRETA",
    "response" => $_POST["g-recaptcha-response"],
    "remoteip" => $_SERVER["REMOTE_ADDR"]
);
# Abre a conexão e informa os parâmetros: URL, método POST, parâmetros e retorno numa string
$curlReCaptcha = curl_init();
curl_setopt($curlReCaptcha, CURLOPT_URL,"https://www.google.com/recaptcha/api/siteverify");
curl_setopt($curlReCaptcha, CURLOPT_POST, true);
curl_setopt($curlReCaptcha, CURLOPT_POSTFIELDS, http_build_query($vetParametros));
curl_setopt($curlReCaptcha, CURLOPT_RETURNTRANSFER, true);
# A resposta é um objeto json em uma string, então só decodificar em um array (true no 2º parâmetro)
$vetResposta = json_decode(curl_exec($curlReCaptcha), true);
# Fecha a conexão
curl_close($curlReCaptcha);
# Analisa o resultado (no caso de erro, pode informar os códigos)
if ($vetResposta["success"]) echo "<p>Captcha OK!</p>\n";
else 
{
    echo "$<p>Problemas:</p>\n";
    foreach ($vetResposta["error-codes"] as $strErro) echo "$strTab<p>Erro: $strErro</p>\n";
}

Um pouco mais, ainda no lado do servidor...

Se olhar as instruções do site do reCAPTCHA, há a indicação de uma biblioteca que está no github, em /google/recaptcha. Também funciona bem: bastou colocar a pasta src do ZIP baixado em algum lugar do site e usar o código parecido com o exemplo deles. O único problema é que estava dando o seguinte erro:

invalid-json

Então encontrei dica em outro artigo Stackoverflow (indicação do método CurlPost):

$recaptcha = new \ReCaptcha\ReCaptcha($secret, new \ReCaptcha\RequestMethod\CurlPost());
$resp = $recaptcha->verify($gRecaptchaResponse, $remoteIp);
if ($resp->isSuccess()) {
    // verified!
} else {
    $errors = $resp->getErrorCodes();
}

Para isso, não testei se o problema era na hospedagem ou na própria classe da biblioteca.


1
0

Segue uma implementação completa do reCaptcha que estou usando em um site que estou desenvolvendo, a única coisa que falta pra funcionar 100% é criar os objetos, mas deixei bem descrito como criá-los, sou apenas estudante então fiz o melhor que pude.

<?php ini_set('display_errors',1); ini_set('display_startup_erros',1); error_reporting(E_ALL); ?><!--Força o php a mostrar todo tipo de erro, linha temporária-->
    <?php
    function __autoload($class_name){
        require_once '../_lib/'.$class_name.'.php';//-->lê minhas classes de forma automática
    }
    ?>
    <!DOCTYPE html>
    <html>
    <head>
        <link rel="stylesheet" type="text/css" href="_css/login.css"/>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
        <script src='https://www.google.com/recaptcha/api.js'></script>
        <script>
            $(document).ready(function() {
                $('#send').prop('disabled', true);//desativa o botão enviar
                $('.g-recaptcha').hide();//esconde o captcha
                validate();
                $('#inputEmail, #inputPassword').change(validate);
            });
            function validate() {
                if ($('#inputEmail').val().length > 10) {//enquanto o campo de email nao tiver menos que 10 caracteres, não ativa o reCaptcha
                    $('.g-recaptcha').show();//exibe o reCaptcha
                }else{//se mudar de ideia e reduzir o campo pra menos de 10 caracteres...
                    $('.g-recaptcha').hide();//o reCaptcha se esconde novmanete
                }
            }
            function enableSend() {
                $('#send').prop('disabled', false);//quando o captcha é confirmado, ativa o botao enviar
            }
        </script>
    </head>

    <body>
    <?php
    $helper = new Helpers();//-->objeto com vários métodos importantes
    if (isset($_POST['attempt'])){//verifica se tem tentativa restante
        $attempt = intval($helper->validation($_POST['attempt']));//validation=método que verifica e escapa minha sring (trim(), stripcslashes() e htmlspecialchars())
    }else{
        $attempt = 3;//se não for definido número de tentativas, aqui é definido como 3
    }

    if (isset($_POST['g-recaptcha-response']) and isset($_POST['username']) and isset($_POST['password'])) {//garante que todos os campos foram preenchidos
        $captcha_data = $_POST['g-recaptcha-response'];
        if ($captcha_data) {//Verificação do reCaptcha
            $resposta = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=DIGITE-SUA-CHAVE-SECRETA-GERADA-PELO-GOOGLE-AQUI=" . $captcha_data . "&remoteip=" . $_SERVER['REMOTE_ADDR']);
            if ($resposta) {//validação do reCaptcha
                $username = strtolower($helper->validation($_POST['username']));
                $password = $helper->validation($_POST['password']);
                $user = new User();//--->meu objeto que acessa o banco de dados usando PDO
                $userValidated = $user->checkPasswordHash($username);//--->método do meu objeto que procura o usuario no bacno de dados (SELECT * FROM tbl_Users WHERE username = $username)
                if ($userValidated){//verifica se o email existe, se existir...
                    if ($userValidated->status == 1){//verifica se a conta está bloqueada ou não
                        echo 'Essa conta está bloqueada, criar botão para reenviar o email de recuperação...';
                    }else{
                    $hash = $userValidated->password;//retorna o hash do password
                    if (password_verify($password, $hash)) {//compara a senha e o hash que foi criado usando password_hash() e salvo no banco de dados
                        echo 'Password é válido, inserir código que inicia as sessões e chama a próxima página';//-->insira seu código
                    } else {//caso o password estjeja errado, perde uma tentativa
                        if ($attempt != 1){//se a tentativa restante for igual a 1, a proxima vez será direcionado para a página de recuperação de senha
                            $attempt--;
                            echo 'Usuário e senha não combinam, você tem mais '.$attempt.' tentativas';//mostra o número de tentativas restante
                        }else{//bloqueia a conta e chama a página de recuperação de senha
                            echo 'inserir código que bloqueia a conta e abre pagina de recuperaçao de senha';//-->insira seu código de bloqueio
                        }
                    }
                    }
                }else{//se o email não existir, perde uma tentativa mas não avisa se o erro foi no email ou na senha
                    if ($attempt != 0){
                        $attempt--;
                        echo 'Usuário e senha não combinam, você tem mais '.$attempt.' tentativas';//mostra o número de tentativas restante
                    }else{//bloqueia a conta e chama a página de recuperação de senha
                        echo 'inserir código que bloqueia a conta e abre pagina de recuperaçao de senha';//-->insira seu código de bloqueio
                    }
                }
            } else {
                echo "Validação não concluída, tente novamente.";
                exit;
            }
        } else {
            echo "Validação não concluída, tente novamente.";
            exit;
        }
    }
    ?>
    <section>
        <form class="login" action="login.php" method="post">
            <fieldset>
                <legend>Login</legend>
                <label for="inputEmail" class="Label">Email: </label>
                <input id="inputEmail" class="inputText" type="email" maxlength="30" name="username" required>
                <label for="inputPassword" class="Label">Password: </label>
                <input id="inputPassword" class="inputPassword" type="password" maxlength="20" name="password" required>
                <div class="g-recaptcha" data-sitekey="DIGITE-A-CHAVE-DO-SEU-SITE-CRIADA-PELO-GOOGLE-AQUI" data-callback="enableSend"></div><!--Linha que adiciona o recaptcha-->
                <input type="hidden" name="attempt" value=<?php echo $attempt ?> /><!--envia por post o numero de tentativas restante-->
                <input type="submit" value="Confirmar" id="send" class="send">
            </fieldset>
        </form>
    </section>

    </body>
    </html>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .