Cannot display image - Inertia with React

@Sinnbeck Yes. I run php artisan storage:link. My filesystem has been working well. That URL is the one the app is trying. I got it from the console, 'cause I had to see what Storage::url(Setting::query()->first()->logo) was giving me, so I did console.log(settings.logo), and the HTTP 404 error is giving me that URL.

@Emokores ok and if you check on your disk, what is the correct url?

@Sinnbeck on the disk i Have /home/username/Workspace/project_name/storage/app/logo/AKmT9ziprZAfVeYePCADVe9q2UIqYcCuzb0irner.png

@Emokores So that url you posted works if you open it in the browser directly? Or what url should it be?

@Sinnbeck it doesn't work. I get status 404 in the Network tab of my browser

@Emokores Yes I get that. But what url can you access the image on if you just access it directly in the browser?

@Sinnbeck when i try using /home/username/Workspace/project_name/storage/logo/AKmT9ziprZAfVeYePCADVe9q2UIqYcCuzb0irner.png or http://localhost:8000/storage/logo/AKmT9ziprZAfVeYePCADVe9q2UIqYcCuzb0irner.png I get the message Your file couldn’t be accessed or Laravel's 404

@Emokores Is the file in /home/username/Workspace/project_name/public/storage/logo/AKmT9ziprZAfVeYePCADVe9q2UIqYcCuzb0irner.png

@Sinnbeck No its not.

@Emokores But it is in /home/username/Workspace/project_name/storage/app/public/logo/AKmT9ziprZAfVeYePCADVe9q2UIqYcCuzb0irner.png ?

Just read your answers again, and it seems that the file is not inside the public directory in storage. This meanas it isnt accessible from the web

@Sinnbeck Exactly. The file exists in the storage folder under /app/logo/file_name.png

@Emokores So move it, and fix the code that stores it, so it goes inside the correct folder :)

https://laravel.com/docs/9.x/structure#the-storage-directory

@Sinnbeck No it's not in the public directory in the storage folder. So, how can I go about it? This is my update() method script:

if ($request->hasFile('logo')) {
    if (Storage::exists($setting->logo)) {
       Storage::delete($setting->logo);
    }

    $path = $request->file('logo')->store('logo')
}

@Emokores Give it the public disk

$request->file('logo')->store('logo', 'public')

@Emokores If you’ve run php artisan storage:link without changing anything in the filesystem config, there should be a symlink in your public folder called storage (i.e., /public/storage) which points to /storage/app/public.

If you save your logo under /storage/app/logo, it won’t be accessible to the outside world, because it is located outside your document root – the server cannot serve it to the client. Remember that the entire /storage folder is located outside the /public folder, making it inaccessible to the outside world. Only the part of the storage folder which has a symlink inside the public folder is accessible, and by default that’s only /storage/public.

The easiest solution is to do what @sinnbeck says and simply save the logo inside /storage/app/public/logo/ instead of /storage/app/logo. Alternatively, if you want to keep your folder structure as is, you can create a symlink at /storage/app/public/logo which points to /storage/app/logo. You’d do this by editing your /config/filesystems.php file and adding an extra element to the links array:

// /config/filesystems.php
'links' => [
	public_path('storage') => storage_path('app/public'),
	public_path('storage/logo') => storage_path('app/logo')
]

– and then running php artisan storage:link again.

But that seems like unnecessary overkill to me.

@Sinnbeck This is the URL I get, but the image cannot still display: /home/username/Workspace/project_name/public/logo/QuQkF4KCenTBoCXvwuLdPKxBSlniYJ4qcqJI8qgO.png

@kokoshneta I did that, and it is now saved in the public folder. But I still can't get it to display. This is the path if use public_path() method: /home/username/Workspace/project_name/public/logo/QuQkF4KCenTBoCXvwuLdPKxBSlniYJ4qcqJI8qgO.png

@Emokores That is not an url? That is a path on your disk. The url should be something like this

http://localhost:8080/storage/logo/QuQkF4KCenTBoCXvwuLdPKxBSlniYJ4qcqJI8qgO.png

And I am unsure why /storage/app is missing from that path? Did you perhaps follow the advice of @kokoshneta and meant to tag him?

@Emokores But why are you using public_path() now? That just makes a fully qualified path based on whatever you give it as an argument.

What is Setting::query()->first()? Can you try to dump that with dd(Setting::query()->first() and show the result?

@kokoshneta It is logo/QuQkF4KCenTBoCXvwuLdPKxBSlniYJ4qcqJI8qgO.png when I use Setting::query()->first()->logo

@Emokores Okay, in that case, Storage::url(Setting::query()->first()->logo) should also yield http(s)://localhost:8000/storage/logo/QuQ...png, which should be correct.

Is that what dd(Storage::url(Setting::query()->first()->logo)) shows?

@kokoshneta It has worked. I used Storage::url(Setting::query()->first()->logo). I think public_path(), just as @sinnbeck noted, wasn't giving me the URL. Instead, it was giving me the disk. It was me mixing things up! It's now perfect. Thank you, guys! I deeply appreciate it.