技術情報提供ブログ

Movable Type 4 で reCAPTCHA を利用する

以下の情報は Movable Type 4 Beta での設定方法です。最新のものは以下の記事を参照ください。

CAPTCHA 認証機能も簡単設定可能にでは、Movable Type 4 に追加された CAPTCHA 認証機能についてご紹介しました。この CAPTCHA 機能を利用するには、Movable Type 4 をインストールするサーバに Image::Magick という Perl モジュールがインストールされている必要があります。

Image::Magick のインストールされていない環境でも CAPTCHA 認証機能を利用したい場合のひとつの方法として、外部サービスを利用するというものがあります。今回は、reCAPTCHA という無償で利用できる CAPTCHA 認証提供サービスを Movable Type 4 のコメント部分に導入する方法をご紹介します。

プラグインのインストール

Movable Type 4 Beta には extras フォルダが同梱されています。中には OpenID 関係のプラグインやサンプルプラグインなどがあり、編集しやすくなった Movable Type 4 のテンプレート管理・編集画面 でご紹介した Snippet プラグインのサンプルも用意しています。今回はこのサンプルプラグインの中から、reCAPTCHA を Movable Type 4 で利用する為のプラグイン。つまり、CAPTCHA プロバイダを追加するプラグインのサンプルを利用して、紹介します。

さっそくプラグインをインストールしてみましょう。ここでは、mt.cgi のあるディレクトリを [MT] と表記します。

  1. [MT]/extras/examples/plugins/reCaptcha/plugins にある、reCaptcha ディレクトリを [MT]/plugins に移動 (もしくはコピー)
  2. [MT]/extras/examples/plugins/reCaptcha/php/plugins にある init.reCaptcha.php を [MT]/php/plugins に移動 (もしくはコピー)

以上でインストールは完了です。

reCAPTCHA のアカウントを作成する

reCAPTCHA のトップページ。真ん中あたりにメニューがあります。

  1. reCAPTCHA のトップページに移動し、メニューから GET reCAPTCHA をクリックします
  2. 簡単な reCAPTCHA の紹介ページに Sign up Now! というボタンのあるページに移動しますので、Sign up Now! をクリックします
  3. ログインフォームに移動しますので、New to reCAPTCHA? となっている部分より、アカウントを作成します
  4. ユーザ名やパスワード、メールアドレスなどを入力した後、Are you a human? という問いかけとともに CAPTCHA 認証を行ってアカウントを作成します

アカウント作成後、アカウントメニューから + Add a New Site ボタンをクリックし、reCAPTCHA を導入したい Movable Type 4 がインストールされているサーバのドメインを入力します。

recaptcha-create.jpg [451px*99px]

すると、public key と pribate key という2種類のキーが発行されます。キーは2種類とも利用します (キーは reCAPTCHA にログインすれば、いつでも確認できます)

recaptcha-getkey.jpg [451px*147px]

Movable Type 4 の設定を行う

reCAPTCHA の設定を行い public, pribate 両方のキーを取得したら、先ほど reCAPTCHA プラグインをインストールした Movable Type 4 の管理画面に移動します。

管理メニューより、 プラグインを選択し、プラグインリストの中から reCAPTCHA プラグインの項目へ移動します。利用可能になっていることを確認し、設定の表示をクリックすると、public key と pribate key を入力するフォームが現れますので、両方のキーを入力し、変更を保存ボタンをクリックします。

recaptcha-mt4-setting.jpg [451px*147px]

取得したキーを入力する

同じく管理メニューから設定を選択し、コミュニケーションの設定に移動します。CAPTCHA プロバイダ設定のセレクトメニューに reCaptcha という項目があるのを確認し、選択します (Beta 4 よりこの設定はブログ単位で行えるようになる予定です)

captcha-mt4-setting.jpg [450px*90px]

reCaptcha という項目を選択

そのまま、管理画面の Movable Type ロゴの下にあるブログ選択メニューよりブログごとのコメント設定画面へ移動します。CAPTCHA 認証機能も簡単設定可能に で行ったのと同じように、認証無しコメントを受け付けるように設定します。メールアドレスの入力を必須にしたい場合は、該当の項目もチェックしてください。

anonymouscomment-mt4-setting.jpg [450px*90px]

認証無しコメントの投稿を許可

最後にテンプレートの変更を行います。モジュール Comment Form テンプレートの以下の部分を修正します。

<MTIfNonEmpty tag="MTCaptchaFields">
<MTIfCommentsAccepted><MTIfRegistrationAllowed><MTElse><$MTCaptchaFields$></MTIfRegistrationAllowed></MTIfCommentsAccepted>
<div id="comments-open-captcha">
</div>
</MTIfNonEmpty>

となっている部分を

<MTIfNonEmpty tag="MTCaptchaFields">
<div id="comments-open-captcha">
<$MTCaptchaFields$>
</div>
</MTIfNonEmpty>

のように変更します。さらに Javascript テンプレートの以下の部分を削除 (もしくはコメントアウト)します。

<MTIfNonEmpty tag="MTCaptchaFields">
captcha_timer = setInterval('delayShowCaptcha()', 1000);
</MTIfNonEmpty>

変更後、静的生成の場合は再構築して確認します。全てもしくはエントリーアーカイブのみをダイナミックパブリッシング (動的生成) するように設定している場合は、再構築の必要はありません。

設定完了後、コメントを許可しているブログ記事をチェックしてみてください。コメントフォームに reCAPTCHA が表示されているはずです。

recaptcha-in-mt4.jpg [450px*200px]

コメント認証でログインしている状況でも表示されますが、CAPTCHA 認証をおこなわなくてもコメントの投稿ができます (Beta 4 で同梱される reCAPTCHA プラグインでは、認証無しコメントの場合のみ表示されるようになる予定です)

今週はいよいよ Movable Type 4 Beta 4 がスタートします。これまでお寄せいただいたたくさんのフィードバックから見つかったバグの修正状況は、Movable Type 4.0 Beta Change Log にお礼とともに掲載させていただいています (email アドレスのアカウント名の部分などで掲載させていただいています)。ぜひ、これからの Beta 版を利用するとともにチェックしてみてください。本当にありがとうございます!


トラックバック

トラックバック URL

»CAPTCHA(アンチスパム・イメージ)を使った認証 from ぱふぅ家のホームページ

JpGraphを使うと、簡単にCAPTCHA(アンチスパム・イメージ)を生成できる。≫「reCAPTCHA」に関する情報を追加しました。


このページのトップへ