CakePHP3の画像、ファイルアップロードプラグインUpload Plugin 3.0の設置解説・その１

2017/11/24 2017/11/26

CakePHP3のファイルアップロードプラグインUpload Plugin 3.0の設置

　
CakePHP3でファイルのアップロードを行う処理を作成します。
　
今回は、オーソドックスなプラグインである「Upload Plugin 3.0」を設置する方法の解説です。
　
　

Upload Plugin 3.0の動作環境

　
最初に「Upload Plugin 3.0」を利用するために必要な環境を書いておきます。
　

CakePHP3.x
PHP 5.4以上
PHP Imagick 拡張 or PHP GD 拡張

　
CakePHP3に導入するための記事として書いていますので、最初の 2項目は問題ないと思います。
　
3項目目の「PHP Imagick 拡張 or PHP GD 拡張」は、レンタルサーバでは利用できない場合もありますので、確認が必要です。
ただ、この機能はサムネイルを作成する際に必要となる機能ですので、サムネイルを作成しない場合はなくても問題ありません。
　
　

ファイルアップロードプラグイン Upload Plugin 3.0関連記事

　
この記事は、3記事で構成されています。
　
まず、この記事では、Upload Plugin 3.0の基本的な設置方法を解説します。
CakePHP3の画像、ファイルアップロードプラグインUpload Plugin 3.0の設置解説・その１
　
続いて、下記の記事では、Upload Plugin 3.0を実運用に耐えうるように、ファイルのバリデーションや、アップロードするファイルを複数にする安倍などのカスタマイズする方法を解説します。
CakePHP3のUpload Plugin 3.0をバリデーションなど実運用向けのカスタマイズ方法解説・その２
　
最後の記事では、2記事までで解説した画像を新規登録でアップロードする処理に続く処理として、記事を更新する際の処理、および、登録した画像を表示する処理について解説します。
CakePHP3の更新画面でUpload Plugin 3.0を使う方法、viewで使う方法解説・その３
　
　
ちなみに、ファイルのアップロード処理は、PHP自体がサポートしていますので、プラグインを使わなくても比較的簡単に実装することができます。
　
その CakePHP3でファイルのアップロード処理を自作した際の、ソースコード付きの解説記事を下記で書いていますので合わせて参考にしてみてください。
CakePHP3でファイルのアップロード処理を自作・解説付き・その１
 CakePHP3で画像・ファイルのアップロード処理を自作・解説付き・その２
　
ファイルアップロード処理の理解のために読んでみるのもいいかもしれません。
　
　
　

CakePHP3にファイルアップロードプラグイン Upload Plugin 3.0を設置する手順

１．「josegonzalez/cakephp-upload」のインストール

　
まずはプラグインである「josegonzalez/cakephp-upload」をインストールします。
　
コンソールから「composer require josegonzalez/cakephp-upload」を実行します。
下記は、Windowsの XAMPP環境でコマンドを実行する際の例です。
　

C:\xampp\htdocs\cake> composer require josegonzalez/cakephp-upload

1	C:\xampp\htdocs\cake> composer require josegonzalez/cakephp-upload

　
　
Composerの使い方については「CakePHP3でcomposerを利用してライブラリ・プラグインをインストールする方法」を参考にしてください。
　
　

２．ロードする設定を「config/bootstrap.php」に記述

　
続いてプラグインをロードする設定を「config/bootstrap.php」に記述します。
　
　

CakePHP3のコマンドを実行して「config/bootstrap.php」に記述する方法

　
Upload Plugin 3.0をインストールするために、コマンドを実行しましたので、その続きとしてコマンドで「Josegonzalez/Upload」をロードする設定を「config/bootstrap.php」に記述するコマンドを実行する方法です。
　
コマンドプロンプトから「bin/cake plugin load Josegonzalez/Upload」を実行します。
下記は、Windowsの XAMPP環境でコマンドを実行する際の例です。
　

C:\xampp\htdocs\cake> bin/cake plugin load Josegonzalez/Upload

1	C:\xampp\htdocs\cake> bin/cake plugin load Josegonzalez/Upload

'bin' は、内部コマンドまたは外部コマンド、
操作可能なプログラムまたはバッチ ファイルとして認識されていません。

1 2	'bin' は、内部コマンドまたは外部コマンド、操作可能なプログラムまたはバッチファイルとして認識されていません。

