In this guide, I'll show you how to handle image uploads in Laravel 11 and validate them properly. Uploading images can be a common feature in many web applications, and Laravel provides a simple and effective way to ensure that the uploaded files are valid and meet the required criteria.
In Laravel 11, you can validate an image by ensuring the file is an image (jpg, jpeg, png, bmp, gif, svg, or webp). You can also apply additional validations, such as requiring the image, limiting its size, or setting specific dimensions.
How to Validate Laravel 11 Image Upload
In this step, we'll add routes to the web.php file.
Route::get('image','ImageController@image');
Route::post('upload-image','ImageController@uploadImage')->name('uploadImage');
app/Http/controllers/ImageController.php
use Illuminate\Http\Request;
public function uploadImage(Request $request)
{
// Validate the image
$request->validate([
'image' => 'required|image|mimes:jpg,jpeg,png,bmp,gif,svg,webp|max:2048|dimensions:min_width=100,min_height=100,max_width=4000,max_height=4000',
]);
// If validation passes, handle the image upload
if ($request->hasFile('image')) {
$image = $request->file('image');
$imageName = time() . '.' . $image->getClientOriginalExtension();
// Store the image in the 'public/images' directory
$image->storeAs('public/images', $imageName);
return response()->json(['message' => 'Image uploaded successfully', 'image_name' => $imageName]);
}
return response()->json(['message' => 'No image file found'], 400);
}
resources/views/image.blade.php
<!DOCTYPE html>
<html>
<head>
<title>Laravel 11 Image Upload Validation Example - Websolutionstuff</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha256-L/W5Wfqfa0sdBNIKN9cG6QA5F2qx4qICmU2VgLruv9Y=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha256-WqU1JavFxSAMcLP2WIOI+GB2zWmShMI82mTpLDcqFUg=" crossorigin="anonymous"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-6 offset-3">
<div class="card mt-5">
<div class="card-header bg-dark">
<h3 class="text-white text-center"><strong>Laravel 11 Image Upload Validation Example - Websolutionstuff</strong></h3>
</div>
<div class="card-body">
@if(count($errors) > 0)
@foreach($errors->all() as $error)
<div class="alert alert-danger">{{ $error }}</div>
@endforeach
@endif
<form action="{{ route('uploadImage') }}" method="post" enctype="multipart/form-data">
@csrf
<div class="form-group">
<label><b>Image :</b></label>
<input type="file" name="image" value="{{ old('image') }}">
</div>
<div class="form-group text-center">
<button class="btn btn-dark" type="submit">Save</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
You might also like:
Here we will see how to generate dynamic sitemap in laravel. As we know sitemap is very important part of seo, sitemap i...
Jul-05-2021
In this article, we will see the laravel whereIn and whereNotIn query examples. laravel query builder provides many diff...
Jan-16-2021
Hello guys, In this tutorial we will see laravel 8 highcharts example tutorial. you will learn how to imple...
Jul-02-2021
Hey there! Today, I want to talk to you about a super useful feature in Laravel 10 called form request validation. If yo...
Feb-23-2024