invisible recaptcha - 挑战没有出现

Question

在我们动态生成的表单上实施隐形 reCAPTCHA。我们的 from 引擎从数据库中获取字段列表，并用表单字段动态填充 DOM，显示它，并处理 post。要使用隐形 reCAPTCHA：

当我的页面加载完成时，我正在加载 google api 代码：

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

从数据库加载我的表单后，我将 recaptcha div 注入我的字段列表：

form.fields.push( { html: '<div id="g-recaptcha-div" class="g-recaptcha" data-sitekey="<my site key>" data-badge="inline" data-size="invisible"></div>',
                    type: 'html'
                  } );

稍后，我将表单附加到 DOM (jQuery 'appendTo')，然后立即呈现 reCAPTCHA：

recaptcha_id = grecaptcha.render("g-recaptcha-div", 
                   { 
                     'data-callback': _settings.form.submit,
                     'sitekey'      : <my site key>
                   }, true 
                 );

然后出现表单，并显示 reCAPTCHA badge/protected 图标。查看 DOM 检查器，我可以重新验证 DIV，那里有 'g-recaptcha-response' 文本区域，但它是不可见的。正如我所料。

然后，在我的提交函数中，在我做了一些表单验证之后，我执行了重新验证：

grecaptcha.execute(recaptcha_id);

在这一点上，我希望挑战会突然出现。但事实并非如此。好吧，它有过一次。我的表单提交到我的 PHP 后端，其中有一个 g-recaptcha-response 参数，但它是空的。挑战出现的那一次，在 g-recaptcha-response 中有一个值。

挑战总是应该在调用执行函数时出现吗？如果不是，那么我们应该如何处理空响应值？

谢谢， 安迪

Answer 1

好的，对于那些在家跟随的人：

1) 是的，你可以在对grecaptcha.render的调用中指定回调函数的名称。深入观察，我注意到在此页面 (https://developers.google.com/recaptcha/docs/invisible#js_api) 上我需要像这样指定函数的名称：

recaptcha_id = grecaptcha.render("g-recaptcha-div", 
                                  { 
                                    'sitekey'  : <my site key>,
                                    'callback' : <callback>
                                  }, true 
                                );

我正在尝试使用 "data-callback"，这是如何在 HTML 中指定的。呸！并回答我的另一个问题，一旦您正确执行此操作，无论是否呈现挑战，都会使用令牌调用回调。