it-roy-ru.com

Google reCaptcha ответ "Uncaught (в обещании) null"

Я использую reCaptcha v2, но в любом случае отклик консоли разработчика Uncaught (in promise) null в (и перемещение функции .reset()

приставка:

 enter image description here

мой код для рекапчи:

<div class="text-xs-center" style="text-align: center; height:150px;">
    <p style="color: black;"> Complete the verification: </p>
    <div style="display: inline-block;" class="g-recaptcha" data-sitekey="xxxxxxxxxxx" data-callback="callback"></div>
</div>

моя функция обратного вызова:

function callback() {
    if (grecaptcha === undefined) {
        alert('Recaptcha non definito'); 
        return; 
    }

    var response = grecaptcha.getResponse();
    console.log(response);

    if (!response) {
        alert('Coud not get recaptcha response'); 
        return; 
    }

    $.ajax({
    'url' : 'validate-recaptcha.php',
    'type' : 'POST',
    'data' : {
        'response' : response   
    },
    'success' : function(data) {              
        alert('Data: '+data);
    },
    'error' : function(request,error)
    {
        alert("Request: "+JSON.stringify(request));
    }
    });
    grecaptcha.reset();
}

и мой validate-recaptcha.php:

<?php
//debug
$fp = fopen('debug.txt', 'a');
fwrite($fp, print_r($_POST, TRUE));
fclose($fp);
//enddebug

if (empty($_POST['recaptcha'])) {
    exit('Please set recaptcha variable');
}
// validate recaptcha
$response = $_POST['recaptcha'];
$post = http_build_query(
    array (
        'response' => $response,
        'secret' => 'yoursecretkey',
        'remoteip' => $_SERVER['REMOTE_ADDR']
    )
);
$opts = array('http' => 
    array (
        'method' => 'POST',
        'header' => 'application/x-www-form-urlencoded',
        'content' => $post
    )
);
$context = stream_context_create($opts);
$serverResponse = @file_get_contents('https://www.google.com/recaptcha/api/siteverify', false, $context);
if (!$serverResponse) {
    exit('Failed to validate Recaptcha');
}
$result = json_decode($serverResponse);
if (!$result -> success) {
    exit('Invalid Recaptcha');
}
exit('Recaptcha Validated');

Поиск в Интернете, вероятно, проблема в функции .reset(), но я не понимаю, решение.

11
FABBRj

Recaptcha v2 callback js error

У меня тоже была эта ошибка, и я обнаружил, что она связана с обратным вызовом recaptcha (в вашем случае data-callback="callback"). Если вы удалите атрибут data-callback, ошибка не появится.

Ошибка консоли Uncaught (in promise) null указывает на то, что обратный вызов ожидает обещание. Вот базовая функция обратного вызова для повторного использования обещаний:

function callback() {
    return new Promise(function(resolve, reject) { 

    //Your code logic goes here

    //Instead of using 'return false', use reject()
    //Instead of using 'return' / 'return true', use resolve()
    resolve();

  }); //end promise
};

В вашем случае вам нужно настроить ваш код примерно так:

function callback() {
  return new Promise(function(resolve, reject) {  

    if (grecaptcha === undefined) {
        alert('Recaptcha non definito'); 
        //return;
        reject();
    }

    var response = grecaptcha.getResponse();
    console.log(response);

    if (!response) {
        alert('Coud not get recaptcha response'); 
        //return;
        reject();
    }

    $.ajax({
    'url' : 'validate-recaptcha.php',
    'type' : 'POST',
    'data' : {
        'response' : response   
    },
    'success' : function(data) {              
        alert('Data: '+data);
        resolve();
    },
    'error' : function(request,error)
    {
        alert("Request: "+JSON.stringify(request));
        reject();   
    }
    });
    grecaptcha.reset();

  }); //end promise
}

Это мой первый ответ на SO, поэтому, пожалуйста, будьте терпеливы и дайте мне знать, если я что-то забыл или пропустил :)

10
EsaulFarfan

Другой причиной этой ошибки, которая мучила меня, была кнопка в форме с атрибутом имени 'submit'. Если вы используете пример кода автоматической привязки из документации reCaptcha , это сработает, так как «form.submit» будет ссылаться на кнопку, а не на функцию submit () самой формы. Doh!

<html>
  <head>
    <title>reCAPTCHA demo: Simple page</title>
     <script src="https://www.google.com/recaptcha/api.js" async defer></script>
     <script>
       function onSubmit(token) {
         document.getElementById("demo-form").submit();
       }
     </script>
  </head>
  <body>
    <form id='demo-form' action="?" method="POST">
      <!-- Oops.... avoid the name="submit" below -->
      <button name="submit" class="g-recaptcha" data-sitekey="your_site_key" data-callback='onSubmit'>Submit</button>
      <br/>
    </form>
  </body>
</html>
3
John Rix

В моем случае мой обратный вызов только что ссылался на некоторую переменную, которая не существовала, и я увидел ту же ошибку. Очень странная ошибка для чего-то такого простого!

Я также увидел ту же ошибку, когда оставил . после имени переменной в случае аварии. Похоже, это супер общая ошибка, которая означает fix the code in your callback!.

0
Trev14