How To File Upload In Laravel 10 Example

Websolutionstuff | Mar-15-2023 | Categories : Laravel

In this article, we will see how to file upload in laravel 10 examples. Here, we will learn about the laravel 10 file upload example step by step. Also, we will see how to validate file mime types, size, etc using laravel 10 validation rules.

Also, you can store the file name in the database and display a preview of them. But, here we will simply store the file in the public folder. So, we need to create routes and controllers for that.

So, let's see the laravel 10 file upload example, file upload in laravel 10, how to upload files in laravel 10, and laravel 10 upload files to storage.

Step 1: Install Laravel 10

In this step, we will install laravel 10 using the following code. So, run the following command to the terminal.

composer create-project laravel/laravel laravel_10_file_upload_example

 

Step 2: Add Routes

Now, we will route it into the web.php file.

routes/web.php

<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\FileUploadController;

Route::get('file-upload', [FileUploadController::class, 'index']);
Route::post('file-upload', [FileUploadController::class, 'store'])->name('file.store');

 

 

Step 3: Create FileUploadController

In this step, we will create a FileUploadController file. So, add the following code to that file.

app/Http/Controllers/FileUploadController.php

<?php
  
namespace App\Http\Controllers;
   
use Illuminate\Http\Request;
  
class FileUploadController extends Controller
{
    public function index()
    {
        return view('fileUpload');
    }

    public function store(Request $request)
    {
        $request->validate([
            'file' => 'required|mimes:pdf,xlx,csv|max:1024',
        ]);
    
        $fileName = time().'.'.$request->file->extension();  
     
        $request->file->move(public_path('uploads'), $fileName);
   
     
        return back()
            ->with('success','File Uploaded successfully.')
            ->with('file', $fileName);
   
    }
}

 

 

Store File in Public Folder:

$request->file->storeAs('uploads', $fileName); 

// storage/app/uploads/filename.jpg

Store File in S3:

$request->file->storeAs('uploads', $fileName, 's3');

Store File in Storage Folder:

$request->file->move(public_path('uploads'), $fileName);

// public/uploads/filename.jpg

 

Step 4: Create Blade File

In this step, we will create a fileUpload.blade.php file.

resources/views/fileUpload.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>How To File Upload In Laravel 10 Example - websolutionstuff.com</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
       
    <div class="panel panel-primary">
  
        <div class="panel-heading text-center mt-5">
            <h2>How To File Upload In Laravel 10 Example - websolutionstuff.com</h2>
        </div>
  
        <div class="panel-body mt-5">
       
            @if ($message = Session::get('success'))
                <div class="alert alert-success alert-dismissible fade show mb-2 mt-4" role="alert">
                    {{ $message }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                </div>
            @endif
      
            <form action="{{ route('file.store') }}" method="POST" enctype="multipart/form-data">
                @csrf
      
                <div class="mb-3">
                    <label class="form-label" for="inputFile">Select File:</label>
                    <input 
                        type="file" 
                        name="file" 
                        id="inputFile"
                        class="form-control @error('file') is-invalid @enderror">
      
                    @error('file')
                        <span class="text-danger">{{ $message }}</span>
                    @enderror
                </div>
       
                <div class="mb-3">
                    <button type="submit" class="btn btn-success">Upload</button>
                </div>
           
            </form>
      
        </div>
    </div>
</div>
</body>
</html>

Output:

how_to_file_upload_in_laravel_10_output

 


You might also like:

Recommended Post
Featured Post
How to Send Bulk Mail Using Queue in Laravel 9
How to Send Bulk Mail Using Qu...

In this article, we will see how to send bulk mail using queue in laravel 9. Laravel queue is used for sending bulk...

Read More

Mar-15-2022

How To Remove Specific Item From Array In Javascript
How To Remove Specific Item Fr...

In this article, we will see how to remove a specific item from an array in javascript. We will use the indexOf() m...

Read More

Nov-03-2022

How To Setup Cron Job Task Scheduler In Laravel 10
How To Setup Cron Job Task Sch...

In this article, we will delve into the process of setting up a cron job task scheduler in Laravel 10. Our focus will be...

Read More

Apr-05-2023

Laravel 8 Yajra Datatable Example Tutorial
Laravel 8 Yajra Datatable Exam...

In this article, we will see the laravel 8 yajra datatable example tutorial. Datatable provides users to many...

Read More

Sep-30-2020