無法在Laravel5.2視圖中輸出圖像

Question

我正在嘗試在DIV中輸出圖像，例如：

<div style="background-image:url('{{ asset($radioProg->image)}}');

即使img似乎已正確上傳到我的上載文件夾中，並且可以在數據庫中看到它，但在我看來仍然看不到它！ 有什么幫助嗎？

這是我的RadioController.php

public function store(Request $request)
{
    $this->validate($request, [
        'name' => 'required',
        'day' => 'required',
        'time' => 'required',
        'intro' => 'required',
        'link_streaming' => 'required',
        'image' => 'required|image|max:2000'
        ]);

    $radioProg = new RadioProg;
    $radioProg->name = $request->name;
    $radioProg->day = $request->day;
    $radioProg->time = $request->time;
    $radioProg->intro = $request->intro;
    $radioProg->link_streaming = $request->link_streaming;

    if ($request->hasFile('image')) {
        if ($request->file('image')->isValid()) {

            $img_name = $request->file('image')->getClientOriginalName();
            $temp_file = base_path() . 'uploads/radio_programs' . $img_name;
            $radioProg->image = $request->file('image')->move('uploads/radio_programs', $img_name);
        }
    }

    $radioProg->save();

    Session::flash('success', 'Tu nuevo programa de radio ha sido guardado correctamente!');

    return redirect()->route('admin.radio.index', [$radioProg->id]);
}

/**
 * Display the specified resource.
 *
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function show($id)
{
    $radioProg = RadioProg::find($id);
    return view('radio.show')->with('radioProg', $radioProg);
}

/**
 * Show the form for editing the specified resource.
 *
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function edit($id)
{   
    $radioProg = RadioProg::find($id);
    return view('radio.edit')->with('radioProg', $radioProg);
}

/**
 * Update the specified resource in storage.
 *
 * @param  \Illuminate\Http\Request  $request
 * @param  int  $id
 * @return \Illuminate\Http\Response
 */
public function update(Request $request, $id)
{
    $radioProg = RadioProg::find($id);
    $this->validate($request, [
        'name' => 'required',
        'day' => 'required',
        'time' => 'required',
        'intro' => 'required',
        'link_streaming' => 'required',
        'image' => 'required|image|max:2000'
        ]);

    $radioProg->name = $request->input('name');
    $radioProg->day = $request->input('day');
    $radioProg->time = $request->input('time');
    $radioProg->intro = $request->input('intro');
    $radioProg->link_streaming = $request->input('link_streaming');

    if ($request->hasFile('image')) {
        if ($request->file('image')->isValid()) {

            $img_name = $request->file('image')->getClientOriginalName();
            $temp_file = base_path() . 'uploads/radio_programs' . $img_name;
            $radioProg->image = $request->file('image')->move('uploads/radio_programs', $img_name);

        }
    }


    $radioProg->save();

    Session::flash('success', 'Tu programa de radio ha sido modificado con éxito!');

    return redirect()->route('admin.radio.index', [$radioProg->id]);

}

這是我的觀點：

<div class="row radio-programs">
    @foreach($radioProgs as $radioProg)
    <div class="col-md-4 {{ count($radioProgs) === 1 ? "col-md-offset-4" :""}} col-program">
        <div class="panel panel-default panel-program" style="background-image:url('{{ asset($radioProg->image)}}'); background-position: center; background-size: cover;-webkit-background-size: cover; -moz-background-size: cover;-o-background-size: cover;">
            <div class="panel-body">
                <div class="row">
                    <div class="col-md-12 col-inOverlay">
                        <h3 class="text-center"><span>{{$radioProg->name}}</span></h3>
                        <h4><span>Día: todos los {{$radioProg->day}} </span></h4>
                        <h4><span>Hora: {{$radioProg->time}} </span></h4>
                        <hr>
                        <div class="row button-program">
                            <div class="col-md-10 col-md-offset-1 col-button-program">
                                <a href="{{url('radioProgram')}}" type="button" class="btn btn-danger btn-block">Entrar</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endforeach
</div>

在Chrome瀏覽器中，我實際上看到了正確的路徑！

<div class="panel panel-default panel-program" style="background-image:url('http://localhost:8000/uploads/radio_programs\administrador_consorcio_300115.png'); background-position: center; background-size: cover;-webkit-background-size: cover; -moz-background-size: cover;-o-background-size: cover;">

Answer 1

回答您的問題不是很多，但是要調試的更多...

你說：

在Chrome瀏覽器中，我實際上看到了正確的路徑！

您是否嘗試過檢查chrome中使用background-image樣式規則的元素，並查看返回的圖像？ 您甚至可以在新選項卡中打開圖像。 見圖片：

我認為如果您仍然看不到該路徑，則可能是錯誤的。

Answer 2

這樣的更改可能起作用：在（ {{ ）之前添加（../ ）

<div class="panel panel-default panel-program" style="background-image:url('../{{ asset($radioProg->image)}}'); background-position: center; background-size: cover;-webkit-background-size: cover; -moz-background-size: cover;-o-background-size: cover;">