4

我在我的 jsp 页面中呈现 google recaptcha 小部件,并在我提交表单时以编程方式在我的 java 脚本中调用挑战。

<script type="text/javascript" id="recaptcha-response">    
     var siteKey = $('#recaptchasitekey').first().text();     
         var onloadCallback = function() {          
            grecaptcha.render('recaptcha_element', {
              'sitekey' : siteKey,
              'callback' : correctCaptcha,
              'data-bind' : "qoActionTemplate"
            },true);            
          };
         var correctCaptcha = function(response) {           
            return response;
         };

    </script>   
      <div class="g-recaptcha" id="recaptcha_element" data-size="invisible" ></div>     
       <script src="http://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script>       
   <script type="text/template" id="recaptchaUrl">

这是我调用挑战的 java 脚本代码。

    executeRecaptcha : function() {
            grecaptcha.execute();
            captcha.token = grecaptcha.getResponse();
            if (captcha.token == null || captcha.token == '') {
                grecaptcha.reset();
                grecaptcha.execute();
            }
            return captcha.token;
        },

    validateRecaptcha : function(response,checkToken) {
            captcha.executeRecaptcha();
            if (captcha.token) {
                var captchaUrl = $('#recaptchaUrl').first().text();
                captcha.userSIDVerify = $('#captcha_token').val();
                $.ajax({
                    type : 'POST',          
                    url : captchaUrl,
                    data : {
                        response : captcha.token
                    },
                    success : captcha.checkToken,
                    error : function() {
                        alert("failed")
                        return;
                    }
                });
            }
        }

grecaptcha.getResponse()在第一次提交表单时总是为空,然后第二次提交时我得到了回复。

4

1 回答 1

8

我不是 100% 确定,但我认为这是因为您以同步方式grecaptcha.getResponse()直接调用grecaptcha.execute(),这不是使用不可见 reCaptcha 的预期方式。这grecaptcha.execute()需要时间来工作(我假设)并且旨在异步返回到该data-callback方法。完成后,您可以grecaptcha.getResponse()随时(在调用之前grecaptcha.reset())使用来获取响应令牌。我想这就是背后的想法grecaptcha.getResponse()。我假设它第二次工作,因为它有时间处理不可见的 reCaptcha。我认为grecaptcha.getResponse()对于常规的 reCaptcha 而不是隐形的也更多。因为常规 reCaptcha 由用户“完成”,而在表单提交时不可见的 reCaptcha 已“完成”,因此需要回调以让我们知道它已完成。

于 2017-11-02T06:24:11.633 回答