I upload images and then handle it in a Livewire component like:
$fileName = md5($randomString . microtime()) . '.' .$this->image->extension();
$this->image->storeAs('public/images/listings/' .$listingId, $fileName);
$path = '/images/listings/' .$listingId .'/';
Then when I try to display the image:
@php
$headerUrl = 'https://dev.<url>.plesk.page/storage';
if($listing->images->isNotEmpty()){
$headerUrl .= $listing->images[0]->path .$listing->images[0]->filename;
} else {
$headerUrl .= '/images/header.jpg';
}
@endphp
And when I have an image uploaded for the listing, then the Alt attribute of the image is displayed with the broken image icon. I have to manually change the permissions in order for this to work. When the directory is created it has the following permissions (WinSCP):

So, it works when I manually set the permissions to 0775, but by default, when the directory is created, it has 0700 permissions and the image file inside the directory has 0644 permissions. I host my site on a custom server managed by Plesk. Im not sure what to do. I havent changed config/filesystems.php, its the default one:
<?php
return [
/*
|--------------------------------------------------------------------------
| Default Filesystem Disk
|--------------------------------------------------------------------------
|
| Here you may specify the default filesystem disk that should be used
| by the framework. The "local" disk, as well as a variety of cloud
| based disks are available to your application. Just store away!
|
*/
'default' => env('FILESYSTEM_DISK', 'local'),
/*
|--------------------------------------------------------------------------
| Filesystem Disks
|--------------------------------------------------------------------------
|
| Here you may configure as many filesystem "disks" as you wish, and you
| may even configure multiple disks of the same driver. Defaults have
| been set up for each driver as an example of the required values.
|
| Supported Drivers: "local", "ftp", "sftp", "s3"
|
*/
'disks' => [
'local' => [
'driver' => 'local',
'root' => storage_path('app'),
'throw' => false,
],
'public' => [
'driver' => 'local',
'root' => storage_path('app/public'),
'url' => env('APP_URL').'/storage',
'visibility' => 'public',
'throw' => false,
],
's3' => [
'driver' => 's3',
'key' => env('AWS_ACCESS_KEY_ID'),
'secret' => env('AWS_SECRET_ACCESS_KEY'),
'region' => env('AWS_DEFAULT_REGION'),
'bucket' => env('AWS_BUCKET'),
'url' => env('AWS_URL'),
'endpoint' => env('AWS_ENDPOINT'),
'use_path_style_endpoint' => env('AWS_USE_PATH_STYLE_ENDPOINT', false),
'throw' => false,
],
],
/*
|--------------------------------------------------------------------------
| Symbolic Links
|--------------------------------------------------------------------------
|
| Here you may configure the symbolic links that will be created when the
| `storage:link` Artisan command is executed. The array keys should be
| the locations of the links and the values should be their targets.
|
*/
'links' => [
public_path('storage') => storage_path('app/public'),
],
];