My site is working fine on localhost. When I hosted the site, I still can upload the image into the databse but the image is not showing and I cannot open the image in the new tab. In addition, my sites is developed using [craftable cms].
These images are uploaded on localhost(before hosting) and now they are working.
- https://foodfinder.papawalker.com/media/18/yCxbCNG4lj7NkChuaj2vQvSVUneuwd5ZtZ7XeNkR.png
- https://foodfinder.papawalker.com/media/22/yRySiqlzN1lYMeQ1PGjoC8khX8tln1ccDyiHSjSc.jpg
- https://foodfinder.papawalker.com/media/26/uyzR5tQQbAAbLpIlzKgCQrea31GNzrBkLlcds431.jpg
When I hosted the website, I realized that the new uploaded image are not working but the image that uploaded in the localhost are fine.
Model
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\SoftDeletes;
use Brackets\Media\HasMedia\ProcessMediaTrait;
use Brackets\Media\HasMedia\AutoProcessMediaTrait;
use Brackets\Media\HasMedia\HasMediaCollectionsTrait;
use Spatie\MediaLibrary\MediaCollections\Models\Media;
use Spatie\MediaLibrary\HasMedia;
use Brackets\Media\HasMedia\HasMediaThumbsTrait;
class Restaurant extends Model implements HasMedia
{
use SoftDeletes;
use ProcessMediaTrait;
use AutoProcessMediaTrait;
use HasMediaCollectionsTrait;
use HasMediaThumbsTrait;
protected $fillable = [
'name',
'img',
'description',
'address',
'phone',
'place_id',
'taman_id',
'fb_link',
'category_id',
'budget_id',
'published_at',
'enabled',
];
protected $dates = [
'published_at',
'deleted_at',
'created_at',
'updated_at',
];
public function category() {
return $this->belongsTo(Category::class);
}
public function taman() {
return $this->belongsTo(Taman::class);
}
public function budget() {
return $this->belongsTo(Budget::class);
}
protected $appends = ['resource_url'];
/* ************************ ACCESSOR ************************* */
public function getResourceUrlAttribute()
{
return url('/admin/restaurants/'.$this->getKey());
}
public function registerMediaCollections(): void {
$this->addMediaCollection('restaurantCover')
->accepts('image/*')
->maxNumberOfFiles(1);
}
public function registerMediaConversions(Media $media = null): void
{
$this->autoRegisterThumb200();
}
}
Controller@Store
public function store(StoreRestaurant $request)
{
// Sanitize input
$sanitized = $request->getSanitized();
// Store the Restaurant
$restaurant = Restaurant::create($sanitized);
if ($request->ajax()) {
return ['redirect' => url('admin/restaurants'), 'message' => trans('brackets/admin-ui::admin.operation.succeeded')];
}
return redirect('admin/restaurants');
}
Form.js
import AppForm from '../app-components/Form/AppForm';
Vue.component('restaurant-form', {
mixins: [AppForm],
data: function() {
return {
form: {
name: '' ,
img: '' ,
description: '' ,
address: '' ,
phone: '' ,
place_id: '' ,
taman_id: '' ,
fb_link: '' ,
categories_id: '' ,
budget_id: '' ,
published_at: '' ,
enabled: false ,
},
mediaCollections: ['restaurantCover'],
}
}
});
Blade Page
<div class="card-body">
@include('brackets/admin-ui::admin.includes.media-uploader',
[
'mediaCollection' => app(App\Models\Restaurant::class)->getMediaCollection('restaurantCover'),
'media' => $restaurant->getThumbs200ForCollection('restaurantCover'),
'label' => 'Cover'
])
</div>
I have checked the .env file to make sure the APP_URL(APP_URL=https://foodfinder.papawalker.com) is correct and I have also tried "php artisan storage:link".
Any suggestions?
