ハコラボ: セキュリティーコードを設置

note

トップ »note » セキュリティーコードを設置

サイトの運営記や雑記はこちら。

セキュリティーコードを設置

コメント投稿はしてもらいたいけど、スパムはもちろん欲しくない。
でも、mailアドレス必須やら、TypeKeyでサイン・インのみ投稿受付っていうのはちょっと敷居が高い気がするな～。なんて思っていたら発見。

■Scodeでコメントスパム対策（ magnet :..様）
■SCode プラグインでコメントスパムを制限する（その2：Typekeyサイン・インとの競合制御）

早速導入することにしました。

１.プラグインを入手

まずは下記よりプラグインを入手。

■SCode1.0（movalog様）

配布方法が変わったらしく、名前とE-mailの入力を求められます。
すぐにメールにアドレスが送信されてくるので、早速ダウンロード。

２.プラグインのアップロード
ダウンロードしたアーカイブを解凍すると下記のような構成になっているので、ディレクトリ構成を保ったままphpおよびpluginsにアップロードします。

プラグインをアップロード

アップロード後、plugins/SCode/mt-scode.cgi のパーミッションを 755 等(レンタルサーバーにより異なる)に変更します。ちなみに当サイトはロリポップを利用しているので700です。

３.Scodeの設定

MT管理画面の「システム・メニュー」→「プラグイン」をクリックします。

ＭＴの管理画面のシステム・メニュー

プラグインの「SCode」の右側の「設定を表示」をクリックします。

設定を表示をクリック

下記のような設定画面が表示されます。

SCode設定画面

・Temp Directory
　セキュリティーコードの保存先。
　このディレクトリはＭＴから書き込みできるパーミッションが必要。
　（エラーが出る場合はフルパスで入力する。）
　また、ドキュメントルートより上位に設定が推奨。
　tmpフォルダがない場合は作成する。
　(tmpの後に必ず”/”を入れる)
・Length
　セキュリティーコードの桁数。デフォルトは６
・Max Temp Files
　セキュリティーコードのパターン数。デフォルトは５０
・Action
　セキュリティーコード認証エラーのアクションを選択。
　コメントを拒否するか、迷惑コメントとして受け付けるか。

設定後、「変更を保存」します。

次にScodeを設置したいブログの設定をする。設置したい各ブログの管理メニューの「設定」→「プラグイン」をクリックし、「Scode」の右側にある「設定を表示」をクリックし、「Enable Security Code (CAPTCHA) checking on this blog.」にチェックを入れて、「変更を保存」します。

各ブログのプラグインの設定

４.セキュリティーコードを設置
エントリー・アーカイブ、にセキュリティーコード用の下記タグを追加します。


<p>
   <label for="scode">Security Code:</label> 
   <input type="hidden" id="code"  name="code" value="<$MTSecurityCode$>" /> 
   <img class="scode" src="<$MTCGIPath$><$MTSecurityImage$>?code=<$MTSecurityCode$>" /><input id="scode" name="scode" tabindex="xx"/>
</p>

※青字の「class="scode"」「id="scode" 」はセキュリティーコードの位置合わせ用、「tabindex="xx"」はタブ移動順になりますので、使用している環境に合わせて変更、削除してください。当サイトはコメントエリアの下に設置しています。エントリー・アーカイブを更新、再構築すると、セキュリティーコードが設置されます。
エントリー・アーカイブに設置

上記の通り無事表示されました（ほっ）。試しに、セキュリティーコードなしで投稿してみます。
エラー画面

無事動いています。上記エラーメッセージは少し不親切な感じになるので、後で修正することにします。修正箇所は「MTのディレクトリ/lib/MT/L10N/ja.pm」の中の「_THROTTLED_COMMENT」を変更します。
続いて、コメント・エラー、コメント・プレビュー画面にも設置します。さて、コメントはプレビューやエラー画面になった場合、入力した名前やメールアドレス、本文は引き継がれるようになっていますが、セキュリティーコードは引き継がれないようです。必ず「投稿」前に入力が必須となります。これもコメントしてくれる人にはちょっと不親切なので、説明を追記することにしました。
５．スタイルシート修正

上記までで、設置は終わりですが、レイアウトをそろえたいと思うので、まずはスタイルシートを修正します。下記スタイルを追記します。


