注目の記事 PICK UP

スパムコメントをシャットアウトreCAPTCHAサービスとInvisible reCaptchaプラグイン

Last Updated 2021.01.21

スパムコメントをシャットアウトreCAPTCHAサービスとInvisible reCaptchaプラグイン

22-recaptcha-header
WordPressは世界中で約3割のシェアがあり、プログラムソースがオープンソースで公開されていることもあり、様々な攻撃のリスクに晒されています。その中でもっとも多い攻撃がお問い合わせフォームを狙ったコメントスパムです。このスパム攻撃は当サイトも例外なく受けており、Akismetプラグインで防いでくれるスパムもあればAkismetをくぐり抜けてくるスパム攻撃もあります。そういった高度なスパム攻撃も全てシャットアウトしてくれるのがGoogleが提供する「reCAPTCHA」というサービスです。

reCAPTCHA is a security service that protects your websites from fraud and abuse.

reCAPTCHAサービスとは何か

reCAPTCHAサービスはGoogleが提供している、WEBサービスで悪意のあるボットやスパムからWEBサイトを守ってくれるサービスです。

reCAPTCHAは、高度なリスク分析エンジンと適応型チャレンジを使用して、悪意のあるソフトウェアがWebサイトで不正な活動を行わないようにします。その間、正当なユーザーはログイン、購入、ページの表示、またはアカウントの作成が可能になり、偽のユーザーはブロックされます。

WEBサイト全体を悪意のあるボットやスパム攻撃から守ってくれるのですが、このreCAPTCHA、サービスに登録するとバッジがサイトの各ページに表示されるようになります。このバッジはページの右端であったり左端に配置できるのですが、ページトップへのリンクボタンと重なることも多くバッジを表示させたくないというニーズがあります。しかし、reCAPTCHAサービス規約でこのバッジ表示は必須となっています。そこで、Invisible reCaptchaプラグインの出番がやってきます。

Invisible reCaptchaプラグイン

Invisible reCaptchaプラグインは、Googleのサービス「reCAPTCHA」の適用ページをユーザーが情報を入力するフォームがあるページに限定して適用するというプラグインです。ログインページ、登録フォーム、パスワード再発行ページ、コメントフォームがある記事ページ、Contact Form 7で作成したお問い合わせページ等に適用できます。当サイトのお問い合わせページもContact Form 7で作成しているため、このInvisible reCaptchaプラグインを使用してreCAPTCHAサービスを適用しています。

reCAPTCHAサービスの登録

まずはreCAPTCHAサービスにWEBサイトを登録するところから開始します。

reCAPTCHA is a security service that protects your websites from fraud and abuse.

上記リンクからreCAPTCHAサービスにアクセスします。
22-recaptcha-02
赤枠で囲んだ「Admin Console」リンクをクリックするとreCAPTCHAの管理画面へ遷移することができます。
管理画面の右上「+」アイコンをクリックして新規WEBサイトを登録する画面へ遷移する、もしくは下図のようなページへ遷移したら赤枠のところを入力していきます。

22-recaptcha-08

ラベル:登録するWEBサイト名
reCAPTCHA タイプ:reCAPTCHA v3を選択します
ドメイン:ドメインを入力して+をクリックして登録します
reCAPTCHA 利用条件に同意する:チェックを入れます
アラートをオーナーに送信する:チェックは任意です

以上を入力してチェックボックスも問題なければ「送信」ボタンをクリックします。
reCAPTCHAにWEBサイトを登録したら、もう一度管理画面の右上の歯車アイコン「設定」をクリックします。

22-recaptcha-07
reCAPTCHAにWEBサイトを登録するときにはなかった項目で「このキーが AMP ページで動作するようにする」という項目あります。
WEBサイトがAMPに対応しているようでしたらこの項目もチェックを入れてreCAPTCHAを有効にします。
「保存」ボタンを押して設定を保存します。

Invisible reCaptchaプラグインのインストールと設定

22-recaptcha-01
reCAPTCHAの設定ができましたら、次はInvisible reCaptchaプラグインをインストールします。WordPressの管理画面の左メニュー「プラグイン」→「新規追加」をクリックします。プラグイン検索フォームに「Invisible reCaptcha」と入力して、Invisible reCaptchaプラグインを探します。「Invisible reCaptcha for WordPress」プラグインが見つかりましたら「インストール」→「有効化」します。
管理画面左メニューの「設定」→「Invisible reCaptcha」を選択してクリックしてInvisible reCaptchaプラグインの設定画面を開きます。

Invisible reCaptcha Settings

22-recaptcha-04
赤枠で囲まれたフォームにサイトキーとシークレットキーを入力しないといけません。このサイトキーとシークレットキーはreCAPTCHAの管理画面の登録したWEBサイトの設定画面から入手します。

22-recaptcha-03
一度reCAPTCHAの管理画面に戻ります。登録したWEBサイトの設定画面を開きます。
「reCAPTCHAのキー」というリンクをクリックすると、スライドダウンしてサイトキーとシークレットキーが現れます。それぞれコピーして、WordPressのInvisible reCaptcha Settingsのサイトキーとシークレットキーの入力フォームに入力します。サイトキーとシークレットキーを入力したら忘れずに「変更を保存」して設定を保存しましょう。

WordPress Protection Settings

22-recaptcha-05
WordPressのInvisible reCaptcha管理画面の左タブ、「WordPress Protection Settings」をクリックします。すると上図の設定画面が表示されます。この項目はログインページ、登録ページ、コメント入力フォームがあるページ、パスワード再発行ページのそれぞれにreCAPTCHAを適用するかどうかを設定します。基本的には全部にチェックを入れて「変更を保存」します。

