Call to a member function temporaryUrl() on string

I am trying to get the previously saved image but I get:

Call to a member function temporaryUrl() on string

<div class="mb-4">
    <label class="flex flex-col items-center w-full px-4 py-6 tracking-wide text-white uppercase bg-green-400 border rounded-lg shadow-lg cursor-pointer border-blue hover:bg-blue hover:text-white">
    <svg class="w-8 h-8" fill="currentColor" xmlns="http://www.w3.org/2000/svg"
        viewBox="0 0 20 20">
        <path
            d="M16.88 9.1A4 4 0 0 1 16 17H5a5 5 0 0 1-1-9.9V7a3 3 0 0 1 4.52-2.59A4.98 4.98 0 0 1 17 8c0 .38-.04.74-.12 1.1zM11 11h3l-4-4-4 4h3v3h2v-3z" />
    </svg>
    <span class="mt-2 text-base leading-normal">Eilige una foto</span>
    <div>
        <input type='file' class="hidden" wire:model="photo" />
    </div>
</label> @error('photo') <span class="text-red-500">{{ $message }}</span>@enderror

    <div class="mt-2">
        @if($photo)
        <img src="{{ $photo->temporaryUrl() }}"> @endif
    </div>
</div>

The edition code:

public function edit($id)
    {
        $author = Author::findOrFail($id);
        $this->author_id = $id;
        $this->photo = $author->photo;
        $this->name = $author->name;
        $this->lastname = $author->lastname;
        $this->born = $author->born;
        $this->died = $author->died;
        $this->content = $author->content;
        $this->source = $author->source;

        $this->openModal();
    }

TemporaryUrl() is available during current file upload, but after that you gotta retrieve the file name from where you store it, in my case I store file name in database and then retrieve it to show it.

   @if ($dbphoto || $photo)
                <div class="h-32 h-32 relative bg-white text-blue rounded-full shadow-lg tracking-wide">
                        <img src="{{ empty(!$photo) ? $photo->temporaryUrl():route('images.user',$dbphoto) }}" class="object-cover rounded-full w-32 h-32">
                    <label class="absolute cursor-pointer  inset-x-0 bottom-1 bg-black bg-opacity-50 rounded-full shadow-lg h-8">
                    <span class="mt-2 text-base leading-normal font-semibold text-white">Editar</span>
                    <input type="file" wire:model="photo" class="hidden" />
                    </label>

                </div>

@endif

An Example
backend something like

Public function save(){
$validaData = $this->validate([
‘form.photo’ => ‘mimes:jpeg,png|file|size:1000|nullable’
]);
if ($this->photo!=’’)
{
//Save to storage
$photo=$this->photo->store(‘images/users’);

///using intervention/image to reduce file size
        $img= Image::make(storage_path().'/app/'.$photo)
            ->resize(300,null,function($contraint){
                $contraint->aspectRatio();
            });
        $img->save();
         
        // assign file name to form array and  save it  in database  
        $validaData['form']['photo']=$img->basename;
    }

User::find($this->user->id)->update($validaData[‘form’]);
}

also remember to add the WithFileUploads trait

1 Like