脱力系備忘録BloG

■これはなに？
CAPTCHAです。画像認証の方が一般的な言葉でしょうか？
一見見づらい画像の中に隠された文字や画像などを、人間ならではの応用力で読み取る「CAPTCHA」の亜種と思っていただければ結構です。

この「niCAPTCHA」は複数の画像の中から「煮卵」の画像だけを選択してもらい、正しく「煮卵」だけを選択された場合は「人間である」と認識します。
しかし、「煮卵に似た何か」を「煮卵」と間違って選んでしまった場合は「ロボット」と判定されます。


■動作サンプル
「にたまごCAPTCHA『niCAPTCHA』」動作サンプルはこちら


■もう少し詳しく
「niCAPTCHA」という名前でピンと来た方もおられると思いますが、CAPTCHAとして参考にしたのはGoogleの「reCAPTCHA」です。

当初、「reCAPTCHA」をまるっとパクろうかと思ったのですが、それではAPIとして提供しなければならず、それはさすがにいろいろ重い。
というか、これ、
ジョークソフトだしぃ(´･｡･`)

ということで、自分のサイトで使ってみたいと言う方は、以下のソースをご自身のサーバーに取り込んでお使いください。

改変、再配布好きにやってください。
商用利用もお好きにどうぞ。
Googleやマイクロソフトといった企業サイトでの利用も許可いたします。
ただし、画像だけは自分で用意してね。サンプルサイトで使用している画像を利用するのは自己責任で。
あ、というか、niCAPTCHAの利用自体、自己責任でお願いします。


■サーバー要件
PHPが使用でき、GD関数が利用できること。


■niCAPTCHAソース群ダウンロード・説明
ソース群は「にたまごCAPTCHA『niCAPTCHA』」動作サンプルサイトからダウンロードしてください。

ダウンロード・ファイルはZIP形式ですので任意の場所に展開してください。
展開されると以下の内容が入っています。
●niCAPTCHA.css
この内容をご自身で用意したCSSに追記してください。
その際、1行目の「niCAPTCHA.php」のディレクトリ・パスを環境に合わせて修正してください。

●niCAPTCHA.js
ご自身のHTMLのHEAD要素の中に追記してください。
また、別途jQueryを読み込ませてください。

●niCAPTCHA.php
パネル画像を作成・表示するPHPです。
ご自身のサーバーのブラウザでアクセスできる場所に格納してください。
その際、58行目の「./niCAPTCHAimg」のディレクトリ・パスを環境に合わせて修正してください。

●niCAPTCHAimg
このフォルダの中に二種類の画像が9枚ずつ入っています。フォルダごとサーバーに投入してください。
その際、ブラウザで直接見ることができないディレクトリに格納することをオススメします。
また、格納した場所のパスを上記「niCAPTCHA.php」の58行目の部分に指定してください。

●sample.php
niCAPTCHAの動作サンプル・サイトで実際に動かしているPHPです。
動かし方の参考になさってください。

●HTML
以下のコードは「niCAPTCHA」を動かすのに最低限必要なコードです。
実際は<form>要素の中に
<input type="text" ～>
<select ～>
などが入ると思います。



■最後に結構まじめな話
ダウンロードしたソースや画像そのままに、本気でCAPTCHAとして利用しないでください。
どの画像が正解か、ダウンロード内容を見るとばれてしまいますので役に立ちません。
また、画像そのものの認識はロボットが得意な分野なので、ただ画像を並べて「どれが正解か？」というのは、相当数ストック画像を集めたり、こまめにストック画像を変更していかないとロボットが覚えてしまいます。
ですので、画像サイズをランダムにしたり、重ねたり、傾けたりなどロボットが認識しにくい対策が必要です。

で、そもそも論なのですが、画像認証(CAPTCHA)の仕組みは、ロボットは認識しにくいが人間には判る。と言うものでなければなりません。
この「niCAPTCHA」は、どの画像が「正解」か？人間にも判らないのでCAPTCHAとして機能しておりません！(ｷﾘｯ