ホーム > Laravel > Laravelのストレージを使って画像ファイルを保存する方法
Laravel

Laravelのストレージを使って画像ファイルを保存する方法

いつもご利用ありがとうございます。
この記事には広告が掲載されており、その広告費によって運営しています。

Laravel のストレージを使って画像ファイルを保存する方法についてまとめました。

主に、このページに書かれている内容を使って実践しています。

Laravel 11.x ファイルストレージ

コマンドでシンボリックリンクを作成する

php artisan storage:link

このコマンドを打つと、/storage/app/public/にあるファイルが、/public/storage/に繋がり、例えば/storage/ファイル名.pngなどで表示することができるようになります。

画像ファイルを保存する際は、/storage/app/に保存したりそこから削除するようにプログラムを書き、直接/publicディレクトリの中身を書き換えないようにするためこのような流れになります。

このコマンドを打つと、/public/storageという、開けないファイルが一覧に表示されるようになります。

コマンドで設定を確認すると、

ls -la public

このpublicpublicディレクトリを指しているので、コマンドを打つディレクトリからの相対パスで指定してください。

結果、自分の場合だと

lrwxr-xr-x  1 root root  32 Feb  4 04:30 storage -> /var/www/html/storage/app/public

このように、リンクされたことが確認できます。

ルーティングやコントローラーを書く

ルーティング

Route::post('/profile', [ProfileController::class, 'update'])->name('profile.update');

コントローラー

例えば、users テーブルにimage_urlというカラムを用意すると以下のようになります。

use Illuminate\Support\Facades\Storage;
~~~~~~
public function update(Request $request)
{
    $user = $request->user();
    $image = $request->file('image');

    //画像が送信されてきていたら保存処理
    if($image){
        //保存されたパス
        $image_url = Storage::disk('public')->put('user_profile_image', $image, 'public'); //画像の保存処理
        $user->image_url = $image_url;
        $user->save();
    }
}

ビュー

注意点は、<form>タグにmultipart/form-dataを指定しないといけないです。

<form
  method="post"
  action="{{ route('profile.update') }}"
  enctype="multipart/form-data"
>
  @csrf
  <input type="file" name="image" />
  <button>送信</button>
</form>

カラムにパスが保存され、storage ディレクトリにファイルが保存されていれば OK

usersテーブルのデータを確認してカラムimage_urlに、user_profile_image/T5dNZzqtEUTu00FtkXvzU89n8vCDz8D0mkgZdMdp.pngこんな感じで保存されていれば OK です。

また、/storage/app/public/user_profile_image/T5dNZzqtEUTu00FtkXvzU89n8vCDz8D0mkgZdMdp.pngという名前で画像ファイルが保存されていれば OK です。

保存された画像を表示する

一例です。

<img src="{{ asset('storage/'.$user->image_url) }}" />

他の方法

ファイルの保存先をクラウドのストレージ専用のサービスを使う方法もあります。

これのメリットとしてはストレージの容量が無制限なのでデータ量による不具合が起きにくいことや、セキュリティ的な設定がしやすいというところだと思います。

デメリットは従量課金なのでファイル量が多くなるとお金がかかります。

例えば、AWS S3 や Azure Storage(Blob)などがあります。

https://laratech.jp/posts/larave-vue-s3/

フィードバックのお願い
この記事のフィードバックがありましたらYoutubeの適当な動画にコメントしていただいたり、お問い合わせからご連絡ください。