CakePHP Upload プラグインの動作解説 : 画像のアップロードからサムネイル作成まで手軽にできるプラグイン

この記事を読むのに必要な時間は約 11 分です。


CakePHP で、画像のアップロードやサムネイル作成までを簡単に行える、Upload プラグインをご紹介したいと思います。

簡単な使い方の例などは、ちらほら見かけますが、どういう動作をするものかの理解できるように解説したいと思います。

実際の導入方法やコード例については、次回扱いたいと思います。


 

cake-logo

Upload プラグインは何するものぞ?

Upload プラグインでできるようになること

アップロードするファイルに対して、以下のことが可能になります。

  • 指定したカラムに以下の情報をそれぞれ登録できます。
    • ファイル名
    • ファイル格納ディレクトリ
    • ファイルサイズ
    • ファイル種類 (MIME Type)
  • アップロードされた一時ファイルを指定したディレクトリに格納できます。
  • アップロードされたファイルに対して様々な Validation チェックを行うことができます。Validation エラーとなったファイルは消去されます。ゴミは残りません。
    • ファイル種類 (MIME Type)
    • ファイル拡張子 (.png, .jpg のみ可 など)
    • ファイルサイズ (●●KB 以上 ●●MB 以下 / PHP制限サイズ内 など)
    • 画像サイズ (●●px 以上 ●●px 以下 など)
  • 指定されたサイズのサムネイルを自動的に作成してくれます。
    • 作成するサムネイルのファイル名につけるプレフィックスを指定することができます。
    • 作成するサムネイルサイズは複数指定することができます。大、中、小などできます。

あとは、以下の機能もあるっぽいですが、未調査のため省略させていただきます。

  • 登録されているファイルを削除
  • CakePHP の シェル機能 を利用して、一括サムネイル作成

 

Upload プラグインがやってくれないこと

一方で、以下のことはやってくれませんので、ご注意下さい。

  • 画像を View に表示するための Helper クラスなどの提供
  • サムネイル作成で新たに作成されたファイル名の登録
  • アップロードされたファイル名を自動的に変更 (※ 機能はあるのに未発見の可能性あり )

 

View で画像を表示するための、URLの生成などは自前で行う必要があります。一度 Helper クラス等として用意すれば、使いまわすことができて便利かと思います。

 

Upload プラグイン導入に必要なもの

公式には GitHub上 (英語) に記載されています。

  • CakePHP 2.x
  • PHP Imagick 拡張 or PHP GD 拡張 (*1)
  • PHP 5
  • 忍耐力 (*2)

(*1) サムネイル作成に必要です。サムネイル作成しない場合はなくても動作するかも知れません。

(*2)「忍耐力」は公式に記載されているだけで、実際には結構手軽に導入できました。

導入手順などは別記事でまとめたいと思います。

 

Imagick や GD は、レンタルサーバーによっては利用できない可能性がありますので、レンタルサーバーの仕様を確認しましょう。

手っ取り早いのは、<?php phpinfo(); ?> と記載したファイルを作成してアクセスすると、php の設定情報を確認できます。「GD」や「Imagick」などで検索し、enabled になっていれば OK です。該当のファイルは確認が済んだら消しておきましょう。

 

Upload プラグインの動作イメージ

Upload プラグインは Model の Behavior として動作します。

Behavior に登録すると、該当の Model を登録する際に、以下のことを行います。

  1. アップロードされた一時ファイル、格納予定ディレクトリに対して Validation チェック
  2. 格納予定ディレクトリを作成し、一時ファイルを移動
  3. 格納したディレクトリにて、指定された分だけサムネイルを作成
  4. Model にファイル名、ディレクトリ名、などの情報を埋めてレコード登録

例えば、webroot/files/image/attachment に保存する設定であれば、1件目として IMAGE01.jpg をアップロードすると、webroot/files/image/attachment/1 に、IMAGE01.jpg、thumb_IMAGE01.jpg、small_IMAGE01.jpg といった具合にオリジナルファイルと作成したサムネイルとが配置されます。

ファイル名用のカラムには IMAGE01.jpg が、ディレクトリ用のカラムには 1 が登録されます。

 

