今回の記事では、HTMLとPHPで作られたフォームにreCAPTCHA v3を導入する方法を解説していきます。
reCAPTCHAの管理画面を開く
reCAPTCHAのページから管理画面にアクセスします。
サイトのURLを登録
ラベルを設定してサイトのドメインを登録します。
サイトキーとシークレットキーを取得
設定を開いてください。
サイトキーとシークレットキーをコピーします。
reCAPTCHAを導入するための準備はこれでOKです。
head内にreCAPTCHAのスクリプトを入れる
index.html
<script src="https://www.google.com/recaptcha/api.js?render=ここにサイトキー"></script>
フォーム内にinputタグを追加
index.html
<input type="hidden" name="recaptcha_response" id="recaptchaResponse">
フォームのHTMLファイルにJavaScriptのコードを追加
index.html
<script>
grecaptcha.ready(function() {
grecaptcha.execute('ここにサイトキー', {action: 'submit'}).then(function(token) {
var recaptchaResponse = document.getElementById('recaptchaResponse');
recaptchaResponse.value = token;
});
});
</script>
送信先のPHPファイルにreCAPTCHAスコアを判定する処理を入れる
form.php
// reCAPTCHAのシークレットキー
$secretKey = 'ここにシークレットキー';
// reCAPTCHAのレスポンス
$recaptcha_response = $_POST['recaptcha_response'];
// APIリクエスト
$verifyResponse = file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret={$secretKey}&response={$recaptcha_response}");
// APIレスポンス確認
$responseData = json_decode($verifyResponse);
if ($responseData->score < 0.2) {
$score = isset($responseData->score) ? $responseData->score : 'No Score';
echo "invalid request: {$score}<br>"; // 失敗
exit; // 処理を停止
}
今回は以上です。