javascript - window grecaptcha getresponse
Invisible reCaptchaでjqueryボタンを保護する方法は? (2)
私はユーザーに迷惑をかけずにボットからjqueryボタンを保護したいので、私はそれにGoogleの目に見えないrecaptchaを追加することを考えた。 しかし、実装は私と同じくらい簡単ではないし、私はそれを行うように見えることはできません。 誰かが私にそれがどのように行われているかを示すことができれば、それは素晴らしいことでしょう。 PS:私はワードプレスのテーマでこれをやっています。
これはドキュメントです:
https://developers.google.com/recaptcha/docs/invisible
Invisible recaptchaを作成する:
https://www.google.com/recaptcha/admin#beta
そして、これは私が持っているものです:
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);
最初からコーディングが複雑であると思われる場合は、Invisible reCaptcha for WordPressプラグインを使用して簡単に行うことができます。 また、プラグインのソースコードを掘り下げて、実装についてのアイデアを得ることもできます。
このプラグインにはカスタム操作のためのアクションとフィルタがあり、プラグインのホームページに記載されています。
私はreCaptchaを試してみました。
https://developers.google.com/recaptcha/docs/invisibleに従って、 grecaptcha.getResponse
メソッドを使用してAJAX呼び出しに送信することができます。 (しかし、このreCaptcha APIはまだベータ版であり、変更可能かもしれないことに注意してください...)ここでは簡単な例を示します:
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://.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);
}
?>
あなたがcURLを使用できるかどうかはわかりませんでした。 だから、私は基本的なPHPコードに固執することにしました。 あなたはまた、エラーをフォーマットする必要がありますが、私はあなたがポイントを得るべきだと思う。