How to access image from storage

Question

I have a file saved in storage/app/uploads and I would like get this this image saved and show with img src tag.

But I can't

I am trying:

public function getSlider(Request $request)
    {
        $slider = Slider::find( $request->input('id') );    
        $slider->imagem = storage_path('storage/app/uploads/'.$slider->imagem);

        return response()->json( $slider );
    }

And I am trying show with jquery and javascript

function getSliders() {
        $.ajaxSetup({
            headers: {'X-CSRF-TOKEN' : $('#token').val() }
        })
        $.ajax({
          url: "{{ route('site.getSlider') }}",
          type: "post",
          dataType: "json",
          data: {
            id: $('#id').val()
          }
        }).done( r  => {
             console.log('r',r)
             $('#description').val( r.description )
             setImage( r.image )
        })
    }

And setting Image

function setImage( image ){
    var newImage = document.createElement('img');
    newImage.setAttribute('src', image);        
    newImage.width = 500;
    newImage.heigth = 200;
    document.getElementById("photo").innerHTML = newImage.outerHTML;
}

When I want access image from public/img I use

<img src="{{ URL('img/myImage.png') }}">

But I want to access from storage/app/uploads

Manuel Eduardo Romero Manuel Eduardo Romero · Accepted Answer · 2018-12-26T22:40:19

This return the file route (no url) (if you see the log it says /var/www.... etc)

storage_path('storage/app/uploads/'.$slider->imagem);

You should use asset helper to create URL of image

asset( 'storage/app/uploads/'.$slider->imagem);

Before this you need to run this command to create symbolic link to storage folder from public folder.

php artisan storage:link

Please try this and let me know how it works :)

How to access image from storage

3 Answers