
If you are just starting out with Laravel, knowing where to store your images and how to retrieved them can be a pain, but not to worry because in this short tutorial I will discuss everything you need to know about storing and retrieving images in Laravel;
- Where to store your images
- How to store your images to a folder from a controller
- How to retrieve and display them in your page
In this tutorial, we shall be using Laravel 5, but the steps explain here should work in a Laravel 4 application
Where to store images in Laravel
Figuring out where to put images for users who are just starting out with Laravel can be confusing and it wasn’t easy for me personally. Looking at the architecture of a Laravel application you will find that there is a public folder where images can be stored and also a storage directory where images can be stored, now where you put your images depends on the type of image you are working with. Laravel did a good job in explaining how the public and storage directory works in their documentation and you should go check it out after here. Now to answer the above question
“Your images (assuming they are meant to be seen by visitors e.g. Logo, background images, etc) need to be in a public place. Since only the public folder should be published to the web, you could create a folder there and publish the files into that.”
stechmax/public/yourfolder
in the example above stechmax is considered our root folder
Alternatively you should store your images in the
stechmax/storage/app/public
if this images are intended to be private, example of such are users profile images, products images, etc.
Also keep in mind your hosting provider needs to be able to use SSH and create symlinks then you can run php artisan storage:link
This will create a link from storage
in your public folder to storage/app/public
in your Laravel project.
How to retrieve an image from a request and save to the storage/app/public directory
if you want to accept image upload in your application then you need to know how to store these image to your storage/app/public directory.
Again Laravel provides good docs to in https://laravel.com/docs/5.7/filesystem#file-uploads
Here is the code to store images, for better understanding of the code, visit the Laravel documentation above, there you will find all you need to know.
public function update(Request $request)
{
$path = $request->file('avatar')->store('avatars');
return $path;
}
In the above code, we are storing the image to an avatars folder
How to retrieve images stored to the storage public directory
How can I retrieve my images from the storage directory? while most persons will complain, I am writing my code correctly but the image is still not showing up. and again this has been thoroughly explained in the Laravel documentation here
In other to work with the storage public directory, you should run this code
php artisan storage:link
The above code is to create the symbolic link, that will then allow you to reference files from your storage directory.
Retrieving this files in your blade files should be easy with this helper method
asset()
The asset
function generates a URL for an asset using the current scheme of the request (HTTP or HTTPS):
Retrieve image using Laravel Blade
<img src="{{asset('storage/thumbnails/default.jpg')}}">
The example above will retrieve an image from the storage/thumbnails directory titled default.
Solution to retrieve image from your controller
return asset('storage/logos/default.jpg');
Putting it all together, here is the code you need to store and display your images from the storage directory
Step one: begin by creating a symbolic link by typing this code on your console.
php artisan storage:link
Step Two: Use this code to upload an image to the avatar’s folder which should be located here storage/app/public/avatars
public function update(Request $request) { $path = $request->file('avatar')->store('avatars'); return $path; }
Step Three: Display the image to your page
<img src="{{asset('storage/avatars/typethefilenamehere.jpg')}}">