質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.59%

laravelで、プロフィール画像を表示したい

解決済

回答 2

投稿

  • 評価
  • クリップ 0
  • VIEW 1,768

score 38

laravelで、掲示板アプリを作成中です。
非ログイン状態の投稿一覧画面で、投稿1つ1つに、その投稿をしたユーザーのプロフィール画像が表示されるようにしたいです。
@authの中であれば、プロフィール画像の表示ができるのですが、@authの外だと、投稿一覧を表示しようとすると、Trying to get property of non-objectとエラーが発生してしまいます。
ログインしている状態でないと、$user->profile_imageが取れないので、そもそもテーブル定義の時点で破綻しているのでしょうか??

とった手法としては、usersテーブルに、profile_imageというカラムを追加し、S3に画像をアップロードしつつ、パスはデータベース上に登録するというものです。
テーブル定義はこちらになります。

users | CREATE TABLE `users` (
  `id` bigint unsigned NOT NULL AUTO_INCREMENT,
  `name` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `email` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `email_verified_at` timestamp NULL DEFAULT NULL,
  `password` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `remember_token` varchar(100) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
  `created_at` timestamp NULL DEFAULT NULL,
  `updated_at` timestamp NULL DEFAULT NULL,
  `profile_image` varchar(255) COLLATE utf8mb4_unicode_ci DEFAULT NULL,
  PRIMARY KEY (`id`),
  UNIQUE KEY `users_email_unique` (`email`)
)


下記が該当箇所です。

          @auth
          <!-- 画像を表示 -->
          <img src="{{ $user->profile_image }}" style="width:50px; height:50px; border-radius:50%; position:relative; 
          top: 79px; left: 35px;">

          <p class="login-user-name">{{$user->name}}</p>
          <div id="p2">
            <a href="/logout">サインアウト</a>
            <p><a href="/profile">ユーザー</a></p>
          </div>

          @endauth
<?php

namespace App\Http\Controllers;
use App\Post;
use App\User;
use Storage;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;

class PostsController extends Controller
{
    public function index()
    {
      //ログインしているユーザー情報を取得
      $user = Auth::user();
      $posts = Post::all();
      return view('posts.index',['posts' => $posts,'user'=>$user]);
    }

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

      // モデルからインスタンスを生成
      $post = new Post;
      // postsテーブルのtextに、フォームから送られたtextを保存する
      $post->text = $request->text;
      // userテーブルのidを、postsテーブルのuser_idとして保存する
      $post->user_id = $request->user()->id;
      // フォームリクエストの中に、画像ファイルが含まれているかどうかを条件分岐
      if($request->hasFile('image')){
      //s3アップロード開始
      $image = $request->file('image');
      // バケットの`test`フォルダへアップロード
      $path = Storage::disk('s3')->putFile('test', $image, 'public');
      // アップロードした画像のフルパスを取得
      $post->image_path = Storage::disk('s3')->url($path);
      }
      // 保存
      $post->save();
      // 保存後 一覧ページへリダイレクト
      return redirect('/');

    }


}
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

checkベストアンサー

0

投稿一覧画面に表示したいのは、他人の投稿を含む全ての投稿であるということだと思います。

その場合、$userから画像のurlを取得しようとしても、ログインユーザーの画像がとれてしまうことになります。(質問にある通り、ログインユーザーがいなければ、エラーが表示される)

それではいけないので、各投稿(Post)からそれに紐付くUserを引っ張ってきて、プロフィール画像のurlを取得します。
詳しい方法は書きませんが、『laravel リレーション』などと調べれば色々情報が得られると思います。
(ちなみに今回の場合、UserとPostの関係は、1対多です)

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/04/12 13:39

    ありがとうございます。苦戦中です...。
    プロフィール画像を保存する時点で、userテーブルとpostsテーブルを紐付けないといけないのでしょうか??
    取得するときだけ紐付ければ良いでしょうか?? ちなみに、モデル側ではリレーションの設定をしている状態で、コントローラー側で値を取得する方法がわからない状態です。

    キャンセル

  • 2020/04/12 14:44

    > プロフィール画像を保存する時点で、userテーブルとpostsテーブルを紐付けないといけないのでしょうか??
    その際に紐付ける必要はありません。
    いま投稿を保存するときに、postsテーブルにuser_idを保存していますよね。(このpostsテーブルがもつuser_idを外部キーといい、他のテーブルの情報と紐付ける役割をしています)
    なので、投稿データを取得する際に、そのデータに紐づいているユーザー情報も取得してあげればいいです。

    いまスマホから打っているのですみませんが、詳しいコードについては、夜になってもいいなら、提示できると思います。

    キャンセル

0

{{$post->user->profile_image}}とすることによって、解決できました。
あってますでしょうか...??

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/04/12 14:47

    あっていますよ。

    キャンセル

  • 2020/04/12 14:51

    この方法でしか値が取れない、と固くなっていました...。
    投稿からユーザーを引っ張ってきて、ユーザーが持っているurlを取得する方法があるのですね....
    とても勉強になりました。ご教示いただき、ありがとうございました!!

    キャンセル

  • 2020/04/12 14:51

    付け加えていうなら、N+1問題、eager loadingなどについても知っておくとなお良いと思います。

    https://qiita.com/tmf16/items/b9dd262c7738472c86d9

    キャンセル

  • 2020/04/12 14:52

    かしこまりました。いただいた記事、読んでみます。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 87.59%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る