純粋な画像アップロードフォームの作成と画像の加工処理

アップロードのフォームの作成

Laravel4で画像のアップロードフォームを作成します。

routes.php

最初にルーティングを定義してURLとControllerを関連付けます。

Route::get('/', array('uses'=>'UploadController@getIndex'));
Route::post('/', array('uses'=>'UploadController@postIndex'));

UploadController内に

• フォームを表示するgetIndex
• ファイルをアップロードするpostIndex

2つのアクションを作成し、/(ルート)にマッピングしました。

Controller

getIndex

フォームを表示するgetIndexアクションは、Viewを呼び出す処理のみを書いておきます。

class UploadController extends BaseController {

  public function getIndex()
  {
    return View::make('template.upload');
  }
}

呼び出されるViewファイルは

app/views/template/upload.blade.php

になります。

postIndex

後述します。

View

upload.blade.phpでは、純粋なファイルアップロードを行うHTMLフォームを生成します。

@if(Session::has('success'))
  <h3 class="success">{{Session::get('success')}}</h3>
@endif

{{Form::open(array('url' => '/', 'files' => true))}}
{{Form::file('image')}}
{{Form::submit('アップロード')}}
{{Form::close()}}

冒頭のコードは、successセッションが存在した場合にアップロード成功のメッセージを表示するif文です。bladeのテンプレートタグを利用したコードですが、ここまでの作業で画像のフォームを表示することが出来ます。

ファイルアップロード処理

ファイルをアップロードするpostIndexアクションについて書きます。

UploadController内に以下のアクションを追加します。

public function postIndex()
{
  // アップロード画像を取得
  $image = Input::file('image');

  // ファイル名を生成し画像をアップロード
  $name = md5(sha1(uniqid(mt_rand(), true))).'.'.$image->getClientOriginalExtension();
  $upload = $image->move('media', $name);

  // アップロード成功のメッセージを定義
  $data = array(
    'success' => '画像がアップロードされました',
  );

  // メッセージをセッションに格納しリダイレクト
  return Redirect::to(URL::to('/'))
    ->with($data);
}

上のコードによりアップロードされたファイルは、

• /public/media
• /public/media/mini

に格納されるので、フォルダを作成しておきます。

画像の加工

Intervention Imageのインストール

画像の加工処理にIntervention Imageを利用します。Installationにcomposerを利用したインストール方法が載っています。

Integration in Laravelで解説されていますが、

config/app.php

で

• $providers
• $aliases

を設定すればIntervention Imageが利用可能になります。

サムネイル生成に対応したpostIndex

画像のアップロードだけでなく、画像を縮小したサムネイルも保存可能にしたpostIndexが以下のコードです。

public function postIndex()
{
  $image = Input::file('image');

  $name = md5(sha1(uniqid(mt_rand(), true))).'.'.$image->getClientOriginalExtension();
  $upload = $image->move('media', $name);
		
  // サムネイル生成保存処理
  Image::make('media/'.$name)
    ->resize(60, 60)
    ->save('media/mini/'.$name);

  // セッションデータを追加
  $data = array(
    'success' => '画像がアップロードされました',
    'filename' => $name,
  );
		
  return Redirect::to(URL::to('/'))
    ->with($data);
}

サムネイル生成処理とセッションデータを追加してファイル名をView側で利用可能にしたのが上のコードです。

upload.blade.phpでアップロード後の画像を即時表示するために、以下のコードを追加します。

@if(Session::has('filename'))
  {{HTML::image('media/'.Session::get('filename'))}}
  {{HTML::image('media/mini/'.Session::get('filename'))}}
@endif