Here I am explaining you that how to resize image before upload in laravel. Please read this at the end and follow:
Lets start the tutorial for resize image before upload in laravel
In this step, install intervention package using this command:
composer require intervention/image
Add this code for provider path and alias path in config/app.php.
return [
$provides => [
'Intervention\Image\ImageServiceProvider'
],
$aliases => [
'Image' => 'Intervention\Image\Facades\Image'
]
]
In second step, add route in your routes/web.php file:
<?php
Route::get('/', 'ImageController@resizeImage');
Route::post('resizeImagePost', 'ImageController@resizeImagePost')->name('resizeImagePost');
Run this command in cmd/terminal for create ImageController.php file:
php artisan make:controller ImageController
Find ImageController.php file in your app/Http/Controllers directory and put this code:
app/Http/Controllers/ImageController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
use Image;
class ImageController extends Controller
{
public function resizeImage()
{
return view('resizeImage');
}
public function resizeImagePost(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->extension();
$destinationPath = public_path('/thumbnail');
$img = Image::make($image->path());
$img->resize(100, 100, function ($constraint) {
$constraint->aspectRatio();
})->save($destinationPath.'/'.$input['imagename']);
$destinationPath = public_path('/images');
$image->move($destinationPath, $input['imagename']);
return back()
->with('success','Image Upload successful')
->with('imageName',$input['imagename']);
}
}
Create index.blade.php inside resources/views directory and put below code:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div class="container">
<h1>Resize Image Uploading Demo</h1>
@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
@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="/images/{{ Session::get('imageName') }}" />
</div>
<div class="col-md-4">
<strong>Thumbnail Image:</strong>
<br/>
<img src="/thumbnail/{{ Session::get('imageName') }}" />
</div>
</div>
@endif
<form class="" action="{{route('resizeImagePost')}}" enctype="multipart/form-data" method="post">
<input type="hidden" name="_token" value="{{ csrf_token() }}" />
<div class="row">
<div class="col-md-4">
<br/>
<input type="text" name="title" class="form-control" placeholder="Add Title">
</div>
<div class="col-md-12">
<br/>
<input type="file" name="image" class="image">
</div>
<div class="col-md-12">
<br/>
<button type="submit" class="btn btn-success">Upload Image</button>
</div>
</div>
</form>
</div>
</body>
</html>
Ok, at last create two directory in your public folder:
Give permission to that folder and check.
Hope you like this post. If you like this post than please share and like this post and if you have any query than write here:
Hey, this is Nilesh Sharma and I belong to the Pink City (Jaipur). My job as a software developer has made me a patient man and negotiation my skills! My job also keeps me on my toes, as i always trying to learn new skills to keep pace with the changing technology landscape.