複数の画像ファイルをリサイズしてHTMLにするCGI

最近MTの「ファイルのUpload」では大量の画像ファイルをあげるのが大変なことから、perlスクリプトを作りました。これを使うと画像ファイルを一度にサムネイル画像にしつつ、HTMLも出力できます。いわば、「ファイルのUpload」の複数枚版です。

これを使う前準備としてはftpやscpなどで予めサーバーへ画像をアップロードする必要がありますが、その後webページからディレクトリを指定するだけでCGIが動作して、HTMLを出力します。

これをエントリーにコピーペーストすれば、簡単に複数枚画像をエントリに埋め込むことが出来ます。

使用例「ラジコンカー製作blog
なお、私の場合は finepix40iで 1280x960で撮影した画像を使用しています。

つたないプログラムなんですが、お役に立てれば幸いです。ダウンロード、設定方法などは以下をご覧下さい。

image upload utility: resize
programmed by T.Noma
04/14/2004
----------------------------------------------------------------------
・目的
たくさん撮影したデジカメ画像を一度にftp/scpなどでサーバーにアップロードし、cgiを使ってサムネイル画像(小さな画像)、スクリーンネイル画像(クリックしてアップにする画像)を作成し、同時にHTMLを出力する。

・インストール方法
.cgiが動作するディレクトリを新しく作り、そこに展開して下さい。
(私の場合は /var/www/html/tnoma/resize)
resize3.plとresize.cgiに実行ビットが立っていることを確認してください。
.htaccessを設定して、他人からのアクセスを禁止することをお勧めします。

・設定方法
resize.cgi 10行目

# configuration
my $URL = "http://blog.group4.co.jp/tnoma/blog/archives";
my $LOCALPATH= "/var/www/html/tnoma/blog/archives";
my $RESIZEPL = "/var/www/html/tnoma/resize/resize3.pl";

$LOCALPATHはサムネイル画像、スクリーン寝入る画像などを展開する親ディレクトリを指定します。apacheの書き込み権限を与えてください。
$URLは$LOCALPATHと同じディレクトリがURLとしての表記を指定します。
$RESIZEPLは、resize3.plを置いたディレクトリを指定します。

resize3.pl 10行目

$TMPDIR="/home/apachetmp";
書き込み可能なテンポラリディレクトリを指定します。

$ORGDIR="/home/tnoma/work/resize";
オリジナル画像ファイルをアップロードした元ディレクトリのデフォルトです。今回はcgiから呼び出しているので使われません。

$CONVERT="/usr/X11R6/bin/convert";
convert - convert an image or sequence of images
が入っているディレクトリを指定してください。convertはImageMagickに入っています。

$OUTDIR="/var/www/html/tnoma/blog/archives";
デフォルトの画像書き出しを行う親ディレクトリを指定します。

$OUTURL="http://blog.group4.co.jp/tnoma/blog/archives";
$OUTDIRのURL表記を指定します。

$JPGEXT="JPG"; # extension of jpeg files
元ディレクトリでのjpegファイルの拡張子を指定します。大文字、小文字の判定はOS依存です。

# output text(HTML)
$COLUMN=3; # put cr (br) code every $COLUMN images
画像N枚で改行コードを入れます。

$HTMLMODE=0; #1:ON 0:OFF
HTMLMODEの場合は改行コードとして brを入れます。

# image size
$SCREENNAIL="800x600"; # size for screen nail image
$THUMBWIDTH="160"; # put width of thumbnail image
$THUMBHEIGHT="120"; # put height of thumbnail image

スクリーンネイル画像サイズとサムネイルの画像の幅、高さを指定します。
現在サムネイル画像は元画像の整数倍(整数分の一)の値を指定しなければなりませんが、88行目の
system( "$CONVERT -size $THUMBNAIL $_ $OUTPUTFILES" );
の -sizeを -resizeに変更すれば自由に指定可能です。

・index.htmlの修正

index.htmlのstyles.cssで参照される、logo_small.gifは入っていません。これはmovabletypeの中にある画像ファイルを持ってくるといいです。

19行目の"/home/apachetmp/org/"はオリジナル画像をアップロードするディレクトリを指定しておくと便利です。

23行目の"/var/www/html/tnoma/blog/archives/"には、resize3.plの$OUTDIRと同じディレクトリを書いておくといいですが、動作には影響しません。

・使い方
まず、ftpやscpなどのツールを使い、サーバー上に画像ファイルを転送します。
西暦を含む日付の名前をつけたディレクトリ(元ディレクトリ)を作成して、そこへ画像をおいておくと便利です。

index.htmlをアクセスします。
resize1.gif


「画像ファイルをアップロードしたディレクトリを指定してください」に元ディレクトリを指定します。最後にスラッシュ(/)は付けてはいけません。

「格納するディレクトリパスを指定してください」には通常書き出しをしたいサブディレクトリを指定します。西暦を含む日付をお勧めします。最後にスラッシュ(/)は付けてはいけません。

「決定」ボタンを押すと、途中経過を表示しながら画像のリサイズ処理を行います。終了すると generated page(指定した書き出しディレクトリ/index.html)へのリンクと、textareaにHTMLが表示されます。

resize2.gif

サムネイル画像は「書き出しディレクトリ/s/*.jpg」、スクリーンネイル画像は「書き出しディレクトリ/m/*.jpg」へ格納されています。

・動作の仕組み
元ディレクトリ内のjpegファイル(実際には *.JPG)をlsを使いリストし、一つ一つ convertを使ってサムネイルとスクリーンネイル画像にリサイズします。同時にHTMLをindex.htmlに出力しています。

終了後、index.htmlへのリンクとHTMLの表示を行います。

・動作確認環境
RedHat8
perl 5.8.0
apache 2.0
ImageMagick 5.4.7

・動かない場合

CGIが動作するように設定してください。
CGIがディレクトリに書き込み権限があるか確認してください。
resize3.plは単体でも動作するので、 resize3.pl -hのusageを参考に動作確認をして下さい。
convertが動作するか確認してください。
CGIが動作するディレクトリを.htaccessでアクセス制限することをお勧めします。

・blog url
http://blog.group4.co.jp/tnoma/blog/

・動作無保証
このプログラム及びパッケージの動作は保証いたしません。また動作させたことによる不利益、損害が起きた場合でもその責任は負いません。

・改変、再配布について
改変、再配布は自由に行って構いませんが、その場合は必ず上記のblog urlを表記して下さい。

----------------------------------------------------------------------

ダウンロードはこちらから >> resize20040414.tar.gz (5373bytes)