不可见的reCAPTCHA以多种forms发送空的g-recaptcha-response

我正在尝试使用Google Invisible reCAPTCHA ，但是当我在同一页面中有多个表单时，它会发送空的g-recaptcha-response POST参数。 这是我的代码：

谷歌JS

表格1

 
  
 
 Send  

表格2

 
  
 
 Send  

我的JS （基于这个答案 ）

 $(document).ready(function() { window.captchaCallback = function(){ $('.g-recaptcha').each(function(index, el) { var attributes = { 'sitekey' : $(el).data('sitekey'), 'size' : $(el).data('size'), 'callback' : $(el).data('callback') }; grecaptcha.render(el, attributes); }); }; window.form1Callback = function(){ $('#form1').submit(); }; window.form2Callback = function(){ $('#form2').submit(); }; }); 

当我提交其中一个表格时， g-recaptcha-response参数将被发送为空，如下所示。

有人可以帮我把它投入使用吗？

Answer 1

如果要在div元素中呈现不可见的recaptcha，则需要手动调用grecaptcha.execute（）来运行recaptcha。 此外，如果有多个带有recaptcha的表单，则在调用grecaptcha.render（）方法时，需要使用为每个recaptcha生成的窗口小部件ID调用grecaptcha.execute（）方法。

 $(document).ready(function() { window.captchaCallback = function(){ $('.g-recaptcha').each(function(index, el) { var attributes = { 'sitekey' : $(el).data('sitekey'), 'size' : $(el).data('size'), 'callback' : $(el).data('callback') }; $(el).data('recaptcha-widget-id', grecaptcha.render(el, attributes)); }); }; window.form1Callback = function(){ $('#form1').data("recaptcha-verified", true).submit(); }; window.form2Callback = function(){ $('#form2').data("recaptcha-verified", true).submit(); }; $('#form1,#form2').on("submit", function(e){ var $form = $(this); if ($form.data("recaptcha-verified")) return; e.preventDefault(); grecaptcha.execute($form.find(".g-recaptcha").data("recaptcha-widget-id")); }); }); 

Answer 2

根据文档和您的代码，我猜你正在尝试使用Programmatically invoke the challenge. 来自Google reCaptcha 。 所以在你的JS代码中你错过了一个语句：

grecaptcha.execute();

更新也许我误解了你的问题，所以检查一下：

render explicit onload可选。 是否显式呈现窗口小部件。 默认为onload，这将在它找到的第一个g-recaptcha标记中呈现小部件。

据我所知，它刚刚发现第一个标记的标签，这会导致你的问题？