Component display image stored in private path

Need Help
#1

Hello,

I retrieve invoices through an external API and I synced these to my application. I do not store the files in the public folder since these are invoices belonging to specific users.

I am struggling to display this images or pdf to the user in a front end component.

I did get a functioning download button using a route but I do not understand how I can display an image if its path is not accessible.

Thank you for your help.

1 Like
#2

Hi @youp,

Would this help?

1 Like
#3

There is a usage example in the documentation for this:

The File model has a download() method to initiate a file download.

#4

Thank both of you. I managed to get the download working, my issue is to have the image displayed on the front-end.

#5

The $file->output() method should output the file inline instead of downloading it. This will make the route usable as an image.

Also, for caching, take a look at the setEtag and setLastModified on the Laravel response object.

#6

Thanks for your help.
I should have said that I am not using file since I am syncing the images/pdf from an external API for which I need to store quite a few info. I managed to get it working by

  1. Using a route
Route::get('transaction-image/{id}', 'XX\XX\Components\Tx@show')->middleware('web');
  1. In the component controller
        $fileContents = Storage::get($file->file_path);
        $mimeType = Storage::mimeType($file->file_path);
    
        return = Response::make($fileContents, 200, [
            'Content-Type' => $mimeType,
            'Content-Disposition' => 'inline; filename="' . $file->original_filename . '"'
        ]);
  1. In the .htm file
<img src="{{ url('transaction-image/' ~ file.attachment_id) }}" alt="Transaction Image">

Let me know if this approach is correct.

#7

Hi @youp

I would use the following instead, it handles the headers internally:

Response::file($file->file_path)->send();
1 Like
#8

Thanks, It works with response()->file($filePath);