Laravel Amazon S3 File Upload Tutorial

In this article, you will be learning Laravel amazon s3 file upload. In this tutorial, we will show you step-by-step how to upload files and images to the amazon s3 server using Laravel. You can use the below example with Laravel 6, Laravel 7, Laravel 8, and Laravel 9 versions.

Let’s follow the below steps:

Step 1: Create S3 Bucket

Create the bucket and user using the below steps:

  1. Go to Amazon Web Services Sign-In and log in.
  2. Click on S3 from Service Lists.
  3. Click on the “Create Bucket” button and you will find the below forms. Enter your bucket name there.

bucket in AWS

 

  1. Create IAM User.
  2. Click on “Create User” button as shown below.

create user in IAM

 

  1. Now, add User Name and choose “Programmatic access” from access type. Then, click on next.

programettic access aws

 

 

  1. Next, Select “Attach Existing Policy Directly” and choose “AmazonS3FullAccess” from permission link.

Attach Existing Policy Directly AWS

  1. It’s optional, therefore you can skip and click to next.

add key AWS

  1. You can view user details and then click on “Create User” button.

create user aws

  1. Now, you will see created user in link. There is an “Access Key ID” and “Secret Access Key” that we need on .env files.

access key id aws

Step 2: Install Laravel 8

We need to get fresh Laravel 8 version application using below command, because we are going from scratch, open your terminal OR command prompt and run below command:

composer create-project --prefer-dist laravel/laravel blog

Step 3: Install Amazon S3 Composer Package

If you have not installed amazon s3 package, then you have to install s3 composer package by using following command:

composer require --with-all-dependencies league/flysystem-aws-s3-v3 "^1.0"

Step 4:  Configure AWS S3 Credentials

Add aws credentials in your .env file as like below:

.env

AWS_ACCESS_KEY_ID=AKIAVAEWWDTDY...
AWS_SECRET_ACCESS_KEY=Zp/wgwj46SAC....
AWS_DEFAULT_REGION=us-east-2
AWS_BUCKET=itsolutionstuff-bucket
AWS_USE_PATH_STYLE_ENDPOINT=false

Step 5: Create Routes

In next step, we will add new two routes in web.php file. One route for generate form and another for post method, let’s create both route as bellow listed:

routes/web.php

<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\ImageUploadController;
 
Route::get('image-upload', [ ImageUploadController::class, 'imageUpload' ])->name('image.upload');
Route::post('image-upload', [ ImageUploadController::class, 'imageUploadPost' ])->name('image.upload.post');

Step 6: Create ImageUploadController

Let’s create new ImageUploadController and we will be writing two method imageUpload() and imageUploadPost(). One method will handle the get method another one for post. Add the below code.

app/Http/Controllers/ImageUploadController.php

<?php
  
namespace App\Http\Controllers;
  
use Illuminate\Http\Request;
  
class ImageUploadController extends Controller
{
     /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function imageUpload()
    {
        return view('imageUpload');
    }
    
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function imageUploadPost(Request $request)
    {
        $request->validate([
            'image' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:2048',
        ]);
    
        $imageName = time().'.'.$request->image->extension();  
     
        $path = Storage::disk('s3')->put('images', $request->image);
        $path = Storage::disk('s3')->url($path);
  
        /* Store $imageName name in DATABASE from HERE */
    
        return back()
            ->with('success','You have successfully upload image.')
            ->with('image', $path); 
    }
}

Step 7: Create Blade File

Create imageUpload.blade.php file and in this file, we will create a form with a file input button. Copy below and put it on that file.

resources/views/imageUpload.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>laravel File Uploading with Amazon S3</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
</head>
    
<body>
<div class="container">
     
    <div class="panel panel-primary">
      <div class="panel-heading"><h2>laravel File Uploading with Amazon S3</h2></div>
      <div class="panel-body">
     
        @if ($message = Session::get('success'))
        <div class="alert alert-success alert-block">
            <button type="button" class="close" data-dismiss="alert">×</button>
                <strong>{{ $message }}</strong>
        </div>
        <img src="{{ Session::get('image') }}">
        @endif
    
        @if (count($errors) > 0)
            <div class="alert alert-danger">
                <strong>Whoops!</strong> There were some problems with your input.
                <ul>
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            </div>
        @endif
    
        <form action="{{ route('image.upload.post') }}" method="POST" enctype="multipart/form-data">
            @csrf
            <div class="row">
    
                <div class="col-md-6">
                    <input type="file" name="image" class="form-control">
                </div>
     
                <div class="col-md-6">
                    <button type="submit" class="btn btn-success">Upload</button>
                </div>
     
            </div>
        </form>
    
      </div>
    </div>
</div>
</body>
  
</html>

Run and check it –

Run our example and the below command :

php artisan serve

Output

laravel file upload amazone aws