Contact Forms Protection Settings

22-recaptcha-06
最後は「Contact Forms」設定です。WordPressのInvisible reCaptcha管理画面の左タブ「Contact Forms」タブをクリックして、「Contact Forms Protection Settings」を表示します。
「Enable Protection for Contact Form 7」の項目にチェックを入れます。ここがContact Form 7のページにreCAPTCHAを適用する設定になります。最後に「変更を保存」して設定を完了します。

reCAPTCHAの適用ページを確認

reCAPTCHAとInvisible reCaptchaプラグインの設定を完了しましたら、簡単にWEBサイト内を見て確認しましょう。通常の記事ページ、コメント機能を無効にいるとreCAPTCHAバッジは表示されないと思います。逆にコメント機能を実装しているとreCAPTCHAバッジが表示されていると思います。お問い合わせページを開くとreCAPTCHAバッジが表示されていると思います。当サイトは記事作成と平行して多言語化も進めていますので、多言語ページのお問い合わせページも確認します。

reCAPTCHAを導入してからスパムシャットアウト

GoogleがサービスしてくれるreCAPTCHAですが、効果は絶大で今までAkismetの防御をくぐり抜けてきたスパムも、シャットアウトしてくれてお問い合わせメールがくることもなくなりました。今後、WordPressでWEBサイトを運営する方はこのreCAPTCHAはおすすめのサービスです。WordPressでWEBサイトを立ち上げたら忘れずにreCAPTCHAサービスを登録するといいでしょう。

reCAPTCHA is a security service that protects your websites from fraud and abuse.


Invisible reCaptcha for WordPress plugin helps you to protect your sites against bad spam bots using the new Invisible reCaptcha by Google.

関連記事

  1. 11-wordpressfirst-aicache

    モバイルユーザビリティを向上させるAMPとは何か?

  2. 13-wordpressfirst-aicache

    AMP for WPの詳細設定方法-Design(デザイン)

  3. 34-bigdata-header

    GDPR対応について-WordPressをGDPR&CCPAに対応する

  4. 19-chromedev-header

    ChromeでPCからモバイル端末をエミュレートして表示する方法

  5. 17-postandpage-header

    WordPressの投稿ページと固定ページの違い

  6. 20-marketing-header

    マーケティングの定義-消費者志向から価値主導のマーケティングへ

  7. 05-wordpressfirst-aicache

    WordPressをインストールして最初にやる設定-パーマリンク設定

  8. 21-marketing-header

    マーケティング調査・戦略・プログラム立案・実行・管理の流れ

  9. 05-05-sxomarketing-header

    SXO検索体験最適化を実現するためには-2022年からのSEO対策

特集記事

  1. 05-05-sxomarketing-header SXO検索体験最適化を実現するためには-2022年からのSEO対策
  2. 20-marketing-header マーケティングの定義-消費者志向から価値主導のマーケティングへ
  3. 13-wordpressfirst-aicache AMP for WPの詳細設定方法-Design(デザイン)
  4. 03-wordpressfirst-aicache WordPressをインストールして最初にやる設定-表示設定
  5. 05-wordpressfirst-aicache WordPressをインストールして最初にやる設定-パーマリンク設定
  6. 17-postandpage-header WordPressの投稿ページと固定ページの違い
  7. WordPressをインストールして最初にやる設定-一般設定
  8. 26-gdpr-header GDPRに対応して個人情報保護法やEU圏のユーザー個人情報を保護する
  9. 21-marketing-header マーケティング調査・戦略・プログラム立案・実行・管理の流れ
  10. 24-polylang-header PolylangとLingotek Translationで自動翻訳した多言語サ…

PICK UP記事

  1. 20-marketing-header マーケティングの定義-消費者志向から価値主導のマーケティングへ
  2. 16-onamae-header お名前.comのドメインのDNS設定をする-コアサーバー連携
  3. 07-wordpressfirst-aicache 新しいブロックエディターが使いづらい。そんな時はClassic Editor
  4. 08-wordpress-head WordPressの簡単セットアップ方法-コアサーバー(CORESERVER)
  5. 29-complianzgdpr-header 英国のGDPRはさらに厳しい-Complianz GDPR&CCPA Cooki…
  6. 25-marketing-header 4C分析とクロスSWOT分析-マーケティングの分析フレームワーク
  7. 12-wordpressfirst-header AMP for WPのイントールと詳細設定の方法
  8. 18-resetcss-header リセットCSSとは何か-WEB制作の基礎
  9. 17-postandpage-header WordPressの投稿ページと固定ページの違い
  10. 21-marketing-header マーケティング調査・戦略・プログラム立案・実行・管理の流れ

Twitter

最近の記事

  1. 35-newthemeupdate-header
  2. 05-03-aboutsxo-header
  3. 05-05-sxomarketing-header
  4. 29-complianzgdpr-header
  5. 30-wpsitemap-header
  6. 28-consumerbehavior-header
  7. 34-bigdata-header
  8. 26-gdpr-header
  9. 25-marketing-header
  10. 24-polylang-header

おすすめ記事

  1. 06-wordpressfirst-header
  2. 29-complianzgdpr-header
  3. 05-05-sxomarketing-header
  4. 15-wordpress-aicache
  5. 09-wordpressfirst-aicache
  6. 08-wordpress-head
  7. 02-wordpressfirst-header
  8. 19-chromedev-header
  9. 21-marketing-header
  10. 07-wordpressfirst-aicache
PAGE TOP