Comment recharger ReCaptcha en utilisant JavaScript?

183

J'ai un formulaire d'inscription avec AJAX afin que je veuille rafraîchir l'image Recaptcha à chaque fois qu'une erreur se produit (c'est-à-dire le nom d'utilisateur déjà utilisé).

Je recherche un code compatible avec ReCaptcha pour le recharger en JavaScript.

javascript recaptcha AhmetB - Google
la source
1
Ne vous en faites pas. Pourquoi changer le CAPTCHA si le nom d'utilisateur est pris?
SLaks
18
@SLaks : probablement parce qu'il vérifie d'abord captcha puis vérifie l'utilisateur - et une fois que captcha est utilisé, il n'est plus valide. Faire cela dans l'autre sens, l'utilisateur malveillant peut facilement fausser le serveur et obtenir la liste de tous les utilisateurs utilisant la force brute sans être dérangé par le captcha.
Tomasz Nurkiewicz
1
@TomaszNurkiewicz UPDATE: l'utilisateur malveillant ne pourra pas soumettre le même re-captcha pour validation plus d'une fois. Donc non, la force brute n'est pas possible ici. La raison de l'actualisation du captcha est simplement de permettre à l'utilisateur de le saisir à nouveau.
Tony Sepia
Je crois qu'un attaquant expérimenté pourrait exploiter des attaques de synchronisation pour trouver les données erronées en fonction de l'endroit où se trouve la validation du bot; Je préfère garder le mien comme premier contrôle et rejeter immédiatement tout ce qui échoue, cela aide également à réduire la charge sur mon serveur, donc je ne fais pas de requêtes DB quand ils seront rejetés de toute façon
Steve Byrne

Réponses:

377

Pour reCaptcha v2, utilisez:

grecaptcha.reset();

Si vous utilisez reCaptcha v1 ( probablement pas ):

Recaptcha.reload();

Cela fonctionnera s'il y a un Recaptcha déjà chargé sur le window.

(Mise à jour basée sur le commentaire de @ SebiH ci-dessous.)

AhmetB - Google
la source
20
Pour tous ceux qui utilisent le nouveau reCAPTCHA: La ligne est maintenant devenue grecaptcha.reset();( documentation )
SebiH
grecaptcha.reset();
J'utilise
4
si vous n'êtes pas sûr que grecaptcha est chargé, utilisezif (window.grecaptcha) grecaptcha.reset();
fred727
Bien que cela recharge le captcha, la valeur du champ pour la réponse captcha ne semble pas être supprimée, ce qui laisse mon formulaire valide.
Damian Green
59

Si vous utilisez la version 1

Recaptcha.reload();

Si vous utilisez la version 2

grecaptcha.reset();
Dasun
la source
2
Copié la réponse acceptée et republiée 3 ans plus tard. Urg.
Paul Whitehead le
@PRWhitehead Veuillez consulter l'historique des modifications. BTW, merci pour le vote défavorable.
Dasun
Je l'ai fait, vous n'avez pas modifié la vôtre et vous l'avez ajoutée pour la première fois 3 mois après la mise à jour de la réponse acceptée pour refléter une modification de l'API - affectant la pertinence de la réponse initiale et des années après son ajout. Je l'ai déclinée parce que c'est la réponse acceptée est plus utile.
Paul Whitehead le
2
J'ai ajouté cette réponse parce que j'ai été confronté au même problème. Bien que la réponse acceptée reflétait la bonne réponse à l'époque, elle n'était pas assez claire. Au moins pour moi, c'est pourquoi j'ai décidé d'ajouter une nouvelle réponse avec une séparation claire (la réponse acceptée n'a pas noté les différences par rapport aux versions).
Dasun
9 
grecaptcha.reset(opt_widget_id)

Réinitialise le widget reCAPTCHA. Un identifiant de widget facultatif peut être passé, sinon la fonction réinitialise le premier widget créé. (à partir de la page Web de Google)

Kutalia
la source
il ne réinitialise que le premier captcha de la page
Maxwell sc
@ Maxwells.c Avez-vous même lu le message? Vous pouvez éventuellement transmettre un identifiant de widget et supprimer le nième widget. Si vous ne réussissez pas, le premier est réinitialisé.
Kutalia
1
Quel est exactement l'identifiant du widget? J'ai essayé de passer l'identifiant html du recaptcha <div> mais j'ai obtenu une erreur "invalide recaptcha client id". Je pense que j'ai besoin de rendre le widget explicitement parce que je pense que la méthode render () renvoie l'identifiant dont j'ai besoin.
Pete
opt_widget_id est facultatif et est l'identifiant renvoyé par l'appel de rendu, bien que, s'il est manquant, il fera référence au premier widget recaptcha créé (si vous n'avez qu'un seul widget, cela suffira).
frzsombor
7

Essaye ça 

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

Si vous appelez showRecaptcha, le captchadiv sera rempli avec une nouvelle instance de recaptcha.

Tim
la source
vous pouvez changer votre code et appeler showRecaptcha onload? Est-ce que cela vous aide?
Tim
7

Ou vous pouvez simplement simuler un clic sur le bouton d'actualisation

// If recaptcha object exists, refresh it
    if (typeof Recaptcha != "undefined") {
      jQuery('#recaptcha_reload').click();
    }
AlxVallejo
la source
1
Pour une raison quelconque, Recaptchaet grecaptchasont tous deux indéfinis sur ma page. Cela a fonctionné pour moi, avec une légère modification:if( $("#recaptcha_reload").length > 0 ){ ....
Nate-Bit Int
J'ai utilisé cela pour savoir quand est terminée l'itération d'un tableau sans compter ses éléments.
m3nda
4

Pour les utilisateurs d'AngularJS:

$window.grecaptcha.reset();
Marcelo C.
la source
1
Dans mon cas sans $ - window.grecaptcha.reset ();
Tony Sepia le
4

Pour la nouvelle version de reCaptcha v2, utilisez:

grecaptcha.reset();
Objet corporatif
la source
3

Si vous utilisez la version 1.0 de l'API reCAPTCHA, veuillez passer à la version 2.0 (la version 1.0 n'est plus prise en charge)

Utilisez grecaptcha.reset();pour réinitialiser le captcha.

s sharif
la source
1

si vous utilisez le nouveau recaptcha 2.0, utilisez ceci: pour le code derrière:

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

pour du javascript simple

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