Image Upload in Laravel
Images are the vital part of a website that provides the look and feel for the whole website and as a back end framework, Laravel takes care of uploading image. If you wish to use core PHP, the length of the code is too much, but in laravel it’s just 4 to 5 lines that too for naming the file. So let’s begin…
HTML Part
For uploading images or other file, you need to create the input form for it. The code for it looks something like this:
<form action="{{ route('user.avatar.upload') }}" method="post" enctype="multipart/form-data"> @csrf <input type="file" name="avatar" accept="image/*"> <input type="submit" class="btn btn-primary"></form>
Route
In your web.php make route for uploading file like this:
Route::post('user/avatar/upload',[App\Http\Controllers\UserController::class,'storeAvatar'])
->name('user.avatar.upload');
Controller Logic
First of all, you need to check whether file exists on the request or not. This can be done using request()->hasFile() method like this:
if($request->hasFile('avatar'))
Naming File
Original Name: For getting name of the file uploaded, you can use the getClientOriginalName() method on the file object:
$file = $request->file('avatar');
$fileOriginalName = $file->getClientOriginalName();
Original Extension: For getting extension of the file uploaded, you can use the getClientOriginalExtension() method on the file object:
$fileOriginalExtension = $file->getClientOriginalExtension();
Create a unique name: For creating name, you need to separate the original file name and it’s extension. This can be done using php pathinfo() method:
$fileNameWithoutExtension = pathinfo($fileOriginalName,PATHINFO_FILENAME);
You can create name in your way but just remember that don’t leave any special character or anything that can harm your system. For that use the Str::slug() method. I will be creating name using time() method:
$uniqueFileName = time() . '-' . Str::slug($fileNameWithoutExtension) . '.' . $fileOriginalExtension;
Specifying Location
$location = 'folder-name';
Specifying disk
There are multiple types of storage available in Laravel for you to store the files. Some of them are:
- Public
- Local
- S3
If you want to add any other or use any other platform service mention the credentials in the “config/filesystems.php” file
The most common method used for storing image is the public method which can be easily accessed. So we will be using public disk:
$disk = Storage::disk(‘public’);
Putting/ Storing file
There are multiple easy of putting file but the easiest way is to use the storeAs() method available with the file object itself. The method looks something like this:
$file->storeAs($location,$uniqueFileName,'public');
This will upload the file to the “storage/public/{$location}” with the fileName specified by you in the code.
Another way is by using the disk::put() method like this:
$disk->put($path,file_get_contents($file));
That’s it. Your file will be uploaded to the directory you specified.
Whole code looks something like this:
Accessing file in view
First of all create a link of your storage folder in the public folder by running this command:
php artisan storage:link
To access file just append the ‘storage’ directory before the url like this:
asset('storage/' . auth()->user()->avatar)
The tag will be something like this:
You can find the code here:
If you have any doubt or are facing any issue, shoot a comment below. I will try to resolve as soon as possible and if you like the blog, hit that clap icon and do follow me for more such blogs.