スパムコメント激減！reCaptChaの導入

ブログでコメントを受け付けていると、記事とは関係のないurlの列記や自社商品のリンクを配したいわゆるスパムコメントに悩まされます。こんな時は、googleのreCaptcha(リキャプチャ)を導入したい。

スパムコメントを撃退！ reCaptchaを導入する

当方でも、スパム防止のプラグインAkismet Anti-Spamは導入済みですが、reCaptchaを導入後は、スパムコメントが激減いやほぼ無くなりました。今回こちらで導入したのは、プラグインも使わずに、いくつかのファイルを直接編集するものです。そんなに難しくはなかったので、これを読んで導入してみてはいかかでしょうか？ここから先に進める場合は、Googleのアカウントが必要ですので、もしまだの場合はGoolgeにユーザー登録しておいてください。

実現すること

本記事、WordPress標準のコメント受付け時にreCaptchaを利用できるようにする。導入に際しては、WordPress4.9.8を使用しています。

reCaptcha – “私はロボットでありません”

reCaptchaの導入は簡単４ステップ

以下順番に説明します。

reCaptchaに登録して、サイトキー、シークレットキーのペアを取得する
ヘッダにhttps://www.google.com/recaptcha/api.jsを読み込む
コメントフォームにreCaptcha用のフィールドを追加
function.phpにpre_comment_on_postをフックし、アクションを追加

手順１：reCaptchaに登録

以下のサイトにアクセスしてください。もしgoogleのログインを求められた場合は、あらかじめ準備したアカウント、パスワードでログインしてください。

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

下記に示した登録フォームが表示されますので、以下の内容で登録します。

これだけ入力したら、画面右下のRegisterボタンで登録します。

バージョン３を選んで、登録ドメインを入力しましょう

識別名（ドメイン名でもなんでもかまいません）
本執筆時点ではreCaptchaはV2とV3のどちらかを選べますが、迷わず最新のV3をえらびましょう。
登録したいドメインを1行に１つずつ入力します。※のフィールドはV3のみ表示します。
Accept The reCAPTCHA Term of Serviceのチェックはいれないと登録出来ません。チェックしてください。

無事登録されると以下のような登録内容が画面上に表示されます。このうち、①サイトキーと②シークレットキーは一番大事なので、ドメイン名とともにメモしておいてください。

表示された内容から、サイトキー／シークレットキーをメモ

手順２：ヘッダーでapi.jsをロードする

Wordpressの場合は、テーマフォルダー内のheader.phpのヘッダー部の最後（</head>の直前）に、下記の行を入力し、api.jsファイルをロードするようにしてください

<script src='https://www.google.com/recaptcha/api.js?render=（sitekey）'></script>

※上記コーディング中,site keyは、先に取得してメモしておいたサイトキーに置き換えてください。

手順３：コメントフォームにreCaptchaフィールドを追加する

手動でフィールドを追加する場合は、下記のhtmlを表示したい場所に追加する

<div class="g-recaptcha" data-sitekey="(site key)"></div>

※上記コーディング中.site keyは、先に取得してメモしておいたサイトキーに置き換えてください。

手順４：function.phpにpre_comment_on_postをフックし、アクションを追加

Wordpressのテーマフォルダ内にあるfunction.phpを編集し、pre_comment_on_postをフックし、アクションを追加する。下記のコーディングをそのまま追加すれば良い。

add_action( 'pre_comment_on_post', function( $parameter = true ) {
    if( isset( $_POST['g-recaptcha-response'] ) ) {
        $response = json_decode( wp_remote_retrieve_body( wp_remote_get( 'https://www.google.com/recaptcha/api/siteverify?secret=(seacret key)&response=' .$_POST['g-recaptcha-response'] ) ), true );
        if( $response['success'] ) {
            return $parameter;
        } elseif( !$response['success'] ) {
            wp_die( '<h1>認証に失敗しました</h1><p>「私はロボットではありません」にチェックを入れてください。</p>', '', array( 'back_link' => true ) );
        }
    } elseif( !isset( $_POST['g-recaptcha-response'] ) && !is_user_logged_in() ) {
        wp_die( '<h1>ロボットと判定されました</h1><p>あなたがロボットでなければ、ブラウザの javascript を有効にしてください。</p>', '', array( 'response' => 403, 'back_link' => true ) );
    }
});