はじめに
Laravelにて簡単な画像付きレシピ投稿アプリを作成しています。
画像のアップロード機能を実装した際にシンボリックリンクという言葉を初めて知ったので、備忘録として記録しておくことにしました。
シンボリックリンクとは
Windouwsでいうところのショートカットのようなもの。
シンボリックリンクファイルを通して大元のフォルダを参照することができます。
やりたいこと
投稿フォームから画像を選択し送信ボタンを押すと一覧で表示されるという仕組み。
画像ファイルを選択し送信ボタンをクリック
一覧画面へ画像を表示
ここでレシピ投稿アプリなのに料理の写真ねーじゃん!とツッコまれる
画像の保存先
さて、コントローラーで受け取った画像ファイルは基本的に storage/app/public/image
内に保存させます。
public function create(Request $request){
$recipe = new Recipe;
$form = $request->all();
//画像が送信されたら保存して $recipe->image_pathカラム にパスを保存する
if (isset($form['image'])) {//変数に値が入っているかをチェック
$path = $request->file('image')->store('image');// 画像をstorage/app/public/image配下に保存
$recipe->image_path = basename($path);//パスからを取得したファイル名をimage_pathカラムに保存
} else {
$recipe->image_path = null;
}
unset($form['_token']);
unset($form['image']);
$recipe->fill($form)->save();
return redirect('/home');
}
ただ、実際にアプリケーションを起動するときに公開されるのはpublicディレクトリのみです。画像はstorage/app/public/image
に保存されているので画像データを持ってくることはできません。
そんなときにpublicディレクトリ
からstorage/app/public/image
へのショートカット機能の役割を果たすのががシンボリックリンクです。
シンボリックリンクの貼り方
artisanコマンドから簡単にできます。
まずpublicディレクトリへ移動します。
$ cd public
以下のコマンドを実行します。
$ php artisan storage:link
するとpublic内にstorageフォルダができます。(ショートカットが作成されるの方がわかりやすいかも)
矢印ができます。
public/image
と進んでいくと、storage/app/public/image
と同じ画像ファイルが存在していることがわかるかと思います。
ビューに画像を表示させる
画像表示部分のみ
<img src="{{ asset('storage/image/' . $recipe->image_path) }}" width="100%" heigth="100%" alt="">
asset('ファイルパス')
はpublicディレクトリのパスを返す関数です。
丁寧に書くと、app/public/storage/image/[画像のパス名]
となるわけです。
さっきシンボリックリンクを貼ったおかげでこのフォルダパスを通すことができました。
終わり。