0

所以我在我的页面上使用了一个不可见的 reCaptcha,并且我正在使用该error-callback功能向用户报告错误。麻烦的是,每当遇到错误回调时,它就会陷入无限循环。我通过强制 sitekey 不正确来触发“错误”,我不确定这是否相关,但我需要一种强制 recaptcha 击中此回调的好方法以进行测试和开发目的。

这是一个工作小提琴:https ://jsfiddle.net/gbpmd0y5/

这是我用来诊断问题的示例代码:

<div id="cResults"></div>

<script type="text/javascript">
  function submitHandler() {
    var captchaTarget = 'cResults'
    var shareCaptcha = window.grecaptcha.render(captchaTarget, {
      sitekey: 'sitekey',
      size: 'invisible',
      callback: function(token) {},
      'error-callback': function() {
        console.log('error');
        window.grecaptcha.reset(shareCaptcha);
      }
    });
    window.grecaptcha.execute(shareCaptcha);

  }
</script>

<button value="go" onclick="submitHandler()">Go</button>

<script src="https://www.google.com/recaptcha/api.js?" async defer></script>

如果你运行这段代码,你会看到右下角的 recaptcha 框会不断闪烁(就像它重新加载一样),如果你打开控制台,你会看到无限的error消息流。

有任何想法吗?

4

1 回答 1

0

解决了。

问题似乎是我是grecaptcha.reset()从内部调用的error-callback,这导致错误被一遍又一遍地捕获。

这是解决方案的工作小提琴:https ://jsfiddle.net/w6m3caxq/

最后的工作代码示例:

<div id="cResults"></div>

<script type="text/javascript">
  function submitHandler() {
    var captchaTarget = 'cResults'
    var shareCaptcha = window.grecaptcha.render(captchaTarget, {
      sitekey: 'sitekey',
      size: 'invisible',
      callback: function(token) {},
      'error-callback': function() {
        console.log('error');
      }
    });
    window.grecaptcha.execute(shareCaptcha);

  }
</script>

<button value="go" onclick="submitHandler()">Go</button>

<script src="https://www.google.com/recaptcha/api.js?" async defer></script>

希望这可以帮助某人免于将头撞到墙上。

于 2018-06-21T07:40:31.503 回答