javascript - site - ReCaptcha 2.0 con AJAX
recaptcha v2 (1)
Ok, esto era bastante tonto.
He hecho un par de cosas mal:
- En el archivo PHP, todas las cadenas tenían comillas simples, y eso causaba problemas.
- A lo largo de las pruebas, agregué varias impresiones de cosas en el archivo PHP, por lo que el
if (status == "ok")
nunca funcionó. Recibí los correos electrónicos, pero no obtuve ninguna confirmación de lo que hice y ahora veo por qué. - Cuando quise comprobar qué omitía el archivo PHP, simplemente fui a su dirección en la URL y siempre recibía un error. Incluso cuando los correos fueron enviados. Ahora entiendo que esa no es la forma correcta de verificar los registros.
Gracias a @Samurai que me ayudó a resolver las cosas.
Código PHP final:
<?php
// assemble the message from the POST fields
// getting the captcha
$captcha = "";
if (isset($_POST["g-recaptcha-response"]))
$captcha = $_POST["g-recaptcha-response"];
if (!$captcha)
echo "not ok";
// handling the captcha and checking if it''s ok
$secret = "MY_SECRET";
$response = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secret."&response=".$captcha."&remoteip=".$_SERVER["REMOTE_ADDR"]), true);
// if the captcha is cleared with google, send the mail and echo ok.
if ($response["success"] != false) {
// send the actual mail
@mail($email_to, $subject, $finalMsg);
// the echo goes back to the ajax, so the user can know if everything is ok
echo "ok";
} else {
echo "not ok";
}
?>
He logrado que ReCaptcha 2.0 funcione en mi sitio web. Sin embargo, solo funciona cuando no uso AJAX y dejo que el formulario se envíe "naturalmente".
Quiero enviar el formulario con el captcha y alertar al usuario con una nota de éxito sin actualizar la página .
Probé el siguiente código, pero parece que el servidor no recibe la respuesta del usuario:
HTML:
<form class="form" action="javascript:void(0)" novalidate>
<!-- all the inputs... -->
<!-- captcha -->
<div class="input-group">
<div class="g-recaptcha" data-sitekey="6LdOPgYTAAAAAE3ltWQGar80KUavaR-JblgPZjDI"></div>
</div>
<div class="errors" id="errors" style="display: none"></div>
<div class="input-group">
<input type="button" value="Send" class="btn-default right" id="submit">
<div class="clear"></div>
</div>
</form>
JS:
$(''#submit'').click(function(e) {
console.log(''clicked submit''); // --> works
var $errors = $(''#errors''),
$status = $(''#status''),
name = $(''#name'').val().replace(/<|>/g, ""), // prevent xss
email = $(''#email'').val().replace(/<|>/g, ""),
msg = $(''#message'').val().replace(/<|>/g, "");
if (name == '''' || email == '''' || msg == '''') {
valid = false;
errors = "All fields are required.";
}
// pretty sure the problem is here
console.log(''captcha response: '' + grecaptcha.getResponse()); // --> captcha response:
if (!errors) {
// hide the errors
$errors.slideUp();
// ajax to the php file to send the mail
$.ajax({
type: "POST",
url: "http://orenurbach.com/assets/sendmail.php",
data: "email=" + email + "&name=" + name + "&msg=" + msg + "&g-recaptcha-response=" + grecaptcha.getResponse()
}).done(function(status) {
if (status == "ok") {
// slide down the "ok" message to the user
$status.text(''Thanks! Your message has been sent, and I will contact you soon.'');
$status.slideDown();
// clear the form fields
$(''#name'').val('''');
$(''#email'').val('''');
$(''#message'').val('''');
}
});
} else {
$errors.text(errors);
$errors.slideDown();
}
});
PHP:
<?php
// assemble the message from the POST fields
// getting the captcha
$captcha = '''';
if (isset($_POST[''g-recaptcha-response'']))
$captcha = $_POST[''g-recaptcha-response''];
echo ''captcha: ''.$captcha;
if (!$captcha)
echo ''The captcha has not been checked.'';
// handling the captcha and checking if it''s ok
$secret = ''MY_SECRET'';
$response = json_decode(file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=".$secret."&response=".$captcha."&remoteip=".$_SERVER[''REMOTE_ADDR'']), true);
var_dump($response);
// if the captcha is cleared with google, send the mail and echo ok.
if ($response[''success''] != false) {
// send the actual mail
@mail($email_to, $subject, $finalMsg);
// the echo goes back to the ajax, so the user can know if everything is ok
echo ''ok'';
} else {
echo ''not ok'';
}
?>
El resultado en la página de PHP:
captcha: The captcha has not been checked.array(2) { ["success"]=> bool(false) ["error-codes"]=> array(1) { [0]=> string(22) "missing-input-response" } } not ok
La conclusión es, ¿cómo puedo obtener la respuesta de entrada manualmente sin que vaya automáticamente con el resto de los datos de la POST?