cakephp3.xCakeManagerで画像アップロード

2016年8月25日更新 view: 96 view
https://image.freepik.com/free-icon/_318-26670.jpg

まずはアップロードできるようにしよう

composer.jsonに以下を追記

"cakemanager/cakephp-utils": "dev-master"

そしてcomposerのアップデート

composer update cakemanager

bootstrap.phpで読み込み

Plugin::load('Utils');

これでインストール完了です。

つづいて画像をアップロードするまで

今回は
・Gazousコントローラーに
・1枚の写真をアップロードして
・画像を /uploads/gazous/ に保存

という条件で。

まずはDBの作成

CREATE TABLE IF NOT EXISTS `gazous` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`title` varchar(64) NOT NULL,
`photo` varchar(255) DEFAULT NULL,
`photo_url` varchar(255) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ;

GazousController.php

<?php
namespace App\Controller;

class GazousController extends AppController
{
public function index()
{
$imgs = $this->Gazous->find()
->all();
if($this->request->data){
$ent = $this->Gazous->newEntity($this->request->data);
if($this->Gazous->save($ent)){
//OK
} else {
//NG
}
}
$this->set(
compact(
'imgs'
)
);


}
}

/Template/Gazous/index.ctp

画像をアップロード
<?php echo $this->Form->create('Gazous', ['type' => 'file']); ?>
<?php echo $this->Form->input('title',['value' => 'hogeman']); ?>
<?php echo $this->Form->input('photo', ['type' => 'file']); ?>
<?= $this->Form->button('投稿') ?>
<?php echo $this->Form->end(); ?>


<h2>アップロードされた画像</h2>

<? foreach ($imgs as $v): ?>
<img src="<?=$v['photo_url'];?>">
<? endforeach; ?>

/Model/Table/GazousTable.php

<?php
namespace App\Model\Table;
use Cake\ORM\Table;

class GazousTable extends Table {

public function initialize(array $config) {
$this->primaryKey('id');
$this->addBehavior('Utils.Uploadable', [
'photo' => [
'field' => 'id',
'path' => '{ROOT}{DS}{WEBROOT}{DS}uploads{DS}{model}{DS}',
'fileName' => '{field}.{extension}'
,'fields' => [
'url' => 'photo_url',
'filePath' => 'photo'
],
],
]);
}
}

保存用ディレクトリを作成

スポンサードリンク

/webroot/uploads/gazous/
フォルダを作ってパーミッションを777に。

以上。
これで正常に動作します。

スポンサードリンク

関連記事

関連カテゴリ