Hello developers! Today, I'll walk you through the process of file uploading in Laravel 10. File uploading is a common requirement for many web applications, whether it's uploading user avatars, documents, or media files.
Also, we will see how to validate file mime types, size, etc using laravel 10 validation rules.
so, let's see how to file upload in laravel 10: a step-by-step guide, laravel 10 file upload, how to validate file upload in laravel 10, how to upload file in storage laravel 8/9/10.
First things first, ensure you have Laravel 10 installed in your system. If not, you can quickly set it up using Composer:
composer create-project --prefer-dist laravel/laravel:^10.0 file-upload-example
Navigate to your project directory:
cd file-upload-example
Next, we need to define a route that corresponds to our form action. Open up routes/web.php and define a route for handling file uploads:
<?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');
Now, let's create a controller to handle our file upload logic. Run the following Artisan command to generate a controller:
php artisan make:controller FileUploadController
app/Http/Controllers/FileUploadController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class FileUploadController extends Controller
{
public function index()
{
return view('file-upload');
}
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
Now, we'll create a blade file for upload file in laravel.
resources/views/file-upload.blade.php
<!DOCTYPE html>
<html>
<head>
<title>How To File Upload In Laravel 10: A Step-by-Step Guide - Vidvatek</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 - Vidvatek</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>
Now, fire up your Laravel development server:
php artisan serve
You might also like:
- Read Also: How to Send Bulk Mail using Queue in Laravel 10
- Read Also: How to Create Image Picker in React Native
- Read Also: How to Upload and Preview an Image in React Native
- Read Also: Laravel 10 Import and Export CSV and Excel Files