CMS構築を目的にPHPをベースとしたWordPress、CakePHPやPEARなどオープンソースを中心に解説しています

PHPの画像認証ライブラリにはいくつかありますが、今回はその中でも割とメジャーな「Securimage」の使い方を調べてみます。
Securimage PHP Captcha | Free Captcha Script

画像認証は、Web画面からログインしたり、新規情報登録をする場合に、パスワードなど文字による認証だけでなく、画像により認証するしくみです。
認証画面では悪意あるプログラムなどから、総当り的に認証を試みる攻撃を受けることがあります。具体的には、認証が通るまで機械的にパスワードを打ち続けるなどです。
これらの攻撃からサイトを守るために、動的に生成された画像からコードを読み取ったり、画像をドラック&ドロップで移動させたりといったしくみで、ワンランク上のセキュリティ対策を実現します。

「Securimage」は文字列を画像として自動生成するタイプの画像認証ライブラリで、その文字列を見て入力しないと認証をパスしないしくみを実現します。

導入方法

上の公式サイト、または、GitHubのサイトより、ソースをダウンロードします。現時点での最新のバージョンは3.6.4です。
GitHub – dapphp/securimage: PHP CAPTCHA Script

ソースを解答し、フォルダごとサーバにアップロードします。
ここでは「/secureimage/」にアップロードしたと仮定します。

次に、画像認証を利用したい画面に、以下のようにして画像を表示させます。

<img id="captcha" src="/securimage/securimage_show.php">

以下、画像を表示させたサンプルです。

securimage1

表示された画像に記載された文字列を入力するフォームを設置します。

<input type="text" name="captcha_code">

自動生成される画像の中には、読み取り辛いものもあるので、再生成するようなボタンも設置可能です。

<a href="#" onclick="document.getElementById('captcha').src = '/securimage/securimage_show.php?' + Math.random(); return false;">画像再生成</a>

次はサーバサイドの処理です。
サブミットボタンが押された際に、入力された画像が正しいかどうかをチェックします。

require_once dirname(__FILE__) . '/securimage/securimage.php';
$securimage = new Securimage();
if($securimage->check($_POST['captcha_code']) == false){
	// 画像認証エラー
}else{
	// 画像認証OK
}

導入に関しては以上です。非常に簡単ですね。

画像をカスタマイズする

設定を変更することで表示する画像をカスタマイズすることができます。

ファイル「secureimage_show.php」を開き、「$img->show();」の記述の前に、以下の設定を追記することで、画像サイズを変更することができます。

$img->image_width = 150;
$img->image_height = 50;
$img->show();

securimage2

同様にして、以下の設定で、背景色、テキスト色、ライン(ノイズ)色を変更することができます。

$img->image_bg_color = new Securimage_Color('#9999ff');
$img->text_color = new Securimage_Color('#ff0000');
$img->line_color = new Securimage_Color('#99ff99');

securimage3

関数「show」に画像パスを設定することで、背景画像を指定することができます。

$img->show(dirname(__FILE__) . '/backgrounds/bg3.jpg');

securimage4

変数「perturbation」でテキストのゆがみ具合を調整できます。0~1の範囲で指定します。
また、変数「num_lines」でラインの本数を指定できます。0~10の範囲で指定します。

$img->perturbation = 1;
$img->num_lines = 10;

securimage5

その他にも、フォントを指定、サインの追加、ランダムで表示されるテキストの指定、ランダム度合いなどを指定することができます。
詳細は公式サイトにて。

あまりテキストを読みづらくなると、正規ユーザ利用の妨げになるので、注意したほうがよさそうですね。

このエントリーをはてなブックマークに追加

Comment

Comment Form

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

Monthly Archives

Search