Wystąpienie pożaru, gdy sesja reCAPTCHA wygasa

Question

Pracuję na google reCAPTCHA. Działa dobrze, ale gdy sesja reCAPTCHA wygasa po pewnym czasie, a użytkownik kliknie ponownie na pole wyboru, aby wypełnić reCAPTCHA, Google pokazuje alert informujący: Error: invalid load parameters. Nic nie działa po tym, dopóki użytkownik nie załaduje ponownie strony.

Blok div zawierający wiadomość session expired ma klasę rc-anchor-expired-msg. Próbowałem użyć zdarzenia div show używając tej klasy do wywołania zdarzenia, gdy tylko sesja wygaśnie i spróbuję zresetować recaptcha. Ale to też nie działa.

Czy istnieje funkcja wywołania zwrotnego lub coś, za pomocą którego mogę zresetować recaptcha po wygaśnięciu sesji.

Answer 1

Istnieje parametr wywołania zwrotnego, który upłynął podczas renderowania reCAPTCHA, który można następnie wywołać metodą grecaptcha.reset().

Na przykład:

Umieść to w nagłówku.

<script> 
    var callback = function() { 
     grecaptcha.render('id-of-render-element', { 
     'sitekey': 'your-site-key', 
     'expired-callback': expCallback 
     }); 
    }; 
    var expCallback = function() { 
     grecaptcha.reset(); 
    }; 
</script> 

Umieść to po elemencie, który będzie używany do renderowania reCAPTCHA.

<div id="id-of-render-element"></div> 
<script src="https://www.google.com/recaptcha/api.js?onload=callback&render=explicit" async defer></script> 

Spowoduje to zresetowanie wartości reCAPTCHA po wygaśnięciu sesji. Pozbyłem się dla ciebie problemu z okna alertu Error: invalid load parameters..

Jeśli wymaga wyjaśnienia, jak to działa, po załadowaniu api wywołuje funkcję callback ze znacznika skryptu nagłówka. Ta funkcja renderuje reCAPTCHA i deklaruje, że expired-callback jest funkcją expCallback, która właśnie resetuje ponownie reCAPTCHA do swojego pierwotnego stanu.

Powinieneś móc używać jako atrybutu znacznika, gdy automatycznie renderujesz reCAPTCHA (w przeciwieństwie do renderowania go jawnie jak wyżej), ale wywołanie zwrotne nie zadziałałoby na mnie, gdy spróbowałem tego w ten sposób.