I have a relationship with product and images. The user can upload many images for a product so I have a product table and product_images table.
When I try to get to fetch the image from the database, I get No image available in my view. But I am able to save to the path attribute in my database.
Why could this be happening?
product_images
id
product_id
path
Product
public function images()
{
return $this->hasMany(Image::class);
}
Image
public function products()
{
return $this->belongsTo(Product::class);
}
Controller
public function index()
{
$products = Product::where('type', 'BASIC')->inRandomOrder()->take(6)->get();
return view('home.index',compact('products');
}
$product_image = Product::create($request->all());
if ($request->hasFile('image'))
{
$request->file('image')->store('uploads/catalog/images');
// ensure every image has a different name
$file_name = $request->file('image')->hashName();
// save new image $file_name to database
$product_image->images()->update(['image' => $file_name]);
}
View
@foreach($products as $product)
@foreach($product->image as $img)
<div class="product-item men">
<div class="product discount product_filter">
<div class="product_image">
<a href="{{ route('product.view', $product->slug)}}"><img src="{{$img}}" alt=""></a>
</div>
<!-- <div class="favorite favorite_left"></div> -->
<!-- <div class="product_bubble product_bubble_right product_bubble_red d-flex flex-column align-items-center"><span>offer</span></div> -->
<div class="product_info">
<h6 class="product_name"><a href="{{ route('product.view', $product->slug)}}">{{$product->name}}</a></h6>
</div>
</div>
</div>
@endforeach
@endforeach
dd($img)
ProductImage {#523 ▼
#fillable: array:3 [▼
0 => "product_id"
1 => "path"
2 => "is_main_image"
]
#connection: "mysql"
#table: null
#primaryKey: "id"
#keyType: "int"
+incrementing: true
#with: []
#withCount: []
#perPage: 15
+exists: true
+wasRecentlyCreated: false
#attributes: array:6 [▼
"id" => 1
"product_id" => 1
"path" => "/Users/emmnock/laravel-ecommerce/public/uploads/catalog/ZsT4VwjWS5tLvIl0AKV6sAOxHFrwzwII5FMVUVkP.png"
"is_main_image" => null
"created_at" => "2018-03-07 10:04:34"
"updated_at" => "2018-03-07 10:04:34"
]
#original: array:6 [▶]
#changes: []
#casts: []
#dates: []
#dateFormat: null
#appends: []
#dispatchesEvents: []
#observables: []
#relations: []
#touches: []
+timestamps: true
#hidden: []
#visible: []
#guarded: array:1 [▶]
}
if your image is in public
folder then use asset()
Here is an example
<img src="{{ asset(str_replace(app_path(),'',$img->path))}}" alt="">
also in your foreach
use below given code
@foreach($product->images as $img)
If it is storage folder then move the image to storage then use asset() or create a symlink
use asset(str_replace(app_path(),'',$img->path))
Hope this helps
You can't use img
object to echo it. Image
must have some properties like url
or path
, so you can output them only. Looks like you store full path (why?) inside path
property.
$url = str_replace(public_path(), "", $img->path);
<img src="{{ $url }}" alt="">
If you store filename as an image property, so get url to it.
<img src="{{ Storage::url($img->path_to_file) }}" alt="">