如何在视图中渲染上传的图像？

Question

当被问到时，我正在尝试上传和渲染图像。

我已经成功地在我的本地主机上上传图像，但是一旦我将代码推送到伪造服务器，它就会中断。

图片已上传，但这是我在创建帖子后看到的......见下文。

我不确定如何解决此问题。

有人对如何解决这个问题有任何意见或建议吗？

我做错了什么？

后控制器

<?php

namespace App\Http\Controllers;

use App\Post;
use Illuminate\Support\Facades\Auth;
use Illuminate\Http\Request;
use Intervention\Image\Facades\Image;
use Illuminate\Support\Str;
use Illuminate\Support\Facades\Storage;


class PostController extends Controller
{
    public function __construct()
    {
        $this->middleware('auth');
    }

    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $posts = Post::all();


        return view('post.index', compact('posts'));
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        $post = new Post(); // What is this?

        return view('post.create', compact ('post'));
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */

    public function store(Request $request)
    {
        $request->validate([
            'title' => 'required',
            'body' => 'required',
        ]);

        $post = Post::create([
            'user_id' => Auth::id(),
            'title' => $request->title,
            'body' => $request->body
        ]);

        $this->storeImage($post);

        return redirect('/posts');
    }

    /**
     * Display the specified resource.
     *
     * @param  \App\Post  $post
     * @return \Illuminate\Http\Response
     */
    public function show(Post $post)
    {
        return view('post.show', compact('post'));
    }

    /**
     * Show the form for editing the specified resource.
     *
     * @param  \App\Post  $post
     * @return \Illuminate\Http\Response
     */
    public function edit(Post $post)
    {
        return view('post.edit', compact('post'));
    }

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \App\Post  $post
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, Post $post)
    {
        $this->validatedRequest();

        $post->update($request->except('image'));

        $this->storeImage($post);

        return redirect('/posts');
    }

    /**
     * Remove the specified resource from storage.
     *
     * @param  \App\Post  $post
     * @return \Illuminate\Http\Response
     */
    public function destroy(Post $post)
    {
        $post->delete();

        return redirect('/posts');
    }

    private function validatedRequest()
    {
        return request()->validate([
            'title' => 'required',
            'body' => 'required',
            'image' => 'sometimes|file|image|max:5000',
        ]);
    }

    private function storeImage($post)
    {
   if (request()->has('image')) {
            $filename = Str::random(14).'.'.request()->image->getClientOriginalExtension();

            $image = Image::make(request()->image)->fit(300, 300, null, 'top-left')->encode();

            Storage::disk('public')->put("uploads/{$filename}", (string) $image);

            $post->update([
                'image' => "uploads/{$filename}"
            ]);
        }
    }
}

表单（show.blade.php）

 @if($post->image)
     <div class="row">
         <div class="col-12">
              <img src="{{ asset('storage/uploads/' . $post->image) }}" alt="" 
class="img-thumbnail">
         </div>
     </div>
 @endif

Answer 1

通过Storage 上传和存储的文件可以使用相同的存储类进行访问。试试

<img src="{{ Storage::disk('public')->url('/uploads/' . $post->image) }}" alt="" 
class="img-thumbnail">

asset()用于访问/public中的文件