# Creating Migration For Uploading Image
We need to add three lines in our migration file which makes column in our Database .
After adding, run Migration .
php artisan migrate:reset
# Blade Form
Now we need to make a form for uploading Image into Database.
Let us add new user input of file type in the insert.blade.php
. Also, for file uploading, we need to add an enctype
attribute in the form
tag:
# Initial Test
Now test your changes by serving the Development Server in command line.(gitbash).
During development, It is always a good habit to check the output after minor changes so you can resolve errors quickly. Run the application in the browser and check if the create form now has a file input field.
php artisan serve
When you upload images, it needs to be stored by the application in local disk . Thus it required some file system configuration to save the file at the right place so that it can be retrieve latter .
# Storing Images via Controller
We will need to store image details in the database. Replace the store method with following:
# app/Http/Controllers/BookController.php
...
use Illuminate\Support\Facades\Storage;
use Illuminate\Support\Facades\File;
...
public function store(Request $request)
{
request()->validate([
'name' => 'required',
'author' => 'required',
]);
$cover = $request->file('bookcover');
$extension = $cover->getClientOriginalExtension();
Storage::disk('public')->put($cover->getFilename().'.'.$extension, File::get($cover));
$book = new Book();
$book->name = $request->name;
$book->author = $request->author;
$book->mime = $cover->getClientMimeType();
$book->original_filename = $cover->getClientOriginalName();
$book->filename = $cover->getFilename().'.'.$extension;
$book->save();
return redirect()->route('books.index')
->with('success','Book added successfully...');
}
Since Storage facade renames the Files, We are storing new Filename, original filename and the mime type in the database for future usage.
Now test your Application weather the image is uploading or not . You can find your images in your local folder to just go to root folder of you application then storage/public/app/ your folder name. If The images are available in your local folder then you are going in the right direction .
# Retrieve Images in Laravel
The final stem is to Retrieve Image from the storage folder. Go to your blade.php file where you want to show you image.
A url() function automatically generates URL for the public directory. Since We store book covers within /public/upload, we have mentioned the same path in image tag’s src attribute.
#Final Testing
Lets us now test our application. Run the application in the browser and insert an image. Then check your blade view weather the image is showing or not .
# Chances of expected errors
There is a broken image thumbnail instead of you image
# Solution
Try checking your pages source. check weather your image url is correct or not. Give full path src=”{{url(‘storage/app/public/uploads/’.$book->filename)}}
Or you can try Storage::url("/storage/app/{$images->filename}")
- Laravel – select dropdowns that filter results in a table ‘on change’ - October 30, 2021
- What is Rest and Restful API? Understand the Concept - September 5, 2020
- What is API, clear the Concept. - September 5, 2020