4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

CakePHPで画像の登録確認画面を実装する

Last updated at Posted at 2015-05-27

CakephpのプラグインにUploadPackを使います。

このプラグインはデータベースを使うので以下のようにまずはテーブルを作ります。

CREATE TABLE `images` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `image_file_name` varchar(255) CHARACTER SET utf8 DEFAULT NULL,
  `created` datetime NOT NULL,
  `updated` datetime NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=168 DEFAULT CHARSET=latin1

続いてModel定義

<?php
App::uses('AppModel', 'Model');

/**
 * Image Model
 *
 */
class Image extends AppModel
{
	var $name = 'WatchImage';
	var $actsAs = array(
		'UploadPack.Upload' => array(
			'image' => array(
				'quality' => 95,
				'path' => ':webroot/upload/:model/:id.:extension',
			),
		),
	);

	public $validate = array(
		'image' => array(

			// ルール:uploadError => errorを検証 (2.2 以降)
			'upload-file' => array(
				'rule' => array( 'uploadError'),
				'message' => array( '画像を登録してください')
			),

			// ルール:extension => pathinfoを使用して拡張子を検証
			'extension' => array(
				'rule' => array( 'extension', array(
					'jpg', 'jpeg', 'png', 'gif')  // 拡張子を配列で定義
				),
				'message' => array( '無効な画像形式です')
			),

			// ルール:mimeType =>
			// finfo_file(もしくは、mime_content_type)でファイルのmimeを検証 (2.2 以降)
			// 2.5 以降 - MIMEタイプを正規表現(文字列)で設定可能に
			'mimetype' => array(
				'rule' => array( 'mimeType', array(
					'image/jpeg', 'image/png', 'image/gif')  // MIMEタイプを配列で定義
				),
				'message' => array( '無効な画像形式です')
			),

			// ルール:fileSize => filesizeでファイルサイズを検証(2GBまで)  (2.3 以降)
			'size' => array(
				'maxFileSize' => array(
					'rule' => array( 'fileSize', '<=', '10MB'),  // 10M以下
					'message' => array( '画像サイズオーバーです')
				),
				'minFileSize' => array(
					'rule' => array( 'fileSize', '>',  0),    // 0バイトより大
					'message' => array( '画像を登録してください')
				),
			),
		),
	);
}

ポイントはvalidateは普通にcakeのフォームヘルパー使う部分と、アップロード先を設定する部分です。
'path' => ':webroot/upload/:model/:id.:extension',
こんな感じで定義します。

続いてentryのviewです。

<?php echo $this->Form->input('WatchImage.image',array('type'=>'file','label'=>false)); ?>
<?php
echo $this->Form->create(null,
array('type'=>'post','action'=>'./confirm','type'=>'file', 'enctype' => 'multipart/form-data','novalidate' => true));
?>
<?php echo $this->Form->submit('確認画面'); ?>
<?php echo $this->Form->end(); ?>

次はcontrollerです。

<?php
class EntriesController extends AppController
{
public $use = "Images";
public $helpers = array('Form', 'UploadPack.Upload');
function index(){
    if(isset($this->request->data["Images"]["image"]))

      if($this->WatchImage->validates()){
        $this->Image->save($this->request->data["Image"]);
        $this->set("watch_images_id", $this->WatchImage->id);
	$this->render('confirm');
      }else{
	$this->render('entry');
      }

    }else{
	$this->render('entry');
    }
}
?>

という感じで定義します。

この時大事なのが、validateを通るとイメージは登録されるのですがモデルで定義した名前とテーブルで定義したimage_file_nameは内容が一致しませんので気をつけましょう。
image_file_nameにはアップした画像名が登録されるようです。実際定義したファイル名でファイルはアップされているので安心して下さい。
confirm(確認画面)を出力するのですが実際には、先に登録はしちゃってます。
そしてimagesテーブルのIDを変数としてViewのconfirmに渡します。

下記がconfirmのViewです

<?php
echo $this->Form->create(null,
array('type'=>'post','action'=>'/add','type'=>'file', 'enctype' => 'multipart/form-data','novalidate' => true));

$png_filename = "/fullpath/".$images_id.".png";
$jpg_filename = "/fullpath/".$images_id.".jpg";
$jpeg_filename = "/fullpath/".$images_id.".jpeg";
$gif_filename = "/fullpath/".$images_id.".gif";

if (file_exists($png_filename)) {
	$filename = "/upload/".$images_id.".png";
}else if(file_exists($jpg_filename)){
	$filename = "/upload/".$images_id.".jpg";
}else if($jpeg_filename){
	$filename = "/upload/".$images_id.".jpeg";
}else{
	$filename = "/upload/".$watch_images_id.".gif";
}
?>
<img src="<?php echo $filename; ?>" alt="">
<?php echo $this->Form->hidden('images_id', array('value'=>$images_id)); ?>
<?php echo $this->Form->end(); ?>

とこんな感じで確認画面を作ります。
登録画面は
コントローラでadd()するとして、hiddenでもってるimages_idこれを元に登録すれば問題なく処理できます。
以上です。

4
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?