隐形reCAPTCHA缺少输入响应

I'm trying to make a page with an invisible reCAPTCHA and I am having trouble getting it to work.

Client Page:

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://code.jquery.com/jquery-2.2.1.min.js" integrity="sha384-8C+3bW/ArbXinsJduAjm9O7WNnuOcO+Bok/VScRYikawtvz4ZPrpXtGfKIewM9dK" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
    <script>
        $('#formcomplete').click(function (e) {
            grecaptcha.reset();
            document.getElementById('form').checkValidity();
            grecaptcha.execute();
            return false;
        });
        function onSubmit(token) {
            document.getElementById('form').submit();
        }
    </script>
    <script src='https://www.google.com/recaptcha/api.js' async defer></script>
    <style>
        .centerize {
            position: absolute;
            left: 50%;
            transform: translate(-50%, 0);
        }
    </style>
</head>
<body style="background-color: black; overflow: hidden;">
    <form method='post' action='_resources/signup.php' id="form">
        <div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 50%;">
            <div class="form-row">
                <div class="form-group col-md-5">
                    <input type="text" class="form-control" name="name" placeholder="Name" size="64" required>
                </div>
                <div class="form-group col-md-7">
                    <input type='email' class='form-control' name='email' placeholder='email@example.com' size="64" required>
                </div>
            </div>
            <div class="form-check" style="text-align: center;">
                <label class="form-check-label" style="color: white">
                    <input type="checkbox" class="form-check-input" name="emaillist" value="emaillisttrue">
                    Add me to the email list to learn about future releases.
                </label>
            </div>
            <div class="form-check" style="text-align: center;">
                <label class="form-check-label" style="color: white">
                    <input type="checkbox" class="form-check-input" name="tac" value="tactrue" required>
                    I accept the <a href="./legal.html" onclick="window.open(this.href, 'mywin', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" >Terms and Conditions & Privacy Policy</a>.
                </label>
            </div>
            <button class='btn btn-default centerize' id="formcomplete">Submit</button>
        </div>
        <div id='recaptcha' class="g-recaptcha"
             data-sitekey="keeeeey"
             data-callback="onSubmit"
             data-theme="dark"
             data-size="invisible">
        </div>
    </form>
</body>

and the Server Side validation:

<?php
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    $name = stripslashes($_POST['name']);
    $email = stripslashes($_POST['email']);
    $emaillist = stripslashes($_POST['emaillist']);
    $tac = stripslashes($_POST['tac']);
    //... verify that you have a name email and accepted the terms
    $verify = file_get_contents("https://www.google.com/recaptcha/api/siteverify",false,stream_context_create(array(
        'http' => array(
            'method' => 'POST',
            'content' => http_build_query(array(
                'secret' => 'keeeeey',
                'response' => $_POST['g-recaptcha-response'],
                'remoteip' => $_SERVER['REMOTE_ADDR']
            ))
        )
    )));
    if (json_decode($verify)->success==true) {
        //... handle normal case
    } else {
        var_dump($verify);
        //header("Location: ...");
    }
}

When I browse to the page everything shows up fine, input is validated (chrome shows "please check this box to continue" if you didn't), and everything works up until I hit submit. After hitting submit I get directed to the form's POST endpoint at which the var_dump throws a discouraging string(75) "{ "success": false, "error-codes": [ "missing-input-response" ] }".

Now here's what perplexes me. If I browse to the page, fill in all the details and then open up the chrome dev console and enter grecaptcha.execute(); the form gets submitted and everything works fine, the reCAPTCHA request goes fine, and all the stuff that happens during the successful verify path server side happens. I have no idea why this happens.

Thanks for your help.

dsaf32131
dsaf32131 好的,只是想检查它是否提交不同,但听起来没有。这导致我对任何建议的墙:(
接近 3 年之前 回复
doulang7699
doulang7699 这样做会产生同样的错误。
接近 3 年之前 回复
dtczp02204
dtczp02204 您是否尝试过移动document.getElementById('form')。submit();进入点击动作,而不是使用onSubmit回调?
接近 3 年之前 回复
dpcnm2132
dpcnm2132 这是一个令人困惑的问题。我正在查看你的代码,看看我是否发现任何奇怪的...除了你如何处理后输入(我使用他们的phplib包括这样做)...到目前为止没有什么东西跳出来对我:(
接近 3 年之前 回复

1个回答



移动</ p>

 &lt; script&gt; 
$('#formcomplete' ).click(function(e){
grecaptcha.reset();
document.getElementById('form')。checkValidity();
\ grecaptcha.execute();
return false;
});

function onSubmit(token){
document.getElementById('form')。submit();
}
&lt; / script&gt;
&lt; script src ='https://www.google.com /recaptcha/api.js'async defer&gt;&lt; / script&gt;
</ code> </ pre>

就在结束 body </ code>标签工作之前。 可能需要在尝试使用DOM之前定义DOM。或者</ p>
</ div>

展开原文

原文

Moving the

<script>
        $('#formcomplete').click(function (e) {
            grecaptcha.reset();
            document.getElementById('form').checkValidity();
            grecaptcha.execute();
            return false;
        });
        function onSubmit(token) {
            document.getElementById('form').submit();
        }
    </script>
    <script src='https://www.google.com/recaptcha/api.js' async defer></script>

to just before the closing body tag worked somehow. Probably needed the DOM to be defined before attempting to use elements on it or something.

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