Como recarregar o ReCaptcha usando JavaScript?

177

Eu tenho um formulário de inscrição no AJAX para poder atualizar a imagem do Recaptcha sempre que ocorrer um erro (por exemplo, nome de usuário já em uso).

Estou procurando um código compatível com o ReCaptcha para recarregá-lo usando JavaScript.

javascript recaptcha

— AhmetB - Google
fonte

1

Não se incomode. Por que alterar o CAPTCHA se o nome de usuário é usado?

— SLaks

18

@ Slaks : provavelmente porque ele primeiro verifica o captcha e depois o usuário - e uma vez que o captcha é usado, ele não é mais válido. Fazer isso da maneira inversa ao usuário mal-intencionado pode danificar facilmente o servidor e obter a lista de todos os usuários usando força bruta sem se incomodar com o captcha.

— Tomasz Nurkiewicz 11/11

1

@TomaszNurkiewicz UPDATE: o usuário mal-intencionado não poderá enviar o mesmo re-captcha para validação mais de uma vez. Portanto, não, força bruta não é possível aqui. O motivo para atualizar o captcha é simplesmente permitir que o usuário o insira novamente.

— Tony Sepia

Acredito que um invasor habilidoso possa explorar ataques de tempo para descobrir quais dados estão errados, dependendo de onde está a validação do bot; Eu prefiro manter o meu como o primeiro cheque e imediatamente rejeitar qualquer coisa se eles falharem, também ajuda a reduzir a carga no meu servidor para que eu não estou fazendo consultas DB quando será rejeitada qualquer maneira

— Steve Byrne

29

Importante: A versão 1.0 da API reCAPTCHA não é mais suportada, atualize para a Versão 2.0.

Você pode usar grecaptcha.reset (); para redefinir o captcha.

Fonte: https://developers.google.com/recaptcha/docs/verify#api-request

— abhiagNitk
fonte

370

Para o reCaptcha v2, use:

grecaptcha.reset();

Se você estiver usando o reCaptcha v1 ( provavelmente não ):

Recaptcha.reload();

Isso será feito se já houver um Recaptcha carregado no window.

(Atualizado com base no comentário de @ SebiH abaixo.)

— AhmetB - Google
fonte

20

Para qualquer um usando o novo reCAPTCHA: A linha agora mudou para grecaptcha.reset();( documenation )

— SebiH

Estou usando este grecaptcha.reset();para o meu reagir apps, e ele funciona perfeitamente

— yussan

4

Se você não tem certeza grecaptcha é carregado, o usoif (window.grecaptcha) grecaptcha.reset();

— fred727

Embora isso recarregue o captcha, o valor do campo para a resposta captcha não parece ser removido, deixando meu formulário válido.

— Damian Green

58

Se você estiver usando a versão 1

Recaptcha.reload();

Se você estiver usando a versão 2

grecaptcha.reset();

— Dasun
fonte

1

Copiou a resposta aceita e republicada 3 anos depois. Urg.

— PR Whitehead

@PRWhitehead Consulte o histórico de edições. Entre, obrigado pelo voto negativo.

— Dasun 28/02

Sim, você não editou a sua e a adicionou primeiro três meses após a resposta aceita ter sido atualizada para refletir uma alteração na API - afetando a relevância da resposta inicial e anos após a adição. Eu diminuí a votação porque essa resposta aceita é mais útil.

— PR Whitehead

2

Eu adicionei esta resposta porque enfrentei o mesmo problema. Embora a resposta aceita refletisse a resposta correta na época, não era clara o suficiente. Pelo menos para mim, foi por isso que decidi adicionar como uma nova resposta com uma separação clara (a resposta aceita falhou em observar as diferenças em relação às versões).

— Dasun

8

grecaptcha.reset(opt_widget_id)

Redefine o widget reCAPTCHA. Um ID de widget opcional pode ser passado, caso contrário, a função redefine o primeiro widget criado. (da página da web do Google)

— Kutalia
fonte

ele só repor o primeiro captcha na página

— Maxwell sc

@ Maxwells.c Você já leu o post? Opcionalmente, você pode passar um ID de widget e excluir o enésimo widget. Se você não passar, o primeiro será redefinido.

— Kutalia

1

Qual é exatamente o ID do widget? Tentei passar a identificação html do recaptcha <div>, mas recebi o erro "identificação de cliente recaptcha inválida". Estou pensando que preciso renderizar o widget explicitamente porque acho que o método render () retorna o ID de que preciso.

— Pete

6

Tente isto

<script type="text/javascript" src="//www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>
<script type="text/javascript">
          function showRecaptcha() {
            Recaptcha.create("YOURPUBLICKEY", 'captchadiv', {
              theme: 'red',
              callback: Recaptcha.focus_response_field
            });
          }
 </script>

<div id="captchadiv"></div>

Se você chamar showRecaptcha, o captchadiv será preenchido com uma nova instância de recaptcha.

— Tim
fonte

você pode alterar seu código e chamar showRecaptcha onload? Isso está ajudando você?

— Tim

6

Ou você pode simular um clique no botão Atualizar

// If recaptcha object exists, refresh it
    if (typeof Recaptcha != "undefined") {
      jQuery('#recaptcha_reload').click();
    }

— AlxVallejo
fonte

1

Por alguma razão, Recaptchae grecaptchaambos estão indefinidos na minha página. Isso funcionou para mim, com uma ligeira modificação:if( $("#recaptcha_reload").length > 0 ){ ....

— Nate-Bit Int

Eu usei isso para saber quando é concluída a iteração de uma matriz sem contar seus elementos.

— M3nda

3

Para usuários do AngularJS:

$window.grecaptcha.reset();

— Marcelo C.
fonte

1

No meu caso sem $ - window.grecaptcha.reset ();

— Tony Sepia

3

Para nova versão do reCaptcha v2, use:

grecaptcha.reset();

— Finalidade corporativa
fonte

2

Se você estiver usando a versão 1.0 da API reCAPTCHA, atualize para a versão 2.0 (a versão 1.0 não é mais suportada)

Use grecaptcha.reset();para redefinir o captcha.

— s sharif
fonte

0

se você estiver usando o novo recaptcha 2.0, use isto: para o código por trás:

ScriptManager.RegisterStartupScript(this, this.GetType(), "CaptchaReload", "$.getScript(\"https://www.google.com/recaptcha/api.js\", function () {});", true);

para javascript simples

<script>$.getScript(\"https://www.google.com/recaptcha/api.js\", function () {});</script>

— Sara Khan
fonte