Noël Café : Blog

Noëlの公開備忘録とひとりごと。コメント・トラックバックご自由に

メールフォームスパム対策

先日、メールフォームを新しくしました。
そこでMT-Keystrokeを使用したのですが、
Movable TypeデフォルトのCAPCHAが使えなくなってしまい
やむなく削除いたしました。
そこで代替策を考えました。


代替策の方法は以下のとおり。

  1. はじめはSubmitボタンを表示しない
  2. 「投稿ボタン表示」ボタンを押すとSubmitボタンが表示される

JavaScriptの折りたたみ法だと、
スパムロボットには効きそうにないので
(JavaScript無しでは普通に表示されるはず)、
ボタンの内容はJavaScirpt内に表示したいと考えました。
いろいろ探した結果下のBlog記事を発見!
Movable Type で CAPTCHA 認証を使わないで
スパム対策をしてみる
@ かたつむりくんのWWW
jQueryというJavaScriptライブラリを使用してスクリプトを作成しました。
以下備忘録とアイディアのLOG化


まず、jQueryをMTで使用していない場合は拾ってくる。
jQuery
MinifiedでもUncompressedでもよいと思います。
PCのためにはMinified(改行等なく軽い)、
中身を見たい人間様のためには
Uncompressed(改行スペースあり見やすい)。
私はUncompressedにしました。
ファイル名をjquery.jsに変更しサーバーにぶち上げる。
場所はお好きに。
私はルートフォルダに入れました。
次にMovable TypeのHTMLヘッダーテンプレートに以下の一行を追加。
srcの後は自分のぶち上げた場所に変更のこと。

<script type="text/javascript" src="/jquery.js"></script>

最後にフォームの修正をします。
mail_common:Common module of mail form テンプレートを編集。
<p id="mail-form-footer">~</p>内の
submitボタン以外(input hidden)をformタグ直下に移動
多分下の内容です。

<input type="hidden" name="mail_blog_id" value="<$MTBlogID$>" />
<input type="hidden" name="mail_setting" value="<$MTGetVar name="mail_setting">" />

<p id="mail-form-footer">~</p>内を書き換え。

<div id="comments-form-spam-block">
<button id="noSpam" type="button">投稿ボタン表示</button> (スパム対策)
</div>

テンプレートの一番下に以下を追加

<script type="text/javascript"><!--
// START comments-form-spam-block
jQuery(function(){
jQuery('button#noSpam').click(function(){
jQuery('div#comments-form-spam-block').replaceWith('<input type="submit" accesskey="v" name="mail_preview" id="mail_preview" value="確認" /> <input type="submit" accesskey="s" name="mail_post" id="mail_post" value="送信" />');
});
});
// END comments-form-spam-block
// --></script>

最後に再構築して完了☆


こんな感じになります↓

(スパム対策)

<!–
// START comments-dummy-spam-block
jQuery(function(){
jQuery('button#noSpamTest').click(function(){
jQuery('div#comments-dummy-spam-block').replaceWith(' ‘);
});
});
// END comments-dummy-spam-block
// –>


これでもスパムはかなり減ると思うんだけど、
もう少し手を打ってみることに。
どれだけ効くかわからないけど。
formタグのactionに動作CGIアドレスが書いてあるんだけど
これも、はじめダミーを載せておいて
ボタンを押すと正式なアドレスが入力されるようにしてみる。
formタグ内 action="DUMMY" に。
テンプレート内最後に入れたJavaScriptタグを以下のように変更。
(5行目に1行挿入しました。)

<script type="text/javascript"><!--
// START comments-form-spam-block
jQuery(function(){
jQuery('button#noSpam').click(function(){
jQuery('form#mail_form').attr('action', '<$MTCGIPath$>plugins/MailForm/mt-mail-form.cgi');
jQuery('div#comments-form-spam-block').replaceWith('<input type="submit" accesskey="v" name="mail_preview" id="mail_preview" value="確認" /> <input type="submit" accesskey="s" name="mail_post" id="mail_post" value="送信" />');
});
});
// END comments-form-spam-block
// --></script>

これで再構築。
ちょっとメール送るのに時間がかかる気がするけど
これでSPAMがこなければ良いと思う。


その他リファレンス


このやり方はどのくらい効果があるかわからないけど
jQueryを少しはいじろう!と思ったのが私にとっては収穫。
そんでもってこれをいろいろなところに埋め込めるので
Noel Cafe内でもまだまだ応用したい場所はありますね!
ということでしばらくHPいじりが続きます。
最後になりますが、背中ぽ~んな記事を書いてくださった
かたつむりくんのWWW tinybeansさんありがとうございます!!

Leave a Reply

*


CAPTCHA



Trackback URL