Captcha не проверяется на стороне jquery ..!

Я использую php для проверки google REcaptcha. Что касается внутренней проверки проверки gose, то она дает ошибку, если captcha не отправлен, и если все сделано, пользователь хранится в базе данных, но основная проблема возникает, когда я соединяю ее с jquery. .. все это всегда выдает ошибку «ваш недостающий captcha» каждый раз, даже если captcha подтверждается в back-end, пожалуйста, помогите мне в этом, простите меня, если я ошибаюсь .. !!

здесь gose .php file

<?php require_once 'DB_Functions.php'; $db = new DB_Functions(); // json response array $response = array("error" => false); if (!empty($_POST['fname']) && !empty($_POST['lname']) && !empty($_POST['email']) && !empty($_POST['password']) && !empty($_POST['mobile'])){ /* if required include seperate validation */ // receiving the post params $fname = trim($_POST['fname']); $lname = trim($_POST['lname']); $email = trim($_POST['email']); $password = $_POST['password']; $mobile = trim($_POST['mobile']); /* validation process starts from here */ // validate your email address if(filter_var($email, FILTER_VALIDATE_EMAIL)) { //validate your password if(strlen($password) >= 6){ //validate your mobile if(strlen($mobile) == 12){ //validate captcha //your site secret key $secret = 'XXXX_secret-key_XXXX'; if(isset($_POST['recaptchaResponse']) && !empty($_POST['recaptchaResponse'])){ //get verified response data $param = "https://www.google.com/recaptcha/api/siteverify?secret=".$secret."&response=".$_POST['recaptchaResponse']; $verifyResponse = file_get_contents($param); $responseData = json_decode($verifyResponse); if($responseData->success){ //Check for valid email address if ($db->isUserExisted($email)) { // user already existed $response["error"] = true; $response["error_msg"] = "User already existed with " . $email; echo json_encode($response); }elseif($db->isMobileNumberExisted($mobile)) { //user already existed $response["error"] = true; $response["error_msg"] = "user already existed with" . $mobile; echo json_encode($response); }else{ // create a new user $user = $db->storeUser($fname, $lname, $email, $password, $mobile); if ($user) { // user stored successfully $response["error"] = false; $response["uid"] = $user["id"]; $response["user"]["fname"] = $user["fname"]; $response["user"]["lname"] = $user["lname"]; $response["user"]["email"] = $user["email"]; $response["user"]["created_at"] = $user["created_at"]; $response["user"]["updated_at"] = $user["updated_at"]; echo json_encode($response); } else { // user failed to store $response["error"] = true; $response["error_msg"] = "Unknown error occurred in registration!"; echo json_encode($response); } } }else{ //failed to submit captcha $response["error"] = true; $response["error_msg"] = "Sorry this application is not for bots"; echo json_encode($response); } }else{ //failed to submit captcha $response["error"] = true; $response["error_msg"] = "your missing captcha"; echo json_encode($response); } }else{ //invalid mobile number $response["error"] = true; $response["error_msg"] = "Mobile number is invalid!"; echo json_encode($response); } }else{ //min of 6-charecters $response["error"] = true; $response["error_msg"] = "password must be of atleast 6-characters!"; echo json_encode($response); } }else{ // invalid email address $response["error"] = true; $response["error_msg"] = "invalid email address"; echo json_encode($response); } }else{ //missing the required fields $response["error"] = true; $response["error_msg"] = "Please fill all the required parameters!"; echo json_encode($response); } ?>

Вот gose .html файл в bootstrap

  <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>MiiSKy | Register</title> <script src="https://www.google.com/recaptcha/api.js" async defer></script> <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript" src = "register.js"></script> <link href="css/bootstrap.min.css" rel="stylesheet"> <link href="font-awesome/css/font-awesome.css" rel="stylesheet"> <link href="css/plugins/iCheck/custom.css" rel="stylesheet"> <link href="css/animate.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> <script src='https://www.google.com/recaptcha/api.js'></script> </head> <body class="gray-bg"> <div class="middle-box text-center loginscreen animated fadeInDown"> <div> <div> <!--<h3 class="logo-name">MiiSky</h3>--> <img src="img/landing/mii-logo.png"> </div> <!--<h3>Register to MiiSky</h3>--> <p>Create account to see it in action.</p> <form method = "POST" name = "register" id = "register" class="mt" role="form" action="login.html"> <div class="form-group"> <input type="text" name = "fname" id = "fname" class="form-control" placeholder="First Name" required=""> </div> <div class="form-group"> <input type="text" name = "lname" id = "lname" class="form-control" placeholder="Last Name" required=""> </div> <div class="form-group"> <input type="email" name = "email" id = "email" class="form-control" placeholder="Email" required=""> </div> <div class="form-group"> <input type="password" name = "password" id = "password" class="form-control" placeholder="Password" required=""> </div> <div class="form-group"> <input type="mobile" name = "mobile" id = "mobile" class="form-control" placeholder="Mobile No" required=""> </div> <div class="form-group" id="recaptcha_widget"> <div class="required"> <div class="g-recaptcha" data-sitekey="XXXXX_site-key_XXXXXX"></div> <!-- End Thumbnail--> </div> </div> <button type="submit" name = "submit" id = "submit" class="btn btn-primary block full-width mb">Register</button> <p class="text-muted text-center"><small>Already have an account?</small></p> <a class="btn btn-sm btn-white btn-block" href="login.html">Login</a> </form>

