Question

最近我试图使用谷歌的隐形ReCaptcha，所以我复制了与官方文档中提到的谷歌相同的例子;但表单没有提交，我们无法进入下一页（表单操作页面）。

客户端代码段：

<html>
<head>
    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    <script>
        function onSubmit(token) {
            document.getElementById("myform").submit();
        }
        function validate(event) {
            event.preventDefault();
            if (!document.getElementById('field').value) {
                alert("Please enter your name.");
            } else {
                grecaptcha.execute();
            }
        }
        function onload() {
            var element = document.getElementById('submit');
            element.onclick = validate;
        }
    </script>
</head>
<body>
<form id='myform' method="post" action="test.php">
    Name: (required) <input id="field" name="field">
    <div id='recaptcha' class="g-recaptcha"
         data-sitekey="mysitekeyxXX"
         data-callback="onSubmit"
         data-size="invisible"></div>
    <button id='submit'>submit</button>
</form>
<script>onload();</script>
</body>
</html>

服务器片段（test.php）：

的var_dump（$ _ POST [ 'G-验证码 - 响应']）;

google的验证流程还有其他代码，但无论如何都不会进入此页面（操作页面）

Answer 1

我不确定你是否已经以1：1复制了所有内容，或谷歌更新了一些文档，但此功能与reCAPTCHA的click here有点不同：

    function onSubmit(token) {
        document.getElementById("myform").submit(); // <- this
    }

并且它不起作用，因为你有一个ID为“submit”的按钮。

<button id='submit'>submit</button>

要正确提交，您必须将按钮的ID重命名为其他内容此外，event.preventDefault（）阻止执行默认表单提交，因此您应该保持原样。修复此名称问题后，它将完美运行！

preventDefualts不允许在Invisible ReCaptcha中提交表单

1 个答案: