2016-10-21 17 views
5

Tôi đã theoGoogle reCAPTCHA hiển thị với hình ảnh & Client Side Validation trên Form Gửi

How to Validate Google reCaptcha on Form Submit

tôi có dưới đây mã trong tôi index.php

<!DOCTYPE HTML> 
<html> 
    <head> 
     <script src='https://www.google.com/recaptcha/api.js'></script> 
    </head> 
    <body> 
     <form method="post" action="post.php"> 
      <div class="g-recaptcha" data-sitekey="6XXXXXXXXXXXXwdsf0K8HbXXXXXXX"></div> 
      <input type="submit" value="Submit" /> 
     </form> 
    </body> 
</html> 

post.php

$response = $_REQUEST['g-recaptcha-response']; 
$secret = '6XXXXXXXXXXXXwdsf0K8HbJNvMw-XXXX'; 
$server = $_SERVER['REMOTE_ADDR']; 

$response = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret=" . $secret . "&response=" . $response.'&remoteip='.$server); 
$response = json_decode($response, true); 
if ($response["success"] === true) { 
    echo "Logged In Successfully"; 
} else { 
    echo "You are a robot"; 
} 
exit; 

Mã trên đang hoạt động tốt.

Cách xác thực phía khách hàng? Nó không hiển thị hình ảnh xác thực với tùy chọn hình ảnh.

enter image description here

tôi đã được thực hiện dưới đây

enter image description here

+0

tệp post.php của bạn đang thực hiện xác thực bên clinet? – nogad

+0

Nope server side –

+0

wel i dont thực sự biết những gì bạn yêu cầu. – nogad

Trả lời

1

Đây là hành vi tiêu chuẩn của thư viện ảnh xác thực lại không hiển thị lần đầu tiên kiểm soát đối với hình ảnh.

Cố gắng xem hoặc đăng trang nhiều lần và bạn sẽ thấy rằng hình ảnh cuối cùng không xuất hiện.

Nếu bạn muốn thực hiện xác thực phía máy khách trên các trường bổ sung khác, bạn phải sử dụng thư viện jQuery hoặc thư viện như bootstrap hoặc nền tảng, như this hoặc this. Bạn có thể xem ví dụ đầy đủ của một tập lệnh làm việc tại đây (lấy cảm hứng từ kịch bản lệnh khởi động và khả năng HTML 5):

Phiên bản này giống nhau trên Internet. Không có xác nhận phía khách hàng hơn cho việc này! Có một cái nhìn vào một tài liệu tham khảo: codepen.io signup

Ví dụ:

<!DOCTYPE HTML> 
<html> 
    <head> 
     <link href="../../dist/css/bootstrap.min.css" rel="stylesheet"> 
     <script src='https://www.google.com/recaptcha/api.js'></script> 
    </head> 
    <body> 
     <form class="signin-form" method="post" action="post.php"> 
      <!-- for example : Email and password validation (HTML 5) --> 
      <label for="inputEmail" class="sr-only">Email address</label> 
      <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus> 
      <label for="inputPassword" class="sr-only">Password</label> 
      <input type="password" id="inputPassword" class="form-control" placeholder="Password" required> 
      <!-- Site-key for automated tests --> 
      <div class="g-recaptcha" data-sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI"></div> 
      <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button> 
     </form> 
    </body> 
</html> 

here một mẫu mã bút.

+0

Bạn có thời gian để kiểm tra không? –

Các vấn đề liên quan