2017-02-11 15 views
16

Tôi muốn bảo vệ nút jquery của mình khỏi các chương trình mà không gây phiền nhiễu cho người dùng, vì vậy tôi đã nghĩ đến việc thêm biểu tượng ẩn hình vô hình của google vào đó. Tuy nhiên thực hiện không phải là dễ dàng như tôi mặc dù và tôi dường như không thể làm điều đó. Nếu bất cứ ai có thể chỉ cho tôi cách nó được thực hiện nó sẽ là tuyệt vời. PS: Tôi đang làm điều này trên một chủ đề wordpress.Làm thế nào để bảo vệ nút jquery với InCaptcha vô hình?

Đây là tài liệu:

https://developers.google.com/recaptcha/docs/invisible

Tạo reCAPTCHA vô hình:

https://www.google.com/recaptcha/admin#beta

Và đây là những gì tôi có:

HTML:

<button class="acf-get-content-button">Show Link</button> 
<div class="fa" id="acf-content-wrapper" data-id="<?php echo $post_id; ?>"></div> 

JS:

<script> 
(function($) { 
    $('.acf-get-content-button').click(function(e) { 
    e.preventDefault(); 
    $('.fa').addClass('fa-cog fa-spin fa-4x'); 
    var $contentWrapper = $('#acf-content-wrapper'); 
    var postId = $contentWrapper.data('id'); 

    $.ajax({ 
     url: "/public/ajax.php", 
     type: "POST", 
     data: { 
      'post_id': postId 
     }, 
     }) 
     .done(function(data) { 
     $('.fa').removeClass('fa-cog fa-spin fa-4x'); 
     $contentWrapper.append(data); 
     $('.acf-get-content-button').removeClass().addClass('.acf-get-content-button') 
     }); 
    }); 
    $('.acf-get-content-button').mouseup(function() { 
    if (event.which == 1) { 
     $(".acf-get-content-button").hide(); 
    } 
    }); 
})(jQuery); 
</script> 

ajax.php

<?php 
define('WP_USE_THEMES', false); 
require_once($_SERVER['DOCUMENT_ROOT'] . '/wp-load.php'); 
global $post; 
$post_id = $_REQUEST["post_id"]; 
$content = get_field('ebook_link_pdf', $post_id); 
echo ($content); 
+0

Bạn nên sử dụng nonce với ajax trong wordpress, điều đó chắc chắn sẽ trợ giúp với bot. –

Trả lời

6

Bạn có thể sử dụng Invisible reCaptcha for WordPress plugin để làm điều đó một cách dễ dàng nếu bạn nghĩ mã hóa từ đầu là phức tạp đối với bạn. Bạn cũng có thể tìm hiểu mã nguồn của plugin để có ý tưởng về việc triển khai.

Plugin này có tác vụ và bộ lọc để sử dụng tùy chỉnh và các tài liệu này được ghi lại trên trang chủ plugin.

+0

Xin cảm ơn cho đầu vào. Làm thế nào để tôi xử lý thực tế rằng tôi chỉ là một nút và không phải là một hình thức? –

3

Tôi đã tiếp tục thử nghiệm với reCaptcha.

Tắt theo số API, bạn có thể sử dụng phương thức grecaptcha.getResponse để gửi đến cuộc gọi AJAX của mình. (Nhưng Lưu ý rằng API reCaptcha này vẫn còn trong phiên bản beta và có thể thay đổi ...) Dưới đây là một ví dụ ngắn:

HTML:

<div id="test-captcha" class="g-recaptcha" data-sitekey=[Your site key]></div> 
<button id="load" onclick="go();">Load something</button> 

Javascript:

function go() 
{ 
    $.ajax({ 
     url: "/captchatest.php", 
     type: "POST", 
     data: { 
      'g-recaptcha-response': grecaptcha.getResponse() 
     } 
    }).done(function(data) { 
     alert(data); 
    }); 
} 

captchatest.php

<?php 
//Used http://stackoverflow.com/a/6609181/7344257 
function do_post_request($url, $data) 
{ 
    // use key 'http' even if you send the request to https://... 
    $options = array(
      'http' => array(
        'header' => "Content-type: application/x-www-form-urlencoded\r\n", 
        'method' => 'POST', 
        'content' => http_build_query($data) 
      ) 
    ); 
    $context = stream_context_create($options); 
    $result = file_get_contents($url, false, $context); 
    if ($result === FALSE) { /* Handle error */ } 
    return $result; 
} 

$error = ""; 
if ($_SERVER["REQUEST_METHOD"] === "POST") 
{ 
    if (!isset($_POST['g-recaptcha-response'])) 
    { 
     echo "Please do reCaptcha"; 
     exit(0); 
    } 

    $data = array("secret" => "6LeUGhYUAAAAABNS5OtOc9vonTlyrtgcQ5VdI7cV", 
       "response" => $_POST['g-recaptcha-response'], 
       "remoteip" => $_SERVER["REMOTE_ADDR"] //This is optional. 
    ); 
    $resp = json_decode(do_post_request("https://www.google.com/recaptcha/api/siteverify", $data)); 
    if (!$resp->success) 
    { 
     //use $resp->error-codes to debug error. 
     echo "Invalid reCaptcha"; 
     exit(0); 
    } 
    echo "Received secret code."; 
    exit(0); 
} 
?> 

Tôi không chắc liệu bạn có thể sử dụng cURL hay không. Vì vậy, tôi quyết định chỉ gắn bó với mã PHP cơ bản. Bạn cũng sẽ phải định dạng các lỗi, nhưng tôi nghĩ bạn sẽ nhận được điểm.

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