Uploading files, particularly image files, is a standard practice when using Laravel 12. Laravel’s default location for uploaded image files is a folder within the storage folder, which cannot be accessed directly. You will need to take some steps to be able to access and view images in your Laravel storage folder.
Two ways are available to provide users with secure access to view images stored in your application via the web. Below are descriptions of the two options.
How to Display Images from the Storage Directory in Laravel 12?
Method 1:
The first way to access images from Laravel storage is to create a symbolic link that will point to the storage folder from within your application so users can view the images through the web.
php artisan storage:linkNow, access the Image URL in your Blade template or controller:
You can use Laravel’s Storage facade to get the URL of the image.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Storage;
class HomeController extends Controller
{
/**
* Write code on Method
*
* @return response()
*/
public function index()
{
$imageUrl = Storage::url('images/your-image.jpg');
}
}Display the Image in your Blade view:
<img src="{{ Storage::url('images/your-image.jpg') }}" alt="Image">Method 2:
The second way to access images stored in Laravel’s storage folder is by creating a route that will display the image within your application. You would create a route similar to one below:
Create Route:
Route::get('image/{filename}', 'ImageController@displayImage')->name('image.displayImage');You can write the controller file code:
app/Http/Controllers/ImageController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Storage;
class ImageController extends Controller
{
/**
* Write code on Method
*
* @return response()
*/
public function displayImage()
{
$path = 'public/images/' . $filename;
if (!Storage::exists($path)) {
abort(404);
}
$file = Storage::get($path);
$type = Storage::mimeType($path);
return response($file, 200)->header('Content-Type', $type);
}
}Now you can use it as below:
<img src="{{ route('image.displayImage',$article->image_name) }}" alt="" title="">You can use anyone.
Conclusion:
Displaying images from the storage directory (Laravel 12) is easy once you understand the file system in Laravel. By creating a symbolic link, storing images in the correct directory, and using Laravel helpers, you can safely and efficiently manage image uploads in your application.
This method keeps your app’s files secure, organized, and scalable.
FAQ
1. Why can’t I access my images directly from Laravel’s Storage folder?
Laravel restricts direct access via an Internet browser to the Storage directory for security reasons. A symbolic link is required to expose public files.
2. Where should images be stored to display them publicly?
Image files must be stored in storage/app/public and retrieved through public/storage to be accessible to users.
3. What is the purpose of the php artisan storage:link command?
This command will create a symbolic link (Symlink) to connect the public/storage folder to the storage/app/public folder so that users can view the image files in their browsers.
4. Can I store images in a private directory?
Yes, you can upload photo files to the storage/app directory and then serve them to your users via the Laravel Controllers (authentication-based access only).
5. Does this work with Laravel 12 and future versions?
Yes, the way Laravel accesses the file system will not change, so this method will be valid in the future.