上記のエラーが出る場合は、パスが設定されていない場合が多くあります。
パスが設定されていない場合は、「/アプリのルート/bin」フォルダの中に入って、「cake plugin load Josegonzalez/Upload」を実行します。
　
　

手作業で「config/bootstrap.php」に記述する方法

　
上記の通り、コマンドを実行する方法もありますが、コマンドを実行して処理される内容を手作業で行う方法もあります。
　
具体的には、「/config/bootstrap.php」に下記を追記します。
　

Plugin::load('Josegonzalez/Upload');

1	Plugin::load('Josegonzalez/Upload');

　
追記する場所は、「/config/bootstrap.php」ファイルの一番下など、他のプラグインのロードが記述されているところに並べて書くといいでしょう。
　
　

３．画像データを保存するカラムをテーブルに追加

　
テーブルに、アップロードする画像を保存するカラムを設定します。
（下記のサンプルは、topicsという「お知らせ」を管理するテーブルの想定で、10行目～13行目が対象のカラムになります。）
　

mysql> show columns from topics;
+--------------------+------------+------+-----+---------+----------------+
| Field              | Type       | Null | Key | Default | Extra          |
+--------------------+------------+------+-----+---------+----------------+
| id                 | int(11)    | NO   | PRI | NULL    | auto_increment |
| topics_date        | date       | YES  |     | NULL    |                |
| title              | text       | YES  |     | NULL    |                |
| body               | text       | YES  |     | NULL    |                |
| link_url           | text       | YES  |     | NULL    |                |
| image              | text       | YES  |     | NULL    |                |
| dir                | text       | YES  |     | NULL    |                |
| type               | text       | YES  |     | NULL    |                |
| size               | int(11)    | YES  |     | NULL    |                |
| publish_flag       | tinyint(4) | YES  |     | NULL    |                |
| publish_date       | datetime   | YES  |     | NULL    |                |
| created            | datetime   | NO   |     | NULL    |                |
| modified           | datetime   | NO   |     | NULL    |                |
+--------------------+------------+------+-----+---------+----------------+

mysql> show columns from topics;

+--------------------+------------+------+-----+---------+----------------+

+--------------------+------------+------+-----+---------+----------------+

| id | int(11) | NO | PRI | NULL | auto_increment |

| dir | text | YES | | NULL | |

| size | int(11) | YES | | NULL | |

+--------------------+------------+------+-----+---------+----------------+

　
「Upload Plugin 3.0」で保存することができる値は「ファイル名」「保存フォルダのパス」「ファイルのタイプ」「ファイルのサイズ」です。
　
それを、それぞれ「image」「dir」「type」「size」として登録します。
型は「image」「dir」「type」が文字列型で、「size」が数値型です。
　
プラグインを制作した（であろう）方のブログでは、文字列型は「varchar(255)」を使用していましたが、文字列型であればなんでも問題ありません。ただ、長さを指定するなら「255」が無難であろうと思います。
sizeの数値型も decimalでも問題ありません。ファイルサイズが byte単位で保存される項目ですので、想定しているファイルの容量によって適切な型を選択しましょう。
　
また、登録できる項目は「ファイル名」「保存フォルダのパス」「ファイルのタイプ」「ファイルのサイズ」と書きましたが、必要な項目だけ設定すれば OKです。
普通は「ファイル名」「保存フォルダのパス」があれば足りるでしょう。
　
　

４．ファイルの保存先を作成

　
アップロードされたファイルが保存される場所を用意します。
　
デフォルトの設定では、下記の場所に保存されます。
　/ webroot / files / { テーブル名 } / { フィールド名 }
　
　
保存するフォルダがない場合は、自動的に生成されますので、Windowsの XAMPP環境では事前に作成しなくても全く問題ありません。
ですが、Linuxのようにフォルダのパーミッションが管理されている OSの場合は、フォルダを作ってパーミッションの設定を確認しておく方がいいでしょう。
　
　

５．モデルクラスにプラグインを利用する処理を追記

　
モデルのクラスにプラグインが利用する処理を追記します。
　
対象となるファイルは、以下の通りです。
/src/Model/Table/TopicsTable.php
　
　
記述する内容は以下の通りです。（下記の 9行目～12行目です。）
　

    public function initialize(array $config)
    {
        parent::initialize($config);

        $this->setTable('topics');
        $this->setDisplayField('title');
        $this->setPrimaryKey('id');

        // Upload Plugin
        $this->addBehavior('Josegonzalez/Upload.Upload', [
            'image' => [],
        ]);

    }

