Question 168382 in Laravel Question posted in
The official Laravel Documentation can be found here.

Can I show images in a vue component using laravel?

So I save an image with Laravel and want to display it on another page with vue.

I’m passing the entire object as a prop to vue, so it can access its name.

The problem is, when I do

$img = $request->file('image')->store('public/product_images');

sure, the image is saved into storage/app/public/product_images, but it’s stored as public/product_images/UZ9bLK65CwOWDoB002rt61y1PyldZ4iEWpKh5HHl.jpg in the database, and is accessible through http://localhost:8000/storage/product_images/UZ9bLK65CwOWDoB002rt61y1PyldZ4iEWpKh5HHl.jpg.

So basically the vue component gets public/product_images/UZ9bLK65CwOWDoB002rt61y1PyldZ4iEWpKh5HHl.jpg as the image (as product.image), this way it’s not accessible.

How am I supposed to pass the image link to the vue component and display it then?

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Realised about 30 minutes ago that I messed it up.

    Instead of

    $img = $request->file('image')->store('public/product_images');

    I should've used

    $img = $request->file('image')->store('product_images', 'public);

    This way it works.


  2. 0

    You can get the full path of the file via an accessor or manually appending the fullpath when accessing through controller.
    The following code will return the entire path:

    Storage::url($filePath);

    $filePath is the path you’re getting back when storing the file.

    So, your code will be:

    $storagePath = $request->file('image')->store('public/product_images');
$filePath = Storage::url($storagePath);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search