Heroku file upload success, but error when download

Question

Hi i am building a laravel-livewire app on heroku the app requires file upload and I'm using FileUpload of livewire, it works fine on local, but when I try it on heroku, it says upload successful, but when I download the file it gets "No file" message. I don't know where the error lies.

here is my source code: _ In controller:

public function updatedFile()
    {

        // $this->validate();
        $fileUpload = new File();
        $fileUpload->url = $this->file->storeAs('public/files/' . auth()->id(), $this->file->getFilename());
        $fileUpload->size_file = $this->getFileSize($this->file);
        $fileUpload->file_name = $this->file->getClientOriginalName();
        $fileUpload->model_name = $this->model_name;
        $fileUpload->model_id = $this->model_id;
        $fileUpload->admin_id = auth()->check() ? auth()->id() : null;
        $fileUpload->save();
        if ($this->model_id == null)
            $this->list[] = $fileUpload->id;
    }

_ In view

<a href="{{ $canDownload ? asset('storage/' . substr($val['url'], 7, strlen($val['url']) - 7)) : '#' }}" download>
    <span class="d-block mb-0" style="word-break: break-all;">{{ $val['file_name'] }}</span>
    <small class="kb">{{ $val['size_file'] }}</small>
</a>
    ```

Answer 1

The immediate issue may just be with relative vs. absolute paths.

But even once you resolve that you'll find that your uploads disappear frequently and unpredictably. This is due to Heroku's ephemeral filesystem.

To store uploads long-term you'll need to use a third-party service like Amazon S3 or Azure Blob Storage. It looks like Livewire supports this directly:

The previous example demonstrates the most basic storage scenario: Moving the temporarily uploaded file to the "photos" directory on the app's default filesystem disk.

However, you may want to customize the file name of the stored file, or even specify a specific storage "disk" to store the file on (maybe in an S3 bucket for example).

It also provides the following example:

// Store in the "photos" directory in a configured "s3" bucket.
$this->photo->store('photos', 's3');

And links to the relevant Laravel documentation, saying that Livewire uses the same API. Just make sure to configure an S3 bucket.

You can also completely bypass your server, having uploads go directly from the user's browser to your S3 bucket. This is particularly useful with large uploads.

Make sure to use the correct disk when building your download URL.