Показать изображение из хранилища в поле зрения

Question

У меня есть форма с несколькими полями, в которой хранится информация, включая загрузку изображений. Существует также вид редактирования:

Route::PUT('/link/{link}', function (Request $request, Link $link) {
  $request->validate([
    'name' => 'required|max:255',
    'title' => 'required|max:255',
    'cell' => 'required|max:255',
    'tel' => 'required|max:255',
    'email' => 'required|max:255',
    'website' => 'required|url|max:255',
    'location' => 'required|max:255',
    'image' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:2048',
  ]);

  $img = $request->file('image');

  $newfilename = $request->name;

  $img->move(public_path("/uploads"), $newfilename);

  $link->update($request->all());

  return redirect('/');
});

Первоначальная отправка и редактирование прекрасно работают, наряду с изменением имени файла изображения и сохранением его в папке для загрузки.

Сгенерированный путь:

public/uploads/exampleFileName.jpg

Проблема здесь в том, что когда дело доходит до отображения изображения в домашнем представлении.Код ниже генерирует 404, не найденный с дополнительным / tmp / path, который я понятия не имею, откуда он берется.

Код в исходном виде:

@foreach ($links as $link)
    <div class="link-box">
      <h5 class="off-white-txt">Card [# {{ $link->id }}]</h5>
      <h5 class="off-white-txt"><span class="pool-blue-txt">Name: </span>{{ $link->name }}</h5>
      <h5 class="off-white-txt"><span class="pool-blue-txt">Title: </span>{{ $link->title }}</h5>
      <h5 class="off-white-txt"><span class="pool-blue-txt">Cell: </span>{{ $link->cell }}</h5>
      <h5 class="off-white-txt"><span class="pool-blue-txt">Tel: </span>{{ $link->tel }}</h5>
      <h5 class="off-white-txt"><span class="pool-blue-txt">Email: </span>{{ $link->email }}</h5>
      <h5 class="off-white-txt"><span class="pool-blue-txt">Website: </span>{{ $link->website }}</h5>
      <h5 class="off-white-txt"><span class="pool-blue-txt">Location: </span>{{ $link->location }}</h5>

  <img src="{{url('uploads'.$link->image) }}" class="off-white-txt">
</div>

Сообщение об ошибке в консоли:

GET http://192.168.10.10/uploads/tmp/phpdtnTcw 404 (Not Found)

У меня следующий вопрос;Как я могу отредактировать мой код, чтобы он указывал на правильный путь и отображал изображение?

Заранее спасибо.

Answer 1

Это все действительные точки, хотя настройка моей платформы не очень хорошо согласилась с предложениями.Я реализовал обходной путь на данный момент.

Это обновленный код в веб-контроллере:

Route::post('/submit', function (Request $request) {
  $data = $request->validate([
      'name' => 'required|max:255',
      'title' => 'required|max:255',
      'cell' => 'required|max:255',
      'tel' => 'required|max:255',
      'email' => 'required|max:255',
      'website' => 'required|url|max:255',
      'location' => 'required|max:255',
      'image' => 'required|image|mimes:jpeg,png,jpg,gif,svg|max:2048',
  ]);

  $img = $request->file('image');
  // Storage::disk('public')->put('uploads', $img);

  $newfilename = $request->name;
  $img->move(public_path("/uploads"), $newfilename);

  $link = tap(new App\Link($data))->save();

  return redirect('/');
});

Это обновленный код представления:

<img src="/uploads/{{ $link->name }}" class="user-img">

Большое спасибо за помощь!

Answer 2

Временный путь, который вы получаете, взят из самого изображения.

Почему?Поскольку вы не задаете для изображения новый путь после перемещения изображения, поэтому изображение сохраняется во временном хранилище.

Чтобы упростить его, вы действительно сохранили изображение в папке public, но image путь все еще находится в temp хранилище.Здесь находится изображение.Это временное хранилище является путем по умолчанию для каждого UploadedFile объекта

. Вам необходимо явно указать его путь для Link объекта, например:

$link->image = 'my new path';
$link->save();

Answer 3

Я думаю, это потому, что вы не можете получить доступ к папке загрузки из представления.Я бы предложил создать контроллер, который получит ваше изображение в папке загрузки и отправит ответное изображение.Примерно так:

public function showImage($image)
{
    if (!Storage::exists($image->name)) {
        return false;
    }

    $file = Storage::get($image->name);
    $type = Storage::mimeType($image->name);
    $response = Response::make($file, 200)->header("Content-Type", $type);

    return $response;
}

Тогда вам просто нужно вызвать правильный маршрут, который указывает на метод вашего контроллера:

<img src="{{ route('getMyImage', $image) }}" />

Таким образом, вы можете легко защитить файлы в папке загрузки(например: поставить промежуточное ПО или пользовательские функции управления ...).В противном случае вы можете выполнить команду php artisan storage:link

Answer 4

если вы используете папку для хранения изображений, тогда вам следует использовать Storage :: url

, чтобы запустить команду php artisan storage: ссылка

  <img src="{{ Storage::url($link->image) }}" class="off-white-txt">