reCaptcha 错误回调陷入无限循环答案

【问题标题】：reCaptcha error-callback stuck in an infinite loopreCaptcha 错误回调陷入无限循环
【发布时间】：2018-06-20 14:15:36
【问题描述】：

所以我在我的页面上使用了一个不可见的 reCaptcha，并且我正在使用 error-callback 函数向用户报告错误。麻烦的是，每当遇到错误回调时，它就会陷入无限循环。我通过强制站点密钥不正确来触发“错误”，我不确定这是否相关，但我需要一种强制 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消息的无限流。

有什么想法吗？

【问题讨论】：

标签： javascript recaptcha invisible-recaptcha

【解决方案1】：

解决了。

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

这是解决方案的有效方法：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>

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

【讨论】：