Display image in laravel - laravel-5

I have already uploaded the image in a folder and stored its path in the database field. I am trying to display image like this:
Controller:
public function showProfileImage($id)
{
$profileimage = UserProfileModel::where(['usrID' => $id])->first();
return view('userlogin::welcome')->with('profileimage', $profileimage->userPicpath);
}
my blade template has:
<img src="{{ route('showprofileimage', ['id' => Session::get('loggedinuserid')]) }}" height="150" />
But the path returned in the src is the route path, it doesn't contain the 'profileimage' path returned form the controller. How do i do this? Thanks

The route('<named route>') helper function returns the URL to a page/endpoint/resource that was defined as:
Route::get('some/uri', ['as' => 'showprofileimage', function() {
//
});
It may not be used for displaying images (although it could be used with a few tweaks), but I would go with either one of the following approaches:
If you have the fully qualified image URL then you can use the url() helper function. Do:
<img src="{{ url('showprofileimage') }}" ... />
If your image is in the /public directory, you can use the asset() helper function:
<img src="{{ asset('path/to/profile/image') }}" ... />
If your image is in the /storage directory, you can use the storage() helper function (but I believe this is not recommended):
<img src="{{ storage('path/to/profile/image') }}" ... />
Hope this helps. Cheers!

Related

How do I show a picture on different pages using Laravel Route Prefix?

I have a image file. More than one pages is using this image file.
Image is properly displayed in dashboard. Because this page not use Route Prefix.
For example; Brand page is using Route Prefix. The picture is not displayed on this page.
Route::middleware(['auth'])->group(function () {
Route::get('dashboard', [homeAppController::class, 'dashboard'])->name('dashboard');
//web.php
Route::controller(brandController::class)->group(function () {
Route::group(['prefix' => 'brand', 'as' => 'brand.'], function () {
Route::get('/', 'index')->name('index');
Route::get('/create', 'create')->name('create');
Route::get('/store', 'store')->name('store');
Route::get('/show/{id}', 'show')->name('show');
Route::get('/edit/{id}', 'edit')->name('edit');
Route::get('/update/{id}', 'update')->name('update');
Route::get('/destroy/{id}', 'destroy')->name('destroy');
});
});
//Dashboard
<img alt="" src="../assets/media/svg/brand-logos/{{ $data->logo }}"/>
//brand/show
<img class="rounded-0" src="../assets/media/svg/brand-logos/{{ $brand->logo }}" alt=""/>
The picture is not displayed on this page. Because route started with brand prefix. For example; .../brand/assets/...
This is happening cause you are using relative paths, so it would be different on routes.
You can use full url like foo.com/bar.jpg
or Simply just /bar.jpg (starting / is important)
or if you're on Laravel blade, you can also use
<img src="{{ asset('bar.jpg') }}" />

Cannot get image from public folder on Server in Laravel

I'm saving my uploaded image in public folder like
public/user/user_img_1.jpg
and saving
/user/user_img_1.jpg
in my database column as image path. Now when i get it
<img src="{{ $userData->thumb_img }}" alt="Profile Image" /> , the image shows on localhost but on server the image is not found. $userData variables stores the path.
We need to give permissions in Laravel for uploading and fetching the images.
Suppose you have saved the image in the public folder under the user folder.
Directory Path: public/user/
And save the image in Database like below:
key: thumb_img
value: "public/user/imagename.jpg"
{{ asset($userData->thumb_img) }}
You need to use the asset function for fetching the image.
Use asset function to generate a URL for an asset using the current scheme of the request.
In your case that would be: <img src="{{ asset($userData->thumb_img) }} alt="Profile Image" />
You have to do any one step :
Put all your files (img) into the public folder.
<img src="/user/{{ $userData->thum_img }}" alt="Profile Image" />
Or, Use asset helper :
<img src="/user/{{ asset($userData->thum_img) }}" alt="Profile Image" />
where user_img_1.jpg is path of your content.

NotFoundHttpException error in laravel

This is my view:
<img src="../public/{{ $axid->img }}">
and this is my route :
Route::get('/ax/{axid}', function($id) {
$axid = show::find($id);
return view('ax', compact('axid'));
Images are uploaded in public/uploads and show is model name. However, I have this error:
NotFoundHttpException
...what is the problem?
If we assume that your image resolving code is functioning properly and that you are returning the full url of the image you want to show, then change your view code to:
<img src="{{ asset($axid->img) }}">
Please see how you should be setting this out:
View before moving to this a href..: Get ID
Route: Route::get('/ax/{id}', 'AxidController#get');
Controller with me assuming Show is your model name:
public function get($id, Show $show)
{
$axid = $show->find($id);
return view('page', compact('axid'));
}
On the page of ax/{id}:
<img src="{{ $axid->image }}">

Show the result of a route in blade view (Laravel)

I have a route that return an image, and i want the show the result of this route in a blade view, is there a way to directly call controller action or result of this route directly in the blade view ?
Thanks in advance.
You rather don't want to return image in blade. You should create separate controller action, that will return this image and link image src to this route, for example in controller:
public function image()
{
return $img = Image::make('image.jpg')->resize(800, 500)
->insert('sub_image.jpg', 'bottom-right', 10, 10) ->response();
}
then you create route to this controller action:
Route::get('my-image', 'MyController#image')->name('get-my-image');
and then in your Blade view you should link image src to this action:
<img src="{{ route('get-my-image') }}">
You can do this by giving the URL in src attribute of <img> tag as:
<img src="{{ route('image.url') }}">
Well if it's an image, why don't you use an img tag?
<img src="{{ route('my.image') }}" alt="My Image">

Access images inside public folder in laravel

How can I access the images stored inside public/images folder without the use of Laravel's own functions like assets()?
I just want to get the direct URL of the images stored in images folder.
Eg:
localhost/webapp/images/stackoverflow.png
When requesting the link i should get the direct image.
If you are inside a blade template
{{ URL::to('/') }}/images/stackoverflow.png
Just put your Images in Public Directory (public/...folder or direct images).
Public directory is by default rendered by laravel application.
Let's suppose I stored images in public/images/myimage.jpg.
Then in your HTML view, page like: (image.blade.php)
<img src="{{url('/images/myimage.jpg')}}" alt="Image"/>
I have created an Asset helper of my own.
First I defined the asset types and path in app/config/assets.php:
return array(
/*
|--------------------------------------------------------------------------
| Assets paths
|--------------------------------------------------------------------------
|
| Location of all application assets, relative to the public folder,
| may be used together with absolute paths or with URLs.
|
*/
'images' => '/storage/images',
'css' => '/assets/css',
'img' => '/assets/img',
'js' => '/assets/js'
);
Then the actual Asset class:
class Asset
{
private static function getUrl($type, $file)
{
return URL::to(Config::get('assets.' . $type) . '/' . $file);
}
public static function css($file)
{
return self::getUrl('css', $file);
}
public static function img($file)
{
return self::getUrl('img', $file);
}
public static function js($file)
{
return self::getUrl('js', $file);
}
}
So in my view I can do this to show an image:
{{ HTML::image(Asset::img('logo.png'), "My logo")) }}
Or like this to implement a Java script:
{{ HTML::script(Asset::js('my_script.js')) }}
when you want to access images which are in public/images folder and if you want to access it without using laravel functions,
use as follows:
<img src={{url('/images/photo.type')}} width="" height="" alt=""/>
This works fine.
You simply need to use the asset helper function in Laravel. (The url helper can also be used in this manner)
<img src="{{ asset('images/arrow.gif') }}" />
For the absolute path, you use public_path instead.
<p>Absolute path: {{ public_path('images/arrow.gif') }}</p>
If you are providing the URL to a public image from a controller (backend) you can use asset as well, or secure_asset if you want HTTPS. eg:
$url = asset('images/arrow.gif'); # http://example.com/assets/images/arrow.gif
$secure_url = secure_asset('images/arrow.gif'); # https://example.com/assets/images/arrow.gif
return $secure_url;
Lastly, if you want to go directly to the image on a given route you can redirect to it:
return \Redirect::to($secure_url);
More Laravel helper functions can be found here
In my case it worked perfectly
<img style="border-radius: 50%;height: 50px;width: 80px;" src="<?php echo asset("storage/TeacherImages/{$teacher->profilePic}")?>">
this is used to display image from folder i hope this will help someone looking for this type of code
Crete file .htaccess in root && add
...
RewriteCond %{REQUEST_URI} !(.css|.js|.png|.jpg|.gif|robots.txt|.ttf)$ [NC]
...

Resources