Home > Net >  Laravel: Can't visualize an image on Storage::url()
Laravel: Can't visualize an image on Storage::url()

Time:10-09

First things first, I upload an image to a Storage:: in the controller like this:

$ranker = Ranker::create([ ... ]);

if ($request->file('file')) {
  $filename = Storage::put('ranker', $request->file('file');
  $ranker->image_url = $filename;
  $ranker->save();
}

So this is working, in the database I got a url in the proper field, something like: ranker/v14rzsqJjlJIEYG2Cd22l1MLxeNPd0hGI0rvLjrf.png. If I go to \app\Storage\app\ranker I see the file, and it is correctly uploaded.

Now, when I want to render the file I do something simple as:

<img src="{{ Storage::url($ranker->image_url) }}" ... >

The src correctly says: /storage/ranker/v14rzsqJjlJIEYG2Cd22l1MLxeNPd0hGI0rvLjrf.png but displays nothing. If I go to http://server/storage/ranker/v14rzsqJjlJIEYG2Cd22l1MLxeNPd0hGI0rvLjrf.png I got a 404

Any ideas?

CodePudding user response:

The Storage folder is not a publicly accessible folder, so you either need to save the image in the public directory or link the storage public folder to the public folder by running the following artisan command in the cli.

php artisan storage:link

Then when saving you need to add it to the public folder by choosing the public disk as default or selecting the disk like this

Storage::disk('public')->put('ranker', $request->file('file'));

And then output:-

{{ Storage::disk('public')->url($ranker->image_url) }}

CodePudding user response:

As said by ColinMD, The Storage folder is not a publicly accessible folder.

In addition to his solution, you could also make a route in routes/web.php

Route::get('/images/{filename}', [ImagesController::class, 'show'])->name("images");

Make an ImagesController with the function show as follows:

public function show($filename) {
  $content = Storage::get("ranker/$filename");
  return response($content)->header('Content-Type', 'image/jpeg');
}

This way you can keep your files in your private part of te application, and simply call them by url

https://server/images/filename

Or in the blade file

{{ Route('images', ['filename']) }}
  • Related