Upload プラグインを使う際の DB

Upload プラグインは、色々な使い方が可能です。登録するためのカラムがあれば良いので、以下のようなパターンがあります。

  • 既存のテーブルにカラムを追加する。
  • 新規に画像管理用のテーブルを追加する。

最低限必要なカラムは、画像ファイル名用のカラムと、ディレクトリ用のカラムの2つです。どちらも、VARCHAR(255) など文字列で OK です。

ファイルサイズやファイル種類などのカラムは残す必要がなければ不要です。

カラム名やテーブル名は、後で指定することができるので、任意の名前で構いません。

 

既存のテーブルにカラムを追加する場合

対象のテーブルと、1:1 でのみ使うようであれば、既存のテーブルに追加するのも良いかと思います。

既存のテーブルに追加する場合は、以下の作業が必要になります。

  • 既存のテーブルに、画像ファイル名用のカラムと、ディレクトリ用のカラムとを追加します。
  • 対象のテーブルに対応した Model に Behavior を登録します ($actsAs への追加)。

あとは必要に応じて、関連する Controller、View を変更しましょう。なお、bake での自動生成では対応していませんので、手動でカスタマイズする必要があります。

 

画像用に新規テーブルを追加する場合

対象のテーブルと、1:多 となる (複数画像を利用する) 場合や、画像管理は 1テーブルにまとめたい場合などには、新規テーブルを追加するのが良いかと思います。

また、既存のモジュールになるべく手を入れたくない場合にも良いかと思います。

新規テーブルを追加する場合は、以下の作業が必要になります。

  • 新規テーブルを追加します。
  • 新規テーブルに対応した Model を作成します。
  • 既存の Model に hasMany または hasOne のリレーションを登録します。

必要に応じて、Controller や View の変更、作成を行いましょう。

画像を一括管理し、複数モデルから参照されるような場合は、カラムに model : VARCHAR(n) と foreign_key int(n) などを追加しておくと扱いやすいかと思います。

参照する側の Model に リレーションとして、外部キー = foreign_key、条件に model = モデル名、 とするだけで、実現できます。

 

既存テーブルへのカラム追加 / 新規テーブル追加 どちらがおすすめ?

個人的なおすすめは、テーブル追加が扱いやすいかと思います。

既存のテーブルに追加の場合、新規登録時は、他カラムと合わせてファイルアップロード → 画像カラムも登録で問題ありません。ただ、Update する時に、またファイルアップロードするわけにもいかず、といった辺りのハンドリングが必要となるので少し面倒かと思います。

 

ちょっと複雑な使い方

複数カラムの追加

( 以下は実際に動作させてはいませんので、予想を含みます )

複数画像をセットで使うような場合は、ファイル名のカラムを複数用意することで対応できます。

例えば、ユーザーのアイコン用画像と、背景用画像といった場合は、それぞれのカラムと登録用の Form を用意すれば OK です。カラムは例えば、icon_file_name と bg_file_name などを用意します。

アップロード後に配置されるディレクトリは同じディレクトリになりますので、ディレクトリ用のカラムは 1つ用意しておけば OK です。つまり、1 レコードに対して 1つ、ディレクトリ「名」を新規作成する動作になるかと思います。

Behavior の設定により、対応するカラム毎に、格納するディレクトリ (ベース) を変えることはできます。

icon 用は、app/webroot/files/icon/ 以下に、背景画像用は、app/webroot/files/bg/ 以下に、といった設定が可能です。その場合、1 件目は app/webroot/files/icon/1 と app/webroot/files/bg/1 に、という動作になるかと思います。ディレクトリ名「1」を生成し、それぞれの格納するベースディレクトリにそのディレクトリを作成して … という動作です。

 

ひとこと

Upload プラグインの動作についてイメージできましたでしょうか。

実際のコード例を用いた説明は次回行いたいと思います。

[pn-box color=”lgray”]

次の記事は、以下になります。良かったら以下もご覧下さい。
しっかり理解する CakePHP Upload プラグインの使い方 (1) 導入・DB, Model 変更

[pn-box-close]

今回は以上です。


[pn-amzn-cakephp]

コメントする

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