.scode { 

          vertical-align: top;

          }

#scode { 

           margin-left: 5px;

            }

画像と入力欄の上部を揃える

画像と入力箇所の上部が揃いました。
あとなんとなく、日本語表記の方が好みだったので、修正しました。

６．セキュリティーコードのサイズを変更。

更にレイアウトを整えるため、セキュリティーコードの画像の高さを変更します。
PluginsディレクトリのSCode.pmのコード記述を下記の通り変更します（赤字を青字に修正）。
下記数字は当サイトの場合です。参考サイト様では違う数値になっています。



my $im = new GD::Image($im_length,2522);




# define the color we going to use

my $c_background = $im->colorAllocate(224,224,224);

my $c_border = $im->colorAllocate(0,0,0);

my $c_line = $im->colorAllocate(192,192,192);

my $c_code = $im->colorAllocate(128,128,128);


 

# Fill in the background

$im->fill(50,50,$c_background);




# Draw the borders lines

for (my $i=0;$i<$im_length;$i+=5) {

  $im->line($i,0,$i,2421,$c_line);

}




for (my $i=0;$i<25;$i+=5) {

  $im->line(0,$i,$im_length-1,$i,$c_line);

}




$im->rectangle(0,0,$im_length-1,2421,$c_border);




# Write the code

$im->string(gdGiantFont,8,53,$scode,$c_code);

大体揃ったのでＯＫとします・・。

７.TypeKeyサイン・インとの競合制御

折角サイン・インしてもらってるのにセキュリティーコードまで入力してもらうのはちょっと過度なんで、更に修正を加えます。

まずは、テンプレートを修正（青字を追加）（※エントリー、コメント・プレビュー、コメント・エラーに全部修正を加える）



<p id="securitycode">

<label for="scode">セキュリティーコード:</label>

<input type="hidden" id="code" name="code" value="<$MTSecurityCode$>" />

<img class="scode" src="<$MTCGIPath$><$MTSecurityImage$>?code=<$MTSecurityCode$>" /><input id="scode" name="scode" tabindex="xx" />

</p>




<MTIfNonEmpty tag="MTTypeKeyToken">

<script type="text/javascript">

<!--

if (commenter_name) {

   document.getElementById('securitycode').style.display = 'none';

}

// -->

</script>

</MTIfNonEmpty>

動作確認のためサイン・インしてみます。

サイン・インしたときセキュリティーコードが非表示に

上記の通り、ちゃんとセキュリティーコードが消えました。
今度はプラグインを修正します。
ダウンロードしたSCode.plをエディタで開き、下記青色部分を追加する。



if($config->{action} == 1 && $blog_config && $blog_config->{scode_enable} == 1) {

my $code = $q->param('code');

my $scode = $q->param('scode');

my $sscode = SCode::scode_get($code);




my $class = $ENV{MOD_PERL} ? 'Apache::Cookie' : 'CGI::Cookie';

eval "use $class;";

my $cookies = $class->fetch;

my $commenter_name = "";

if ($cookies && $cookies->{commenter_name} && $cookies->{commenter_name}->value()) {

    $commenter_name = MT::I18N::encode_text($cookies->{commenter_name}->value(),'utf-8',undef);

}

if (!$commenter_name) {

    if ($scode ne $sscode) { 

            my $score = -3;

            my $msg = "Comment junked due to incorrect code entered";

             return ($score, [$msg]);

  } 

} 

    SCode::scode_delete($code);

    SCode::scode_create($code);

　　　　　　：

　　　　（中略）

　　　　　　： 

my $code = $q->param('code');

my $scode = $q->param('scode');

my $sscode = SCode::scode_get($code);


 

my $class = $ENV{MOD_PERL} ? 'Apache::Cookie' : 'CGI::Cookie';

eval "use $class;";

my $cookies = $class->fetch;

my $commenter_name = "";

if ($cookies && $cookies->{commenter_name} && $cookies->{commenter_name}->value()) {

    $commenter_name = MT::I18N::encode_text($cookies->{commenter_name}->value(),'utf-8',undef);

}

if (!$commenter_name) { 

    if ($scode ne $sscode) { 

        return 0; 

    } 

} 

SCode::scode_delete($code);

SCode::scode_create($code);