Javascript 不可见的reCAPTCHA发送带有多个表单的空g-reCAPTCHA-response

我正在尝试使用，但当我在同一页面中有多个表单时，它会发送空的

g-recaptcha-response

POST参数。这是我的密码：

谷歌JS

<script src="//google.com/recaptcha/api.js?hl=pt-BR&onload=captchaCallback&render=explicit" async defer></script>

当我提交其中一个表单时，

g-recaptcha-response

参数发送为空，如下所示

---

有人能帮我把它投入工作吗？

根据文档和您的代码，我猜您正试图通过编程方式调用挑战。from。 因此，在JS代码中，您遗漏了一条语句：

grecaptcha.execute（）

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

呈现显式onload可选。是否呈现小部件
明确地默认为onload，这将在
它找到的第一个g-recaptcha标签

据我所知，它只是找到了第一个标记的标记，这导致了问题？
如果要在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"));
    });
});

默认的
onload
仅在找到的第一个标记中呈现
g-recaptcha
，因此我改为
explicit
，这样我可以加载两个元素如果答案解决了您的问题，请将其标记为您接受的答案。这样，世界上的其他人就知道哪种解决方案适合你的特定情况了。@Aram，你是对的，但是没有一个答案解决了这个问题，我现在每页使用一个表单
<form action="/site/Contact/send" id="form2">
    <input type="text" name="nome" required>

    <div class="g-recaptcha"
        data-sitekey="xxxxxxxxxxxxxxxxxxxxxxxx"
        data-callback="form2Callback"
        data-size="invisible">
    </div>

    <button type="submit">Send</button>
</form>

$(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();
    };
});

$(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"));
    });
});