Laravel Question posted in
The official Laravel Documentation can be found here.

Image not displaying in Laravel, getting 404 error even though the file exists

I’m working with media files in my Laravel application. The files are being stored in the database and in the proper folders, but they are not displaying in the browser.

This is the rendered <img> tag in the browser’s front end:

<img src="http://localhost/public/uploads/18-4f2d6e8f609942df5f746775345a9430/man.png" alt="Image">

When I navigate to <my-laravel-application-root-folder>/public/uploads/18-4f2d6e8f609942df5f746775345a9430/man.png, the file is there, but the image won’t show on the frontend.

Here is my filesystem configuration in config/filesystems.php:

'public' => [
    'driver' => 'local',
    'root' => storage_path('uploads'),
    'url' => env('APP_URL') . '/public/uploads',
    'visibility' => 'public',
    'throw' => false,
],

I have already run the command:

php artisan storage:link

However, when I try to access the image via the URL in the rendered <img> tag, it gives me a 404 error.

I am not sure if I am missing a step, or am doing something wrong, but what could be causing this issue, and how can I resolve it?

Tags:

2

Answers


  1. 0

    Incorrect Path Configuration in config/filesystems.php, The public disk configuration in your config/filesystems.php is pointing to storage_path('uploads'), but this is not mapped correctly to the public directory.

    Correct the File Path in config/filesystems.php You are currently pointing the public disk to storage_path(‘uploads’), which is inside the storage directory, but not directly in the public folder. Laravel’s php artisan storage:link creates a symbolic link from public/storage to storage/app/public.

    Update your config/filesystems.php configuration like this:

    'public' => [
    'driver' => 'local',
    'root' => storage_path('app/public/uploads'), // Updated path
    'url' => env('APP_URL') . '/storage/uploads', // Use '/storage/' here instead of '/public/'
    'visibility' => 'public',
    'throw' => false,
],

    In this case:

    The files will be stored in the storage/app/public/uploads directory.
    The URL to access these files should be http://localhost/storage/uploads/.

    Now run

    php artisan storage:link

    Update the Tag in Your Blade File

    <img src="{{ asset('storage/uploads/18-4f2d6e8f609942df5f746775345a9430/man.png') }}" alt="Image">
    Login or Signup to reply.
  2. 0

    use function with img src
    {{url(‘path1/path2/…..’)}}

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search