public function initialize(array $config)

{

parent::initialize($config);

$this->setTable('topics');

$this->setDisplayField('title');

$this->setPrimaryKey('id');

// Upload Plugin

$this->addBehavior('Josegonzalez/Upload.Upload', [

'image' => [],

]);

}

６．フォームテンプレートにファイルアップロード処理を追記

フォームタグの createに「enctype」「type」を追記

　
フォームタグ（<form>）を生成する createに「type」を追加します。
　

    <?= $this->Form->create($topic, ['enctype' => 'multipart/form-data']); ?>
または
    <?= $this->Form->create($topic, ['type' => 'file']); ?>

<?= $this->Form->create($topic, ['enctype' => 'multipart/form-data']); ?>

または

<?= $this->Form->create($topic, ['type' => 'file']); ?>

フォームタグの inputに「type」を追記

　
続けて、ファイルを入力する項目にも「type」を追加します。
　

echo $this->Form->control('image',["type"=>"file"]);

1	echo $this->Form->control('image',["type"=>"file"]);

　
フォームヘルパーの使い方に関しては、「CakePHP3のForm Helperの使い方のまとめ」に記事を書いていますので、参考にしてください。
　
　
これで、ファイルのアップロードができるようになります。
　
　

Upload Plugin 3.0の設定時のエラーについて

　
Upload Plugin 3.0を設定する際に発生するエラーについて解説します。
　
　

「Missing Plugin」と表示される

　
Upload Plugin 3.0をインストールしたにもかかわらず、画面を表示すると下記の様に「Missing Plugin」と表示される場合の対処方法です。
　

Missing Plugin
Cake\Core\Exception\MissingPluginException

Error: The application is trying to load a file from the Josegonzalez/Upload plugin.

Make sure your plugin Josegonzalez/Upload is in the C:\xampp\htdocs\cake\plugins\ directory and was loaded.

Missing Plugin

Cake\Core\Exception\MissingPluginException

Error: The application is trying to load a file from the Josegonzalez/Upload plugin.

Make sure your plugin Josegonzalez/Upload is in the C:\xampp\htdocs\cake\plugins\ directory and was loaded.

　
「インストールした Upload Plugin 3.0が正しく処理されず、Upload Plugin 3.0を見つけることができない」というエラーです。
　
対処方法は、改めて「Upload Plugin 3.0」をインストールし直すと問題は解決しました。
　
　

- CakePHP 3.x 4.x CakePHP3

最後までお読みいただきましてありがとうございます。
この記事が参考になったと思いましたらソーシャルメディアで共有していただけると嬉しいです！

Message コメントをキャンセル

※入力いただいたコメントは管理者の承認後に掲載されます。

: CakePHP 2.3　Search Pluginで検索処理　その５入力項目に複数項目入力した場合の AND検索、OR検索

CakePHPの検索プラグイン Search Pluginの検索処理の中で複数項目を入力した場合の AND検索、OR検索についての解説です。

: CakePHP 2.3　テーブルの項目を演算した結果を条件として抽出する方法

アソシエーション（連携）している先のテーブルの項目で演算をする場合の考え方と注意点をサンプルソースを用いて説明しています。分かってしまえば簡単です。

: CakePHP3のfriendsofcake/searchでツリーカテゴリーの子階層も含めて検索する方法

CakePHP3のツリービヘイビアを使ったツリーカテゴリーの子階層も含めての検索を検索プラグイン「friendsofcake/search」を使って実現する方法を解説しました。

: CakePHP3で現在処理しているコントローラー名、アクション名を取得する方法

CakePHP3で現在処理しているコントローラー名、アクション名を取得する方法を解説。複数の方法があるが、getParam()メソッドを使う方法が汎用性があって便利かも。

: CakePHP3で保存前にバリデーション結果を取得する2つの方法

CakePHP3でデータベースに値を保存する前にバリデーションを行い、その結果によって処理を振り分ける方法について解説。「$topic->errors()」と「$topic->hasErrors()」の2つの方法がある。

: CakePHP3でDocumentRootやtmp、webroot、logsなどのフォルダへのパスの定数

