phpによるシンプルな画像アップローダと、サンプルのソースコード

ファイルアップローダ検索して見つかるのが、古いPerlのコードだったりするのが不満で、仕方なしに書いたPHPによる画像アップローダプログラムです。
サンプルのソースコードでは、JavaScriptによりアップロード前の画像をプレビュー表示する機能もおまけに付けてあります。

ユーザ名・パスワードの入力欄も今回は必要ないので、
本当はさらにシンプル


特徴は、アップロード画像の取得処理の呼び出しが、関数で一行にまとまっていることです。
また、サンプルプログラムとして扱いやすいよう、アップロードフォームとアップロード後のページを同じページにしています。
phpファイルを配置して、アップロード画像の格納ディレクトリを作るだけで動作確認ができます。

アップロード後に別ページへ遷移したい場合は、form要素を書き換えて、遷移先ページにアップロード画像の取得関数を配置してください。



ページソースはgithubに置いておきました (ライセンスは修正BSDです)。

いちおう、以下にサーバ構築の手順も書いておきますが、参考程度に。

apacheとphpモジュールをインストール

Ubuntu Linuxならば、apt-getする。
 (sudo apt-get install libapache2-mod-php5)
Windowsならば、XAMPPをインストール。

ブラウザでhttp://localhostにアクセスしてページが表示されることを確認。
(phpの動作確認はphpinfoを使う手順などで行なってください。)

phpページソースを配置

今回はサブディレクトリを作って、その下に画像アップローダを作ることにします。

Webページのルートディレクトリは、
Ubuntu Linux ならば、 /var/www
WindowsのXAMPPならば、  c:¥xampp¥htdocs (¥は半角)

この下に upimg という名前でサブディレクトリを作ります。
(ディレクトリ名は任意)
この中に、upper_min.phpという名前でテキストファイルを作成して配置します。
githubから直接ファイルをダウンロードしても良いですし、テキストのコピーペーストでも構いません。

ブラウザで、Webページが見られることを確認します。
(URLは多分、http://localhost/upimg/upper_min.php です。)
このままでは画像アップロードができません。
画像の保存先ディレクトリを作り、パーミッション(権限)の設定をします。

アップロード画像を格納するディレクトリを用意

作成して、パーミッションを設定する必要があります。
ディレクトリのパーミッションを設定します。
シェルを開いて、phpファイルを展開しているディレクトリに移動します。
mkdir imgs/
chmod a+rwx imgs/
以上です。
phpファイルと同じディレクトリ内に、imgsディレクトリができていることを確認してください。
なお、Windows環境ではパーミッション設定は不要です。

本当はパーミッションの設定やアップロード画像の保存パスはもっと安全を工夫すべきなのですが、今回は一番簡単な方法をとりました。


アップローダ配置の手順は以上です。


XAMPP環境で日本語の画像ファイル名のアップロードに対応したい場合、別記事でPHPのアップローダがWindowsフォルダの文字コードに対応する方法を紹介していますので参考にどうぞ。
そのうち、これを含む機能拡張版を公開する予定です。


phpページソース(ミニマム版)

(繰り返しになりますが)ページソースはgithubに置いてあります。

ミニマム版と言いつつ、いくらか冗長な部分もあります。
拡張性を担保しているということで、ひとつご勘弁を。

phpページソース(拡張版)

(2014/01追記) 追加してgithubにアップしました。
・アップロード前の画像をプレビュー表示する( JavaScriptによる)
・同名ファイルがアップされても、前のファイルを上書きしない
・ファイルサイズが大きすぎた場合、エラーに文章として表示
 (PHPでアップロード可能なファイルサイズの上限値を取得する)
・WindowsのXAMPP環境で、日本語ファイル名が文字化けする問題に対処済み
 (XAMPP環境における日本語ファイル名の文字化け解決法)

などの機能が追加されています。

0 件のコメント:

コメントを投稿

Linuxコマンドライン上でSVGベクタ画像をJPG等へラスタライズ変換する

 Linuxコマンドライン上でSVGベクタ画像をJPG等へラスタライズ変換することができるが、上手く変換されない場合がある。   以前作った魔法陣イラスト素材をイラスト素材ストックサイトへ登録しようと思い立ち、改めて素材用にラスタライズ変換をかけようとした。   ラスタライズ変換...