web-dev-qa-db-ja.com

reCAPTCHAセッションが期限切れになったときにイベントを発生させる

私はグーグルreCAPTCHAに取り組んでいます。正常に動作していますが、一定時間後にreCAPTCHAセッションが期限切れになり、ユーザーがチェックボックスをもう一度クリックしてreCAPTCHAを入力すると、GoogleはError: invalid load parameters.というアラートを表示します。その後ユーザーがページをリロードするまで何も機能しません。

session expiredメッセージを含むdivブロックのクラスはrc-anchor-expired-msgです。このクラスを使用してdiv showイベントを試行し、セッションが期限切れになるとすぐにイベントを発生させ、recaptchaをリセットしようとしました。しかし、これも機能していません。

セッションの有効期限が切れたときにrecaptchaをリセットできるコールバック関数などはありますか？.

jqueryrecaptcha
12
Jeevan Patil

ReCAPTCHAをレンダリングするときに渡すことができる期限切れのコールバックパラメータがあり、それをgrecaptcha.reset()メソッドを呼び出すことができます。

例えば：

これをヘッダーに入れます。

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

これを、reCAPTCHAのレンダリングに使用される要素の後に置きます。

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

これにより、セッションが期限切れになるたびにreCAPTCHAがリセットされます。 Error: invalid load parameters.アラートウィンドウの問題を解決しました。

それがどのように機能するかを説明する必要がある場合、APIがロードされると、ヘッダースクリプトタグからcallback関数を呼び出します。この関数は、reCAPTCHAをレンダリングし、expired-callbackをexpCallback関数として宣言します。この関数は、reCAPTCHAを元の状態にリセットするだけです。

ReCAPTCHAウィジェットを自動的にレンダリングするときに（上記のように明示的にレンダリングするのではなく）data-expired-callbackをタグ属性として使用できるはずですが、そのように試したときにコールバックが機能しませんでした。

24
spaceman