CakePHP3で特定フォルダのパスの定数を解説。root、DocumentRoot、app、config、webroot、tests、tmp、cache、vendor、コア、コアの srcが設定済み。realpath()関数を使うと柔軟なパス指定が可能。

: CakePHP4の数値項目は「like %10%」の部分一致検索（find select）はできない

CakePHP4でテーブルの数値項目に対してlike句を使用した部分一致検索を実行するとエラーが発生する。クリエービルダーの不具合だと思われ対処方法が分からない。

: CakePHP4の規約外のカラムをキーにアソシエーション（テーブル連結）する方法

CakePHPで規定外のカラム名のキーを指定してアソシエーション（テーブル連結）をする方法を解説。アソシエーション名によってはミスが発生しやすい点もあるので注意も必要。

: CakePHP3で環境変数を設定して本番環境と開発環境を分けて処理をする場合

CakePHP3で開発環境と本番環境とで違う設定ファイルを読み込ませて環境ごとに定数を切り替える方法を解説。Apacheのhttpd.confに環境変数を設定し、それを読み込み判別する。

: CakePHP3のCakeDC/UsersのUserHelperでログアウトやreCAPTCHAをカスタマイズ

CakeDC謹製Usersプラグインの紹介。UserHelperを利用し、ログアウトのリンクや権限があるときのみ表示されるリンク、プロフィールページへのリンク、reCAPTCHAの設置方法などを解説。

PREV: CakePHP3でユーザ定義の定数、変数を設定し、読み込む方法解説
NEXT: CakePHP3のUpload Plugin 3.0をバリデーションなど実運用向けのカスタマイズ方法解説・その２

日	月	火	水	木	金	土
		1	2	3	4	5
6	7	8	9	10	11	12
13	14	15	16	17	18	19
20	21	22	23	24	25	26
27	28	29	30	31

CakePHP3の画像、ファイルアップロードプラグインUpload Plugin 3.0の設置解説・その１

CakePHP3のファイルアップロードプラグインUpload Plugin 3.0の設置

Upload Plugin 3.0の動作環境

ファイルアップロードプラグイン Upload Plugin 3.0関連記事

CakePHP3にファイルアップロードプラグイン Upload Plugin 3.0を設置する手順

１．「josegonzalez/cakephp-upload」のインストール

２．ロードする設定を「config/bootstrap.php」に記述

CakePHP3のコマンドを実行して「config/bootstrap.php」に記述する方法

手作業で「config/bootstrap.php」に記述する方法

３．画像データを保存するカラムをテーブルに追加

４．ファイルの保存先を作成

５．モデルクラスにプラグインを利用する処理を追記

６．フォームテンプレートにファイルアップロード処理を追記

フォームタグの createに「enctype」「type」を追記

フォームタグの inputに「type」を追記

Upload Plugin 3.0の設定時のエラーについて

「Missing Plugin」と表示される

CakePHP3の関連記事

GoogleAdwords

GoogleAdwords

Message コメントをキャンセル

関連記事

CakePHP 2.3　Search Pluginで検索処理　その５入力項目に複数項目入力した場合の AND検索、OR検索

CakePHP 2.3　テーブルの項目を演算した結果を条件として抽出する方法

CakePHP3のfriendsofcake/searchでツリーカテゴリーの子階層も含めて検索する方法

CakePHP3で現在処理しているコントローラー名、アクション名を取得する方法

CakePHP3で保存前にバリデーション結果を取得する2つの方法

CakePHP3でDocumentRootやtmp、webroot、logsなどのフォルダへのパスの定数

CakePHP4の数値項目は「like %10%」の部分一致検索（find select）はできない

CakePHP4の規約外のカラムをキーにアソシエーション（テーブル連結）する方法

CakePHP3で環境変数を設定して本番環境と開発環境を分けて処理をする場合

CakePHP3のCakeDC/UsersのUserHelperでログアウトやreCAPTCHAをカスタマイズ

WordPress投稿にPHPを記述するショートコードの使い方add_shortcode

コピーコンテンツ対策.htaccessで直リンク禁止しリダイレクトで対応

評価点投票プラグイン10個を比較！WordPressで口コミサイトを構築

BackWPupでバックアップ・リストア（復元）の具体的手順

コンパクトキーボード・KEK-EA9AU・FKB1420の魅力