In this post we will learn "How to compress image before upload in laravel 5.8".
See also How to Import and Export CSV or Excel file into Laravel 5.8
Conclusion
We use intervention in laravel for compress a image. using a Laravel intervention we can easily compress a any type of image format.
Intervention image package allows a image to compress and resize in laravel project.
So, let's start:
Step 1: Install Laravel 5.8 Project
Type the following command.
composer create-project --prefer-dist laravel/laravel blog "5.8.*"
Step 2: Install Intervention Image
We will install intervention/image package for resize image. Using this package we can make thumbnail image.
Type the following command:
composer require intervention/image
Then open config/app.php file and add service provider and aliase name.
'providers' => [
....
Intervention\Image\ImageServiceProvider::class,
],
'aliases' => [
....
'Image' => Intervention\Image\Facades\Image::class,
],
Then after publish your package by following command
'providers' => [
....
Intervention\Image\ImageServiceProvider::class,
],
'aliases' => [
....
'Image' => Intervention\Image\Facades\Image::class,
],
Then after publish your package by following command
php artisan vendor:publish
Step 3: Define the route name under the web.php file
Route::get('resize-image', ['as' => 'resize_image', 'uses' => 'ImageController@resizeImage']);
Route::post('post-resize-image', ['as' => 'post_resize_image', 'uses' => 'ImageController@postResizeImage']);
Step 4: Create a ImageController
We create new controller name ImageController by using php artisan make:controller ImageController.
This controller handle all route action. So, put bellow code into app/Http/Controllers/ImageController.php file:
This controller handle all route action. So, put bellow code into app/Http/Controllers/ImageController.php file:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Image;
class ImageController extends Controller
{
public function resizeImage() {
return view('image-resize');
}
public function postResizeImage(Request $request) {
$this->validate($request, [
'title' => 'required',
'image' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:2048',
]);
$image = $request->file('image');
$input['imagename'] = time().'.'.$image->getClientOriginalExtension();
$destinationPath = public_path('/thumbnails');
$img = Image::make($image->getRealPath());
$img->resize(100, 100, function ($constraint) {
$constraint->aspectRatio();
})->save($destinationPath.'/'.$input['imagename']);
$destinationPath = public_path('/images');
$image->move($destinationPath, $input['imagename']);
//$this->postImage->add($input);
return back()
->with('success','Image Upload successful')
->with('imageName',$input['imagename']);
}
}
Step 5: Create a image-resize.blade.php
Last step is to create a image-resize.blade.php under the (resources/views/image-resize.blade.php) folder. we create a layout and design code into this file so write below code:
<!doctype html>
<head>
<title>Compress Image demo in laravel 5.8 by Jay Chauhan </title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
</head>
@if (count($errors) > 0)
<div class="alert alert-danger">
<strong>Whoops!</strong> There were some problems with your input.<br><br>
<ul>
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<div class="container">
<div class="card bg-light mt-3">
<div class="card-header">
Compress Image demo in laravel 5.8 by Jay Chauhan
</div>
<div class="card-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>
<div class="row">
<div class="col-md-4">
<strong>Original Image:</strong>
<br/>
<img src="http://localhost/compress-image/public/images/{{ Session::get('imageName') }}" style="width: 50%;" />
</div>
<div class="col-md-4">
<strong>Thumbnail Image:</strong>
<br/>
<img src="http://localhost/compress-image/public/thumbnails/{{ Session::get('imageName') }}" style="width: 50%;"/>
</div>
</div>
@endif
<form method="POST" action="post-resize-image" enctype="multipart/form-data">
@csrf
<div class="col-sm-12">
<div class="col-md-4">
<br>
<input type="text" name="title" class="form-control" placeholder="Add Title" />
</div>
<div class="col-md-4">
<br>
<input type="file" name="image" class="image" />
</div>
<div class="col-md-4">
<br>
<button type="submit" class="btn btn-success">Upload Image</button>
</div>
</div>
</form>
</div>
</div>
</div>
Make a 2 directory under then public folder: 1) images and 2) thumbnails and give a all permission to that folder.
Step 6: Run Project
Finally we run project by following command:php artisan serve
See also How to Import and Export CSV or Excel file into Laravel 5.8
Conclusion
Using the intervention/image, we create a demo of How to compress image before upload in laravel 5.8. I hope this example help you for image compression into laravel.
So, Guys please Share PHP Artisan with Jay Chauhan Blog to your Technical friends and do the best coding with an easy way.
🙏🙏🙏💃💓
This article will guide you through the basics of learning how to resize pictures easily.
ReplyDeleteResizing Pictures involves 3 basic things, the right height, width and quality of the image, setting these three things correctly will resize the picture properly every time.onlineconvertfree.com
You have written an information post. Looking forward to read more.
ReplyDeleteLaravel Web Development Services India
Thank you, for providing this informative and comprehensive blog. This is very interesting Blog.
ReplyDeletePhp Web Development Company Bangalore | Ecommerce Website Designer India | Internet Marketing Company in Bangalore | Magento Website Developer In India
Nice post Thanks for sharing such a wonderful post. Please keep us updated for more.
ReplyDeleteMobile app development Singapore
Freelance Web Development Singapore Singapore
Such a great information provided by author for more information about php development servicesvisit here.
ReplyDeletePretty good post. I just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts. Any way I will be subscribing to your feed and I hope you post again soon. Wealthy affiliate discount
ReplyDelete