0
373
ViewsRespuesta de Google reCaptcha "No capturado (en promesa) nulo"
Estoy usando reCaptcha v2 pero en la respuesta de la consola de Uncaught (in promise) null en cualquier caso (y moviendo la función .reset() )
consola:
mi código para recaptcha:
<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>mi función de devolución de llamada:
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(); }y mi validar-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'); Buscando en internet, probablemente el problema sea la función .reset() , pero no entiendo la solución.
11 answers
Answer question0
También tuve este error y descubrí que está relacionado con la devolución de llamada de recaptcha (en su caso data-callback="callback" ). Si elimina su atributo de devolución de llamada de datos, el error no aparecerá.
El error de consola Uncaught (in promise) null indica que la devolución de llamada está esperando una promesa. Aquí hay una función de devolución de llamada básica para recaptcha usando promesas:
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 };En su caso, necesita ajustar su código a algo como esto:
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 }Esta es mi primera respuesta en SO, así que tenga paciencia y avíseme si olvidé o me perdí algo :)
0
Similar al problema/solución de John Rix. También recibí el error cuando la identificación del elemento de envío era 'enviar'.
<!-- Avoid id="submit" below --> <input type="submit" id="submit" value="submit">```0
Esto puede suceder cuando su código de devolución de llamada provoca un error. En mi caso, mi devolución de llamada solo hizo referencia a una variable que no existía y vi el mismo error. ¡Error muy extraño para algo tan simple!
También vi el mismo error cuando dejé un archivo . después de un nombre de variable por accidente. ¡Parece que este es un error súper genérico que significa fix the code in your callback! .
0
Otro desencadenante de este error que me atormentaba era tener un botón en el formulario con un atributo de nombre de 'enviar'. Si usa el código de ejemplo de vinculación automática de la documentación de reCaptcha , esto lo tropezará, ya que 'formulario.enviar' se referirá al botón en lugar de a la función enviar() del formulario en sí. ¡Do!
<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>0
En mi caso estaba usando jquery.3.4.1.slim.js luego cambié a jquery.3.4.1.min.js y desapareció el error. Estoy en ASP.NET WebForms .
0
Resulta que también ocurre cuando un sitio no está "registrado" en el área de Dominios de Google recaptcha/admin.
Solución: agregue el dominio en el área de administración de recaptcha:
- Inicie sesión en su cuenta de Google donde están registradas sus claves de recaptcha
- Escriba en Google "consola de administración de google recpatcha"
- Vaya a su configuración para su clave (de producción)
- En "Dominios", agregue estas dos entradas:
localhost 127.0.0.1
- Guárdelo y pruebe su recaptcha.
Cometí este error cuando cambié de una clave de desarrollo a una clave de producción. La clave de producción no tenía ninguna entrada para localhost.
Configuré la respuesta de la API para sentarse detrás de una redirección de proxy. Por lo tanto, la verificación funcionaba en un entorno de host local que no estaba configurado en la consola de administración de Google, lo que provocó este error genérico.
Crédito a @Christian Žagarskas quien lo señaló en su comentario.
0
Tuve este problema. Fue porque en mi función de devolución de llamada, el código jquery estaba allí y, por alguna razón, había olvidado incluir el script jquery. Entonces, si tiene este problema, le sugiero que revise cuidadosamente cada línea de su código de devolución de llamada. Puede reducir la complejidad línea por línea y obtendrá la solución. El manejo de errores debería haberse hecho de una mejor manera.
0
Siento que debería agregar una respuesta aquí con mi experiencia específica. Le doy crédito a la respuesta principal, que será parte de mi respuesta.
Obtuve: Uncaught (in promise) null . Cuando expandí el error en la consola, estaba vacío.
Cambié mi código de esto:
function onSubmit(token) { if (grecaptcha.getResponse() !== "") { $('#request-form').submit(); } grecaptcha.reset(); }A esto:
function onSubmit(token) { return new Promise(function (resolve, reject) { if (grecaptcha.getResponse() !== "") { $('#request-form').submit(); } grecaptcha.reset(); }); }Lo que hace este cambio es permitirle recibir un mensaje de error específico en su consola. A continuación, puede proceder a solucionar su problema específico.
0
Estaba usando ASP.NET Core 3.1 Identity, tuve este problema y lo resolví actualizando jquery.validate.min.js y jquery.validate.unobtrusive.min.js a la última versión en _ValidationScriptsPartial.cshtml .
0
Me encontré con este error porque tenía:
const onChange = e => { e.preventDefault(); console.log('success') } <ReCAPTCHA sitekey="yeet" onChange={onChange} /> Eliminar e.preventDefault() eliminó el error.
0
Tuve el mismo problema y el problema fue que no agregué localhost a la lista de dominios admitidos.