Laravelにて、POSTで送信した複数の画像をビューで表示させる方法

Question

Laravelで知恵袋的なWebサービスを開発中です。
投稿フォームのビュー（create.blade.php）で、

<input type="file" name="image[]">

と、画像が複数送信された際に対応できるよう、nameの中のimageの末尾に[]を付けていますが、これは正しい考えでしょうか？

LecturesController ではこのように書いています。

public function store(Request $request) {

    $this->validate($request, [
        'category_name' => 'required',
        'title' => 'required|max:100',
        'content' => 'required',
    ]);

    if($request->file('image')) {
        $lecture = new Lecture;

        $lecture->user_id = \Auth::id();
        $lecture->category_name = $request->category_name;
        $lecture->title  = $request->title;
        $lecture->content = $request->content;

        // リクエストされた image データ（View側の name）を $images に代入
        $images = $request->file('image');

        // foreach で $images に入った画像を $image として別個に取り出す
        foreach ($images as $image) {

            // UNIXタイムスタンプを取得したものと、ユーザーID、オリジナルの拡張子を取得したものとを繋ぎ、ファイル名として $filename に代入
            $filename = time() . '_' . $lecture->user_id . '.' . $images->getClientOriginalExtension();
        
            // storeAs の第1引数は storage からのパス、第2引数はファイル名、第3引数は利用するストレージ(local、public…など）
            $path = $image->storeAs('', $filename, ['disk' => 'public']);

            // パスを image カラムに代入
            $lecture->image = $path;

            // 最終的な状態を保存
            $lecture->save();

        }
    } 
    else {
        $request->user()->lectures()->create([
            'category_name' => $request->category_name,
            'title' => $request->title,
            'content' => $request->content,
        ]);
    }
    
    return redirect('/');
}

---

また、画像を表示させたいビューの当該部分はこちらです。

show.blade.php

@if ($lecture)
@if ($lecture->image)
<figure class="show_post_thumbnail"><div class="new_area-img text-center"><img class="show_image" src="{{ asset('storage/'.$lecture->image) }}"></div></figure>
@else
<figure class="show_post_thumbnail"><div class="new_area-img text-center"><img src="../img/noimage.gif"></div></figure>
@endif

---

以上の内容で画像を付けて投稿すると、このようなエラーが出てきます。

Call to a member function getClientOriginalExtension() on array

ちなみに、imageの末尾に[]を付けず、コントローラーの中でforeach文も取り除くと、画像を投稿してもエラーは出ません。
もちろん、画像は1枚しか出てこないですが。

どなたか詳しい方いらっしゃいましたら、アドバイスいただけると幸いですm(_ _)m

Comments

[m.ts10806]

コードは全て、ファイル毎にマークダウンのcode機能を利用してご提示ください。

[Keight]

すみません、書き方がよくないのかどうかわかりませんが、code機能（ブロック用）を使うとレイアウトが崩れてしまうようです・・・。
書き方これで合っていますか？

```php
ここにコードを書きました。
```

[m.ts10806]

合ってます。
どのように崩れたいのか分からないですが、正しく囲えば幾つでもいけますよ

[Keight]

そうなんですね。
その書き方でプレビューを確認すると、なぜか崩れてしまいます。
こんな感じです。
https://gyazo.com/b64edb38de4b3fe900305de91248009a

Answer 1

$filename = time() . '_' . $lecture->user_id . '.' . $images->getClientOriginalExtension();

の部分で $imagesを参照しているので$imagesではなく、foreachのvalue部分、$imageを参照するようにすれば解決するかと思います。

Comments

[Keight]

ありがとうございます。
エラーは出なくなりました。
ただ、画像を表示させるビュー側に、渡ってきた複数の画像を表示させたい場合はどのように書くとよろしいでしょうか？

@for ($i = 0; $i < count($image); $i++)
<figure class="show_post_thumbnail"><div class="new_area-img text-center"><img class="show_image" src="{{ asset('storage/'.$lecture->image[$i]) }}"></div></figure>
@endfor

このように書いてみたところ、下記のエラーが出ています。

Undefined variable: image (View: E:\dev\htdocs\Laravel\bbl\resources\views\lectures\show.blade.php)

[rozeo_s]

処理側の最後が return redirect() なので表示部分のロジックは別の場所に書いてあると想定しますが、
その場合は show.blade.php へパラメータを渡す際に表示したい画像のデータを配列で渡して @foreach してみてはどうでしょうか
おそらく現在はlectureに対して画像1枚という関係(1対1)になっているようなので別のimagesテーブル等を作って1対多の関係を作るようにしないといけない気がしますが…

[Keight]

表示部分のロジックというのは、こちらになるでしょうか。

public function show($id) {
　$lecture = Lecture::find($id);
　return view('lectures.show', [
　'lecture' => $lecture,
　]);
}

showの引数が id となっているので、この中で「画像のデータを配列で渡す」という処理は行えないのでしょうか？
ということは、別にテーブルを作り、レクチャー1に対して画像を多の関係にする必要があるわけですね。
そういう発想はなかったので参考になります、ありがとうございますm(_ _)m

[rozeo_s]

> showの引数が id となっているので、この中で「画像のデータを配列で渡す」という処理は行えないのでしょうか？
たとえば、外部の別テーブルに LectureのIDを外部キーとして画像を列挙するようにして、 where('lecture id', $id) のようにすれば配列で取ることもできるかと思います。
ただここまでくると、Lectureに対して画像データをどのようにもたせたいかのデータの関係定義の話になってしまうので、この質問の本筋からはずれてしまうかと思います。
とりあえず画像のアップロードを1枚までのまま、foreach を残したいというのであれば、アップロード側は上記の変更で修正ができるかと思います。

[Keight]

現状、Laravelの勉強を始めたばかりなのでほとんど引き出しがないのですが、一度 1対多 の関係について学んでみたいと思います。
その上で、画像を複数送信できる仕様とするか、それとも1つの画像しか投稿できないようにするかの判断をしたいと思います。
いろいろとありがとうございました。