Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

174
Vistas
Permita que el formulario envíe una solicitud POST pero evite que la página se vuelva a cargar - Javascript

Estoy trabajando en un formulario de registro con un reCAPTCHA v2 integrado y me encontré con el problema de que al enviar el formulario que incluye el reCAPTCHA, está recargando la página. Tengo una función php para validar el reCAPTCHA:
 if (isset($_POST['g-recaptcha-response'])) { function CheckCaptcha($userResponse) { $fields_string = ''; $fields = array( 'secret' =>' 6LcGWeEcAAAAAMALbpP873Pt40Wgwn6e0SuVn7EV', 'response' => $userResponse ); foreach($fields as $key=>$value) $fields_string .= $key . '=' . $value . '&'; $fields_string = rtrim($fields_string, '&'); $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, 'https://www.google.com/recaptcha/api/siteverify'); curl_setopt($ch, CURLOPT_POST, count($fields)); curl_setopt($ch, CURLOPT_POSTFIELDS, $fields_string); curl_setopt($ch, CURLOPT_RETURNTRANSFER, True); $res = curl_exec($ch); curl_close($ch); return json_decode($res, true); } $result = CheckCaptcha($_POST['g-recaptcha-response']); if ($result['success']) { echo 'Success!'; } else { echo 'Error'; } }

Cuando se envía el formulario, proporciona una variable POST g-recaptcha-response a la página en la que se encuentra, ya que no hay ningún atributo de action en el formulario.

Por lo tanto, necesito obtener la solicitud POST, pero no puedo dejar que la página se vuelva a cargar porque eso eliminaría otros datos de la página. Intenté usar event.preventDefault(); cuando se envía el formulario, pero eso también impidió que el formulario enviara la variable POST.

No tengo idea de cómo obtendría la variable POST a través de javascript porque reCAPTCHA no es en realidad una entrada.

Pero si hubiera una manera de obtener el valor de reCAPTCHA a través de javascript, entonces podría usar ajax para enviar la solicitud POST a la función.

over 4 years ago · Santiago Trujillo
1 Respuestas
Responde la pregunta

0

Si incluye las cadenas de consulta en la URL del script:

 <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"async defer></script>

entonces puede usar grecaptcha.getResponse como dice en la documentación de google reCAPTCHA:
https://developers.google.com/recaptcha/docs/display

 <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"async defer></script> <script type="text/javascript"> var verifyCallBack = function(response) { alert(response); }; var widgetId; var onloadCallback = function() { widgetId = grecaptcha.render('recaptcha', { 'sitekey' : 's', 'theme' : 'light' }); } </script> <form> <div id="recaptcha"></div> <input type="submit" name="submit" value="submit"> </form> $('form').submit(function(e) { e.preventDefault(); var response = grecaptcha.getResponse(widgetId); $.ajax({ url: 'validate_captcha.php', type: 'POST', data: {'g-recaptcha-response': response}, success: function(data) { alert(data); }, error: function(error) { alert(error); } }); });

Y luego en validate_captcha.php :

 <?php if (isset($_POST['g-recaptcha-response'])) { function CheckCaptcha($userResponse) { $fields_string = ''; $fields = array( 'secret' => 'secret_key', 'response' => $userResponse ); foreach($fields as $key=>$value) $fields_string .= $key . '=' . $value . '&'; $fields_string = rtrim($fields_string, '&'); $ch = curl_init(); curl_setopt($ch, CURLOPT_URL, 'https://www.google.com/recaptcha/api/siteverify'); curl_setopt($ch, CURLOPT_POST, count($fields)); curl_setopt($ch, CURLOPT_POSTFIELDS, $fields_string); curl_setopt($ch, CURLOPT_RETURNTRANSFER, True); $res = curl_exec($ch); curl_close($ch); return json_decode($res, true); } $result = CheckCaptcha($_POST['g-recaptcha-response']); if ($result['success']) { echo 'success'; } else { echo 'error'; } } ?>

Entonces, ahora en su javascript, puede usar la variable data dentro de success:function(data) en una declaración if:

 if(data == 'success') { registerUser(name, email, password); // not a real function, just an example }
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda