Laravel × Vue.jsでS3のファイルをダウンロードする方法

LaravelとVueでS3のファイルをダウンロードする際の手順についてです。

基本的にAPIでS3のファイルをダウンロードするわけではないので、実はフロントがVueでも何でも関係ありません。

フロントではs3のファイルの場所をクエリにセットしたaタグをつけておくだけで良いです。

<a href="/file/download?file_url="https://aaa.s3.ap-northeast-1.amazonaws.com/*******************.jpeg">

ここからはLaravelの話です。

まずはルーティング。
web.phpに記載していきます。

Route::get("/file/download", [FileController::class, 'download']);

次のコントローラの処理に移ります。

FileContorller.php

public function download()
{
    $filePath = request()->file_path; // S3のファイルパスを受け取ります
    $file = Storage::disk('s3')->get($filePath); // S3からファイルを取得します。
    
    $fileName = pathinfo($filePath)["basename"]; // ファイル名を取得します
    
    $headers = [
        'Content-Type' => 'application/pdf',
        'Content-Disposition' => 'attachment; filename="' . $fileName . '"'
    ];
    
    // レスポンスを返します。
    return response()->make($file, 200, $headers);
}

これでOKです！

もしファイルパスではなく、フルのファイルURLを扱っている方は、この方法でS3のファイルを取得できます。

$fileUrl = request()->file_url;
$filePath = parse_url($fileUrl)['path'];
$file = Storage::disk('s3')->get($filePath);

ずーっとAPIでファイルダウンロードを実装するかと思っていたので、結構簡単でよかったです。
みなさんもぜひ参考にしてみてください🌈