reCAPTCHAの導入からほぼ1年・・。
なんと去年の10月末にreCAPTCHA v3が公開されてた\(^o^)/
公式サイト:https://www.google.com/recaptcha/intro/v3.html
デベロッパーサイト:https://developers.google.com/recaptcha/docs/v3
reCAPTCHA v3はすごいです!なんとあの地味〜に大変だった画像選択がないのです!
閲覧者のページ内での動きをスコアとして算出して、人かbotか判断するという・・すごい。賢い。
設置したページにはアイコンが表示されるだけ。実にシンプル。
設置方法もreCAPTCHA v2とほぼ変わりません。
Step 1:サイトを登録しキーを取得する
公式サイトで利用するサイトを登録して、APIキーを取得します。
キーは、Site key(サイトキー)とSecret key(シークレットキー)の2つが必要になります。
Step 2:フロントエンド
トークンをサーバー側に渡す必要があります。なので、トークンを取得したら「g-recaptcha-response」名でセットし、submitします。
※例ではjQueryを利用しています。
<script src='https://www.google.com/recaptcha/api.js?render=サイトキー'></script>
<script>
$(function(){
$('.button_send').click(function(e) {
grecaptcha.ready(function() {
grecaptcha.execute('サイトキー', {action:'アクション名'}).then(
function(token) {
$('#gToken').val( token );
$('#form1').submit();
},
function() {
console.log( 'token error!' );
}
);
});
});
});
</script>
<form id="form1" action="./app.php" method="POST">
<input type="hidden" name="g-recaptcha-response" id="gToken" value="">
<input type="button" value="Submit" class="button_send">
</form>
アクションは4種類です。利用するものを指定してください。
Recommendation
See a cohesive view of your traffic on the admin console while filtering scrapers.login
With low scores, require 2-factor-authentication or email verification to prevent credential stuffing attacks.social
Limit unanswered friend requests from abusive users and send risky comments to moderation.e-commerce
Put your real sales ahead of bots and identify risky transactions.
Step 3:バックエンド
今回もPHPで受け取ります。scoreの値が人かbotかの判定値です。0.0〜1.0で値が低いほどbot判定になるそうです。ちょうどbotと人との境目が0.5ということなので、0.5以下は弾くようにします。
<?php
$gres = isset( $_POST['g-recaptcha-response'] ) ? $_POST['g-recaptcha-response'] : '';
$ip = isset( $_SERVER['REMOTE_ADDR'] ) ? $_SERVER['REMOTE_ADDR'] : '';
$data = array(
'secret' => 'シークレットキー',
'response' => $gres,
'remoteip' => $ip
);
$curl = curl_init();
curl_setopt( $curl, CURLOPT_URL, 'https://www.google.com/recaptcha/api/siteverify' );
curl_setopt( $curl, CURLOPT_POST, true );
curl_setopt( $curl, CURLOPT_POSTFIELDS, http_build_query( $data ) );
curl_setopt( $curl, CURLOPT_SSL_VERIFYPEER, false );
curl_setopt( $curl, CURLOPT_RETURNTRANSFER, true );
$res = curl_exec( $curl );
$captcha = json_decode( $res );
if ( $captcha->success == false )
{
echo '認証に失敗しました。';
}
else if ( $captcha->score <= 0.5 )
{
echo '認証に失敗しました。';
}
else
{
echo '認証に成功しました。';
}
?>
scoreの値について色々試した方がいらっしゃいました。ご参考にどうぞ。
reCAPTCHA v3 入れてみた