Unable to use absolute URLs as images

[jameslkingsley]

Version: 1.0.5

There are cases where the image in your database is just a full URL, especially when using seeded data (lorempixel.com). Currently the Image and Avatar fields don't seem to support this - should be an easy fix to check if the value starts with http and if so just return with that instead.

[KangYoosam]

How I always implement avatar for user is like blow:

    public function getAvatar() :string
    {
        if ($this->hasAvatar()) {
            return $this->image;
        }

        if ($this->social_id !== null) {
            return "https://graph.facebook.com/v2.10/$this->social_id/picture?type=normal";
        }

        return 'https://www.gravatar.com/avatar/' . md5($this->email) . '?s=120&d=mm';
    }

So I am happy if @jameslkingsley is mentioned where implemented.

[devmsh]

You can easily customize the thumbnail url generation, this is how I display my team logos because the gerLogoAttribute return a full url.

Avatar::make('logo')->thumbnail(function () {
                return $this->logo;
            }),

I also can display the Facebook user photos in the index only using this code

Avatar::make('photo')->thumbnail(function () {
                return "https://graph.facebook.com/" . $this->fb_id . "/picture";
            })->onlyOnIndex(),

Hope it's help

[stevelacey]

I am using Spark, which has an absolute photo_url on both the Team and User models – the custom getter supplied passes any value stored through url so you get double url problems from the relative urls stored by Nova when both Nova and Spark try to resolve it to an absolute URL.

Spark users need to stick with absolute urls unless they want to fix all of the places in Spark that those are expected – so I opt'd for overriding the setter to have Nova play ball and store an absolute url to the public disk address – and then a custom thumbnail callback to stop Nova url'ing the value in its own renders.

    // nova
    public function fields(Request $request)
    {
        return [
            Avatar::make(str_repeat(' ', 8), 'photo_url')
                ->disk('public')
                ->thumbnail(function () {
                    return $this->photo_url;
                }),
        ]
    }

    // models
    public function setPhotoUrlAttribute($value)
    {
        if ($value && !\Illuminate\Support\Str::startsWith($value, 'http')) {
            $value = \Storage::disk('public')->url($value);
        }

        $this->attributes['photo_url'] = $value;
    }

[davidhemphill]

This should be fixed in 1.0.18

[kevnk]

For anyone else who may have had this problem... I didn't realize there was a ->preview() method that is just like the ->thumbnail() method, but is for the detail view. I kept trying to change the thumbnail and nothing was happening!

[AdrianwithaW]

I am using Spark, which has an absolute photo_url on both the Team and User models – the custom getter supplied passes any value stored through url so you get double url problems from the relative urls stored by Nova when both Nova and Spark try to resolve it to an absolute URL.

Spark users need to stick with absolute urls unless they want to fix all of the places in Spark that those are expected – so I opt'd for overriding the setter to have Nova play ball and store an absolute url to the public disk address – and then a custom thumbnail callback to stop Nova url'ing the value in its own renders.

    // nova
    public function fields(Request $request)
    {
        return [
            Avatar::make(str_repeat(' ', 8), 'photo_url')
                ->disk('public')
                ->thumbnail(function () {
                    return $this->photo_url;
                }),
        ]
    }

    // models
    public function setPhotoUrlAttribute($value)
    {
        if ($value && !starts_with($value, 'http')) {
            $value = \Storage::disk('public')->url($value);
        }

        $this->attributes['photo_url'] = $value;
    }

This was a great solution, however starts_with is not a standard PHP function AFAIK so I used !strpos($value, "http") as the check, which will return falseif $valuedoesn't start with "http"

[stevelacey]

This was a great solution, however starts_with is not a standard PHP function AFAIK so I used !strpos($value, "http") as the check, which will return falseif $valuedoesn't start with "http"

@AdrianwithaW you're looking for Str::startsWith, string and array helpers were moved in Laravel 6 ✌🏼

[m-elewa]

a workaround to display images from the public folder or from absolute URLs

public function fields(Request $request)
{
        return [
            ...$this->photo(),
    ];
}

protected function photo()
{
    if($this->photo == 'img/icon.svg') {
        return [
            Avatar::make('photo')->thumbnail(function () {
                return asset($this->photo);
            })->onlyOnIndex(),

            Image::make('photo')
                ->preview(function () {
                    return asset($this->photo);
                })
                ->disableDownload()
                ->hideFromIndex()
        ];

    } else {
        return [Avatar::make('photo')->disk('')->disableDownload()];
    }
}

[JenuelDev]

a workaround to display images from the public folder or from absolute URLs

public function fields(Request $request)
{
        return [
            ...$this->photo(),
    ];
}

protected function photo()
{
    if($this->photo == 'img/icon.svg') {
        return [
            Avatar::make('photo')->thumbnail(function () {
                return asset($this->photo);
            })->onlyOnIndex(),

            Image::make('photo')
                ->preview(function () {
                    return asset($this->photo);
                })
                ->disableDownload()
                ->hideFromIndex()
        ];

    } else {
        return [Avatar::make('photo')->disk('')->disableDownload()];
    }
}

thanks for this useful tip,, i need help on this one. I actually followed your setup, but the prefix is my problem.

[guoxiangke]

if your filed avatar starts with http://
this will help:

Avatar::make('Avatar')->thumbnail(fn()=>$this->contact->avatar)->showOnIndex(),

[FB-LilianaIturribarria]

was this fixed? cause i'm still cannot show the avatar with full url

[stephan-v]

@FB-LilianaIturribarria No there is still not fix for this. This should be something stupid simple like ->isAbsolute() chained onto the image. I don't see why we have to make these weird workarounds for something which I bet a lot of people run into.