Jak chronić przycisk jquery za pomocą Invisible reCaptcha?

Question

Chcę chronić mój przycisk jquery przed botami bez irytowania użytkowników, więc pomyślałem o dodaniu do niego niewidocznej recaptcha google. Jednak implementacja nie jest tak łatwa jak ja i nie mogę tego zrobić. Jeśli ktokolwiek może mi pokazać, jak to się robi, byłoby wspaniale. PS: Robię to na temat wordpress.

Jest to dokumentacja:

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

Tworzenie niewidzialną Odśwież:

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

I to jest to, co mam:

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); 

Answer 1

Można użyć Invisible reCaptcha for WordPress wtyczki to zrobić łatwo, jeśli uważasz, że kodowanie od podstaw jest skomplikowane dla Ciebie. Możesz także zagłębić się w kod źródłowy wtyczki, aby uzyskać informacje na temat implementacji.

Ta wtyczka ma działania i filtry do niestandardowego użytku i są one udokumentowane na stronie głównej wtyczki.

Answer 2

Poszedłem do przodu, aby eksperymentować z reCaptcha.

Okazuje się, że zgodnie z API, możesz użyć metody grecaptcha.getResponse, aby przesłać do swojego wywołania AJAX. (Ale Zauważ, że ten reCaptcha API jest jeszcze w fazie beta i może się zmienić ...) Oto krótki przykład:

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); 
} 
?> 

Nie byłem pewien, czy można użyć cURL. Więc postanowiłem po prostu trzymać się podstawowego kodu PHP. Powinieneś również sformatować błędy, ale myślę, że powinieneś to zrozumieć.