отображение изображений в Laravel 8 live wire

#laravel #laravel-8 #laravel-livewire

#laravel #laravel-8 #laravel-живой провод

Вопрос:

Я установил laravel 8 и новую установку каркасов аутентификации LiveWire, но когда я добавляю изображение, оно не отображается, и если я пытаюсь загрузить изображение на новой вкладке, оно перенаправляется на страницу индекса

Я добавил изображение следующим образом

 <img src="{{asset( Auth::user()->profile_photo_url) }}" />
  

Что я мог делать неправильно или что я мог упустить?

Ответ №1:

Быстрый ответ

Вам не нужно использовать asset() для отображения изображения, у вас есть полный URL-адрес изображения, легко доступный в этом свойстве. Для этого должно быть просто

 <img src="{{ auth()->user()->profile_photo_url }}" />
  

Длинный ответ

Если вы найдете источник для этого profile_photo_url атрибута, который можно найти в LaravelJetstreamHasProfilePhoto чертеже, вы увидите, что он определен как

 /**
 * Get the URL to the user's profile photo.
 *
 * @return string
 */
public function getProfilePhotoUrlAttribute()
{
    return $this->profile_photo_path
                ? Storage::disk($this->profilePhotoDisk())->url($this->profile_photo_path)
                : $this->defaultProfilePhotoUrl();
}
  

Это означает, что если есть фотография профиля, извлеките URL-адрес диска, на котором определены фотографии профиля, — в противном случае получите тот, который используется по умолчанию ui-avatars.com ).

Это означает, что нам нужно изучить Storage::disk(..)->url(..) методы и выяснить, какой диск мы используем. Диск по умолчанию является общедоступным (вы можете поверить мне на слово или проверить profilePhotoDisk() метод в той же функции).

Итак, теперь мы знаем, что фотография будет сохранена в хранилище под общедоступным диском. Далее нам нужно выяснить, что делает url() метод. По сути, он генерирует путь к фактическому изображению, полностью готовый к использованию в теге image-soruce. Что, в свою очередь, означает, что вам не нужно запускать profile_photo_url свойство через asset() метод! Еще одна причина этого заключается в том, что вы не получите фактическое изображение, если источник является внешним, то есть изображение по умолчанию из ui-avatars.com .

Комментарии:

1. Ну, я заметил ошибку в URL-адресе приложения и изменил его на 127.0.0.1: 8000 , но изображение по-прежнему не отображается