问题
2nd Update:
For some reason the display: table; in my .header_table within home.blade.php was preventing the image from rendering.
UPDATE:
I should have mentioned that I am trying to display an image within a @section ( i like to call them partials). When I went to my main.blade.php and did the {{ Html::image('images/max.jpg') }} link it displayed my image with no issue.
My questions now:
How do I display an image within a @section (partial)?
project_name/public/images/max.jpg - path confirmed
views/pages/home.blade.php
@extends('main')
@section('content')
<title>Laravel</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
<script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" src="{{ URL::asset('js/fade.js') }}"></script>
<!-- Styles -->
<style>
.header {
height: 100%;
width: 100%;
background-color: ;
}
.header img {
width: 500px;
}
.header_table {
display: table;
}
.table {
display: table-cell;
height: 100%;
width: 100%;
padding-left: 40px;
padding-top: 40px;
}
.table h1 {
text-align: left;
color: white;
font-family: 'Raleway', sans-serif;
font-size: 90px;
margin-top: 2px;
}
.table p {
text-align: left;
color: black;
font-family: 'Raleway', sans-serif;
}
.button {
background-color: #4CAF50;
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 0 auto;
cursor: pointer;
margin-left: 90px;
}
.animate {
padding-top: 4em;
padding-bottom: 4em;
}
.animate img {
position: relative;
}
.tablet {
height: 280px;
}
</style>
<div class="container">
<div class="header header_table">
{{ Html::image('images/max.jpg') }}
<div class="table">
<div id="title"><h1>Welcome</h1></div>
<img src="{{asset('public/images/max.jpg')}}"></img>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<button class="button">Learn More</button>
<button class="button">Sign-Up</button>
</div>
</div>
<div class="animate">
<img class="tablet" src="https://designcode.io/cloud/ios9-ipad/ipad.jpg">
</div>
</div>
@endsection
views/vendor/main.blade.php
<body>
<ul>
<li class="logo"><img src="http://image.flaticon.com/teams/1-freepik.jpg"></li>
<li><a href="{{ url('gallery') }}">Gallery</a></li>
<li><a href="{{ url('about') }}">About</a></li>
<li><a href="{{ url('/') }}">Home</a></li>
</ul>
<div class="container">
@yield('content')
</div>
</body>
Previous:
I'm just trying to display an image that is saved within my project.
I followed this (https://laravelcollective.com/docs/5.2/html) to update my composer.json file and app.php. Ran composer update there after.
I've used :
<img src="public/images/image.jpg">
{{ Html::image('public/images/max.jpg') }}
{{ HTML::image('public/images/max.jpg') }}
{{!! Html(or HTML)::image('public/images/max.jpg') !!}}
Now:
{{URL::asset("public/images/max.jpg")}}
{{ Html::image('images/max.jpg') }}
and I keep getting that image icon, but no image. Similar to what this person experienced (Image not displaying in view. Laravel). When I try that answer's advice by doing the asset() method, it doesn't work.
Any suggestions?
Edit: changed image.jpg to max.jpg Edit: added new attempts
回答1:
If you are using LaravelCollective's Html Facade, you have used an extra directory in your image path.
{{ Html::image('public/images/max.jpg') }}
Which should be:
{{ Html::image('images/max.jpg') }}
As Html Facade suppose you are inside the public directory and searches the image from the specified location.
Edit:
You are using: @extends('main')
It supposes you have a main.blade.php in your resources/views/main.
But you have your main.blade.php inside views/vendor/main.blade.php
You could try:
@extends(vendor.main)
Also you are doing something wrong. You are adding all the scripts and css from the child view to parent view.
When you are using in this format it renders to this form of your html.
Updated Example:
My views path:
|-resources
|- views
|- pages
|- home.blade.php
|- welcome.blade.php
welcome.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<div class="flex-center position-ref full-height">
<div class="col-md-12">
<p>Image from Parent</p>
{{ Html::image('images/capture.png') }}
</div>
<div class="content">
@yield('content')
</div>
</div>
</body>
</html>
home.blade.php:
@extends('welcome')
@section('content')
<div class="col-md-12">
<p>This is a child view.</p>
{{ Html::image('images/capture.png') }}
</div>
@stop
routes/web.php:
<?php
Route::get('/', function () {
return view('pages.home');
});
I prefer using @stop instead of @endsection. You could try both to test it.
Hope it helps you. Not confirmed why the image is not rendered.
If it doesn't render could you add the content of <image src> from your browser?
Final Output:
回答2:
Most convenient way to way to store and access images is by using Laravel filesystems.
First you got to set up your file driver driver config/filesystems.php
'public' => [
'driver' => 'local',
'root' => storage_path('app/public'),
'visibility' => 'public',
],
This will enable you to store your images in storage/app/public
Lets say you are storing images in storage/app/public/your_storage_directory directory. So do as follows.
$image = request()->file('banner');
$path = $image->store('your_storage_directory', 'public');
// persist $path in your table
$path will contain someting simillar to your_storage_directory/3ca37bc0cdf2f71eeadf60057c71154b.jpeg
Then do
php artisan storage:link
To create a symbolic link at public directory pointing to storage/app/public
Then you only got to do is access the image from your blade file by using following syntax
<img src="{{asset($path)}}">
回答3:
To generate path till
publicdirectory you have to use asset() helper methord, and to display image you have to echo that path insideimgsrcattribute.
This should work for you.
<img src="{{asset('images/max.jpg')}}">
Assuming you have max.jpg in your_project/public/images/max.jpg.
Hope this helps!
来源：https://stackoverflow.com/questions/41971341/laravel-5-3-issue-displaying-images-from-public-folder-using-extends-secti