здесь gose главный .js файл

  $(document).ready(function(){ //execute's the function on click $("#submit").click(function(e){ var recaptchaResponse = grecaptcha.getResponse(); var status = $('form')[0].checkValidity(); if(status){ /*jquery to call the url requested and parse the data in json*/ $.ajax({ url: "process.php", type: "POST", data: { fname: $("#fname").val(), lname: $("#lname").val(), email: $("#email").val(), password: $("#password").val(), mobile: $("#mobile").val(), recaptchaResponse: recaptchaResponse }, async: false, dataType: "JSON", /*Give out the alert box to display the results*/ success: function (json){ if(json.error){ alert(json.error_msg); grecaptcha.reset(); e.preventDefault(); }else{ alert("Registeration successful!",json.user.email); $('#register').submit(); } }, error: function(jqXHR, textStatus, errorThrown){ alert(errorThrown); } }); } }); });

Related of "Captcha не проверяется на стороне jquery ..!"

Прежде всего убедитесь, что вы включили необходимый ресурс JavaScript для правильного отображения виджета reCAPTCHA, например:

 <html> <head> <title>reCAPTCHA demo: Simple page</title> <script src="https://www.google.com/recaptcha/api.js" async defer></script> </head> <body> <form action="?" method="POST"> <div class="g-recaptcha" data-sitekey="your_site_key"></div> <br/> <input type="submit" value="Submit"> </form> </body> </html>

Вот ссылка:

Отображение виджета

Теперь приходит ответ вашего пользователя. Ответ на вызов captcha пользователя можно получить тремя способами. Это может быть как,

g-recaptcha-response – параметр POST в представленной форме
grecaptcha.getResponse (widget_id) – предоставит ответ после того, как пользователь завершит перехват.
Строковый аргумент функции обратного вызова, указанный в объекте конфигурации, переданном методу визуализации.

Вот ссылка:

Проверка ответа пользователя

Для этого используйте grecaptcha.getResponse (), чтобы получить ответ пользователя.

И в качестве sidenote используйте grecaptcha.reset (), чтобы попросить конечного пользователя снова проверить с помощью reCAPTCHA. Из руководства:

Если ваш веб-сайт выполняет проверку на стороне сервера с использованием запроса AJAX, вы должны только проверить маркер ответа reCAPTCHA пользователя ( g-recaptcha-response ) один раз. Если попытка проверки была сделана с определенным токеном, ее нельзя использовать снова. Вам нужно будет позвонить grecaptcha.reset (), чтобы попросить конечного пользователя снова проверить с помощью reCAPTCHA.

Вот ваш код HTML :

 <form method = "POST" name = "register" id = "register" class="mt" role="form" action="login.html"> <div class="form-group"> <input type="text" name = "fname" id = "fname" class="form-control" placeholder="First Name" required=""> </div> <div class="form-group"> <input type="text" name = "lname" id = "lname" class="form-control" placeholder="Last Name" required=""> </div> <div class="form-group"> <input type="email" name = "email" id = "email" class="form-control" placeholder="Email" required=""> </div> <div class="form-group"> <input type="password" name = "password" id = "password" class="form-control" placeholder="Password" required=""> </div> <div class="form-group"> <input type="mobile" name = "mobile" id = "mobile" class="form-control" placeholder="Mobile No" required=""> </div> <div class="form-group" id="recaptcha_widget"> <div class="required"> <div class="g-recaptcha" data-sitekey="XXXXXX_SITE-KEY_XXXXXXX"></div> <!-- End Thumbnail--> </div> </div> <button type="submit" name = "submit" id = "submit" class="btn btn-primary block full-width mb">Register</button> </form> <p class="text-muted text-center"><small>Already have an account?</small></p> <a class="btn btn-sm btn-white btn-block" href="login.html">Login</a>

Ваш jQuery должен выглядеть следующим образом:

 $(document).ready(function(){ //execute's the function on click $("#submit").click(function(e){ var recaptchaResponse = grecaptcha.getResponse(); var status = $('form')[0].checkValidity(); if(status){ /*jquery to call the url requested and parse the data in json*/ $.ajax({ url: "process.php", type: "POST", data: { fname: $("#fname").val(), lname: $("#lname").val(), email: $("#email").val(), password: $("#password").val(), mobile: $("#mobile").val(), recaptchaResponse: recaptchaResponse }, async: false, dataType: "JSON", /*Give out the alert box to display the results*/ success: function (json){ if(json.error){ alert(json.error_msg); grecaptcha.reset(); e.preventDefault(); }else{ alert("Registeration successful!",json.user.email); $('#register').submit(); } }, error: function(jqXHR, textStatus, errorThrown){ alert(errorThrown); } }); } }); });

И, наконец, ваш PHP должен выглядеть так:

 <?php // your code //your site secret key $secret = 'XXXXXXX_Secret-key_XXXXXXX'; if(isset($_POST['recaptchaResponse']) && !empty($_POST['recaptchaResponse'])){ //get verified response data $param = "https://www.google.com/recaptcha/api/siteverify?secret=".$secret."&response=".$_POST['recaptchaResponse']; $verifyResponse = file_get_contents($param); $responseData = json_decode($verifyResponse); if($responseData->success){ // success }else{ // failure } } // your code ?>