はじめに

導入

運用

参加・貢献

リソース

GitHubでこのページを編集

Home / 5 / plugin / ファイルアップロード

ファイルアップロード

ファイルのアップロード機能の実装は、サムネイルを作成したり、削除機能を付けたりと面倒なものですが、baserCMSでは BcUploadBehaviorBcUploadHelper を利用することで簡単に実装することができます。

ここでは、DBテーブルのカラムにアップロードしたファイル名を保存することを前提に、ファイルアップロード機能の実装方法を説明します。

コントロールの配置

DBテーブルのレコードの編集画面に、ヘルパーを利用してアップロードコントロールを配置します。

echo $this->BcAdminForm->control("eyecatch", [
    'type' => 'file', 
    // アップロードした画像を表示する際の設定キーを指定します(ビヘイビアで設定)
    'imgsize' => 'thumb'
])

BcAdminFormHelper は、内部的に BcUploadHelper を利用しています。

DBテーブルへの保存、読み出し設定

DBテーブルへの保存や、読み出しについては、テーブルクラスに BcUploadBehavior を定義することで簡単に実装できます。

// 実装例
public function initialize(array $config): void
{
   $this->addBehavior('BaserCore.BcUpload', [
        // 保存フォルダ名
        'saveDir' => "editor",
        // サブフォルダフォーマット
        // 保存フォルダをサブフォルダで分類する場合に設定
        'subdirDateFormat' => 'Y/m',
        // フィールドごとの設定
        'fields' => [
            // カラム名
            'image' => [
                // ファイルタイプ
                // all | image | ファイルの拡張子
                'type' => 'image',
                // ファイル名を変換する際に参照するカラム名
                'namefield' => 'id',
                // ファイル名を変換する場合のフォーマット
                'nameformat' => '%08d',
                // ファイル名に追加する文字列
                // true | false
                'nameadd' => false,
                // リサイズ設定
                // アップロードした本体画像をリサイズ
                'imageresize' => [
                    // 横幅
                    'width' => '100',
                    // 高さ
                    'height' => '100'
                ],
                // コピー設定
                'imagecopy' => [
                    // 表示する際の設定キー
                    'thumb' => [
                        // ファイル名につけるサフィックス
                        'suffix' => 'template',
                        'width' => '150',
                        'height' => '150'
                    ],
                    'thumb_mobile' => [
                        'suffix' => 'template',
                        'width' => '100',
                        'height' => '100'
                    ]
                ]
            ],
            'pdf' => [
                'type' => 'pdf',
                'namefield' => 'id',
                'nameformat' => '%d',
                'nameadd' => false
            ]
        ]
    ]);
}

ファイルの保存先

/webroot/files/ 配下にて、設定値 saveDir で設定したフォルダに保存します。
また、設定値 subdirDateFormat を定義している場合、保存日をベースとしたフォーマットでサブフォルダを作成しそこに保存します。

# saveDir が 「contents」、subdirDateFormat が 「Y/m」 の場合
/webroot/files/contents/2023/05/

フィールドごとの設定

設定値 fields に配列で、複数のフィールドに対してファイルを保存できるように設定できます。
fields を設定する場合、各フィールドのカラム名をキーとして定義します。

ファイルのタイプ

設定値 type でファイルのタイプを設定します。

  • all:全てのファイル
  • image:画像ファイル
  • その他、ファイルの拡張子を設定します。

ファイルのリネーム

フィールド値に基づいたリネーム

例えば、ID に基づいたファイル名にしたい場合、設定値 namefieldid を設定し、設定値 nameformat に、フォーマットを設定します。

// namefield を id、nameformat を %08d と設定し、id が 52 の場合
'00000052.png'

フィールド名を追加する

設定値 nameaddtrue に設定することで、ファイル名に、カラム名を追加します。

// カラム名 eyecatch の場合
'00000052_eyecatch.png'

プレフィックス

設定値 prefix を設定することで、ファイル名にプレフィックスを設定します。

// prefix を smartphone_ とした場合 
'smartphone_00000052.png'

サフィックス

設定値 suffix を設定することで、ファイル名にサフィックスを設定します。

// suffix を _smartphone とした場合 
'00000052_smartphone.png'

画像のリサイズ

画像をリサイズする場合は、設定値 imageresize に配列で次の内容を定義します。

  • width:横幅
  • height:高さ

その際、プレフィックスやサフィックスも設定できます。

画像のコピー

設定値 imagecopy に配列で複数のコピー設定を定義することができます。

配列のキーに画像を特定する文字列を設定しますが、そうすることで、ヘルパーでコントロールを配置する際に表示する画像を指定することができます。

また、画像のリサイズと同様に、横幅、高さ、プレフィックス、サフィックスが定義できます。

ファイルの保存処理

ファイルの保存処理は、テーブルクラスの save 実行時に、BcUploadBehavior が自動で処理しますが、afterSave で保存しています。

保存の流れは次のようになっています。

  1. beforeMarshal
    • ポストデータを最適化し保存対象かどうか判定
  2. afterSave
    • 保存対象のフィールドの古いファイルを削除
    • 保存対象のファイルを保存
    • 削除にチェックが入っているフィールドのファイルを削除
    • ファイルをリネーム

ファイルの削除処理

アップロード済のファイルを削除するには、アップロードコントロールに配置された「削除する」というチェックボックスにチェックを入れ、レコードの保存処理を実行します。その際、afterSave で処理を実行します。

また、レコードを削除する際も自動的にファイルを削除します。その際は、beforeDelete で処理を実行します。

ファイルの一時保存

確認画面を作りたい場合や、プレビューを行いたい場合、ファイルをPHPにおけるセッションに一時的に保存することができます。

一時保存処理

一時保存を実行するには、 BcUploadBehaviorsaveTmpFiles メソッドを実行します。

BlogPosts テーブルで実行する場合は次のようになります。

$blogPostsTable->saveTmpFiles($post, mt_rand(0, 99999999));

第一引数には、エンティティデータを配列で、第二引数には、ランダムの数値をセットします。

一時保存ファイルの保存処理

セッション内に一時ファイルが存在し、対象テーブルクラスで save を実行すると、
beforeMarshal のタイミングで、セッションからファイルを復元し、その後、自動的に保存します。

その場合、保存対象のデータの中に {フィールド名}_tmp というキーでセッションIDを含めている必要がありますが、ヘルパーを利用している場合、自動的に追加されます。

プレビュー処理

UploadsController を利用することで、セッション内のファイルを表示することができます。

その際のURLは次のようになります。

/uploads/tmp/{セッションID}

なお、ヘルパーを利用している場合は、セッションの有無を判断し、自動的に表示対象のURLを切り替えますので意識する必要はありません。