Images not showing using spatie media library

Viewed 25

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.

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.

enter image description herea

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?

0 Answers
Related