問い合わせフォームからのスパムをGoogle reCAPTCHAを導入で一網打尽!スパム来なくなりました!
2019-07-06 788 1943▽お問い合わせフォームのBot攻撃が年々増加している
▽reCAPTCHA(リキャプチャ)v3の設置方法
▽[v3]設置手順1「まずはフォームのHTMLにreCAPTCHA設置コードを追加」
▽[v3]設置手順2「次にフォームタグ内にhiddenのinputタグを追加」
▽[v3]設置手順3「PHP側の先頭にコードを追加」
▽[v2]設置手順1「まずはフォームのHTMLにreCAPTCHAのAPIを読み込む」
▽[v2]設置手順2「フォームのボタンの辺りに認証チェックフォームを設置」
▽[v2]設置手順3「PHP側の先頭にコードを追加」
▽reCAPTCHA(リキャプチャ)設置のご依頼
▽reCAPTCHA(リキャプチャ)v3の設置方法
▽[v3]設置手順1「まずはフォームのHTMLにreCAPTCHA設置コードを追加」
▽[v3]設置手順2「次にフォームタグ内にhiddenのinputタグを追加」
▽[v3]設置手順3「PHP側の先頭にコードを追加」
▽[v2]設置手順1「まずはフォームのHTMLにreCAPTCHAのAPIを読み込む」
▽[v2]設置手順2「フォームのボタンの辺りに認証チェックフォームを設置」
▽[v2]設置手順3「PHP側の先頭にコードを追加」
▽reCAPTCHA(リキャプチャ)設置のご依頼
<お問い合わせフォームのBot攻撃が年々増加している>
クライアントから、スパムメールが頻繁に届くようになったと連絡があり、
お問い合わせフォームにスパム対策を導入することに。
ロシア、中国、アメリカなどなどの業者が多いと思われるのですが、
フォームのURLを自動でかき集めて、自動で送信させるという悪さを仕掛けてきます。
スパムメールにはURLが記載されており、単なるサイトの宣伝行為が目的であることが多いです。
お問い合わせフォームを狙ったBot攻撃は昔からあることなのですが、年々ひどくなっています。
コンバーション率を測定している注文フォームが攻撃された場合は、コンバージョンのデータが正しく得られません。ビジネスの邪魔にもなってくるので、スパムBot対策は基本として導入しなければいけません。
フォームのBot対策で有名なのは無料で使用ができるgoogle様の「reCAPTCHA(リキャプチャ)」というサービス。設置が比較的簡単なので、システムに詳しくない人でもreCAPTCHAは設置できると思います。
googleのリキャプチャにはバージョン2と3があります。
reCAPTCHA v2(ユーザーに認証のチェックを押させる)
reCAPTCHA v3(画面右下に保護マークが表示されるだけ)
個人的にはリキャプチャv3を導入した方が良いかなと思います。
リキャプチャv2は「信号をクリック」「看板をクリック」など、googleのディープラーニングのお手伝いをさせられる時があるので、ユーザーの問い合わせ率が下がりそうです。
リキャプチャv3とリキャプチャv2は設置コードが全然違います。
まずはオススメのリキャプチャv3の方から見ていきましょう。
「フォームHTML」と「メール送信PHP」の2つのファイルを編集します。
<reCAPTCHA(リキャプチャ)v3の設置方法>
reCAPTCHAに登録して管理画面へ
https://www.google.com/recaptcha/intro/v3.html
「+」のマークをクリックして、設置するサイトのドメインなどを入力してください。
登録ができましたら「サイトキー」と「シークレットキー」が表示されます。
この情報は、管理画面でいつでも見れますので、メモる必要はありません。後ほどコピペで使います。
[v3]設置手順1「まずはフォームのHTMLにreCAPTCHA設置コードを追加」
※2019年7月 動作確認済み
//reCAPTCHA v3私はjquery関連をHTMLコードの一番下に一括で記載することが多いので、上記をそのままコピペしています。
<!----><!----><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!----><!----><script src="https://www.google.com/recaptcha/api.js?render=サイトキー"></script>
<!----><!----><script>
grecaptcha.ready(function () {
grecaptcha.execute('サイトキー', {action: 'homepage'}).then(function(token) {
var recaptchaResponse = document.getElementById('recaptchaResponse');
recaptchaResponse.value = token;
});
});
</script>
recaptcha/api.jsはjquery本体の次に読み込むなら、どの部分に記載しても問題ありません。
[v3]設置手順2「次にフォームタグ内にhiddenのinputタグを追加」
<!----><!----><form method="post" action="xxxxx.php">hiddenのinputタグはformタグ内であればどこでもいいです。
<input type="hidden" name="recaptchaResponse" id="recaptchaResponse">
・
・
・
</form>
これでHTML側の実装は終わりです。
次はformタグのactionに指定しているPHP側のコードを編集します。
下記のコードをコピペするだけで完了するので非常に簡単です。
[v3]設置手順3「PHP側の先頭にコードを追加」
<?phpPHPの先頭に記述すればいいかなと思います。エラー時の処理は、Botではないのにエラーが出る時が度々ありますので、その場合はブラウザの戻るで戻ってもらい、再度送信ボタンを押してもらうようナビゲーションを出しています。この部分はエラー時の処理を自由に改良してください。
//reCAPTCHA v3の処理
if(isset($_POST['recaptchaResponse']) && !empty($_POST['recaptchaResponse'])){
$secret = 'シークレットキー';
$verifyResponse = file_get_contents('https://www.google.com/recaptcha/api/siteverify?secret='.$secret.'&response='.$_POST['recaptchaResponse']);
$reCAPTCHA = json_decode($verifyResponse);
if (!$reCAPTCHA->success){
echo "送信エラーになりました。ブラウザの戻るボタンを押して、再度ご送信お願いします。";
exit;
}
}else{
echo "送信エラーになりました。ブラウザの戻るボタンを押して、再度ご送信お願いします。";
exit;
}
//以降はメール送信処理のコード
・
・
・
?>
以上で設置完了となります。テスト送信をして無事に送信されればもう大丈夫です。
Botによるスパムメールがほとんど届かなくなります。
<reCAPTCHA(リキャプチャ)v2の設置方法>
[v2]設置手順1「まずはフォームのHTMLにreCAPTCHAのAPIを読み込む」
<!----><!----><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
//jquery読み込み後にrecaptchaを読み込む
<!----><!----><script src="https://www.google.com/recaptcha/api.js" async defer></script>
[v2]設置手順2「フォームのボタンの辺りに認証チェックフォームを設置」
//認証チェックのフォームが表示されます
<div class="g-recaptcha" data-callback="clearcall" data-sitekey="サイトキー"></div>
設置手順おまけ ※これは必須ではありません。
<!----><!----><script>
//認証にチェックされたら送信ボタンを表示する
function clearcall(code) {
if(code !== ""){
$('.submit-btn').fadeIn();
}
}
</script>
[v2]設置手順3「PHP側の先頭にコードを追加」
<?php
//reCAPTCHA v2の処理
$recaptcha = htmlspecialchars($_POST["g-recaptcha-response"],ENT_QUOTES,'UTF-8');
if(isset($recaptcha)){
$captcha = $recaptcha;
}else{
$captcha = "";
exit;
}
$secretKey = "シークレットキー";
$resp = @file_get_contents("https://www.google.com/recaptcha/api/siteverify?secret={$secretKey}&response={$captcha}");
$resp_result = json_decode($resp,true);
if(intval($resp_result["success"]) !== 1) exit; //認証失敗時はここで終了
//以降はメール送信処理のコード
・
・
・
?>
以上で、テスト送信をして無事に届けばreCAPTCHA(リキャプチャ)v2の設置完了です。
<reCAPTCHA(リキャプチャ)設置のご依頼>
法人・個人事業主の方で、お問い合わせフォームからのスパムにお悩み方はご連絡ください。
リーズナブルでかつ、どこよりも早く対応致します。土・日・祝日もメール対応可です。
お問い合わせフォームのスパム対策の料金
お問い合わせフォーム スパム対策のみ … 4,000円(税別)
お問い合わせフォームの設置(入力項目10以内) … 12,000円(税別)
私の個人事業サイトの一番下にある問い合わせフォームからお気軽にどうぞ。
お問い合わせフォームのスパム対策