« しょうがコーラは風邪に効いた!! | メイン | 離婚弁護士 »

複数の画像ファイルをリサイズして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)

【この記事に関連するエントリー: weblog

トラックバック

このエントリーのトラックバックURL:
http://nomano.shiwaza.com/mt333/tb203.cgi/588

この一覧は、次のエントリーを参照しています: 複数の画像ファイルをリサイズしてHTMLにするCGI:

» MovableType 複数の画像を一括で扱う 送信元 ZeroDimension
のまのしわざ: 複数の画像ファイルをリサイズしてHTMLにするCGI 先日tnomaさんに作成していただいたMovableTypeで複数の画像ファイルをHTMLにするというツールを早速D1GrandPrixに使ってみました。...... [詳しくはこちら]

» 【ツール】『ebot Chaos Edge』を使って、ホームページ上にある画像を根こそぎゲット!! 送信元 ◆珍問屋◆
簡単な操作で、ホームページに貼り付けられている画像を、一気に取得できる、夢の様なフリーツールを発見しました。普通は、Webに公開されている画像ファイルを見つけだすには、「Google」などの検索エンジンを使い、検索結果から画像を1つずつチェックして、内容を確かめ... [詳しくはこちら]

» 複数の画像ファイルをリサイズしてHTMLにするCGI:resize5 送信元 のまのしわざ
複数の画像ファイルをリサイズしてHTMLにするCGI をバージョンアップして、回転機能を追加しました。さらに設定項目を1ファイルへまとめて設定を簡単にしてみました。 ダウンロードはこちらから>>resize5.zip (16346 bytes)...... [詳しくはこちら]

コメント (4)

ken:

おぉ、お待ちしていました、こういうの。
早速利用させていただきます。

はじめまして。つい先日Movable Typeをインストールしたばかりの初心者です。分からない事が多くてWebをグルグルしている間にたどり着きました。
のまさんのツールを使ってみたいんですが、resize20040414.tar.gzをダウンロードして展開するとresize.tarというファイルが一つ出来上がっただけで、cgiファイル等はありませんでした。
超初心者ですのでやり方から間違っていると思います。
どうすれば良いのか教えて頂けると幸いです。

こんにちは。

resize.tarファイルはunix上であればtarというコマンドで解凍します。

tar xvf resize.tar

これで同じディレクトリにファイルが解凍されます。

windowsであればtarの解凍に対応している解凍ツールで解凍してください。解凍後のファイルをunix上へ転送すればよいです。

unixの知識があることを前提にはしょって説明してしまっているので、わからないことがあればまたコメントしてください。

のまさま。
早速のお返事ありがとうございます。
書き忘れていました。当方はWindows2000です。(^^;;
なにぶん超初心者ですので、また質問が出てくるかもしれません。その時は宜しくお願いします。

コメントを投稿

富士スピードウェイ集団訴訟関連

実践Web2.0 BOOK 人気ブロガー直伝! 一歩先行くWeb2.0的ワーキングスタイル
4844324187
↑この本のお手伝いをしました。是非チェックしてみて下さい。

About

このエントリーの概要です。

あわせて読みたい
フィードメーター - [の] のまのしわざ