如何将用户个人资料图片加载到视图中。 Laravel

Question

我正在尝试使用 Laravel 创建一个社交网站。用户拥有带有个人资料图片的个人资料。个人资料图片以 3 种不同的尺寸显示。 1 用于主要个人资料页面 (176x176)，用于评论的较小版本 (50x50) 和用于显示在导航栏上的微型版本作为 link 到他们的个人资料 (30x30)

在我的数据库中，用户存储在用户 table:

id->int->primarykey
media_id->int (id of the media set as the users profile picture)
first_name->varchar
last_name->varchar
email->varchar
password->varchar

media_id 将是用户个人资料图片的 ID。所有用户上传的图片都将存储在 public 目录中：public/images/users/{users id}/

（但是用户的个人资料图片将存储在 public/images/users/{users id}/profilePictures/ ）

图像的url存储在媒体table:

id->int->primary
user_id->int (id of the user that uploaded the image)
mime_type->varchar
url->varchar

我无法弄清楚如何将用户 table 上的用户 media_id 设置为包含用户显示的图像 url 的媒体 ID上传为他们的头像。

这是我上传头像的路径

Route::get('{id}/edit-profile-picture', ['as' => 'profile_editProfilePicture', 'uses' => 'UsersController@showEditProfilePicture']);

用户控制器@showEditProfilePicture :

public function showEditProfilePicture($id)
    {
        $user = $this->userRepository->findById($id);

        return View::make('edit_profile-picture');
    }

这是我用于用户上传图片的表格

{{ Form::open(['route' => 'postProfilePicture', 'files' => true]) }}
  {{ Form::hidden('user_id', Auth::user()->id) }}
  <h5 class="post-type">Upload Picture</h5>
  {{ Form::file('media') }}
  {{ Form::submit('Update Profile Picture', ['class' => 'posting-submit-btn d-bluegreen-btn-thick']) }}
{{ Form::close() }}

这是表单提交时的路径。

Route::post('edit-profile-picture', ['as' => 'postProfilePicture', 'uses' => 'MediaController@storeProfilePicture'])->before('csrf');

这是 MediaController@storeProfilePicture。请注意我如何将原始图像保存到 public/images/{users is}/profilePictures/ 目录以及制作 3 个不同尺寸的图像并将它们也保存在那里。

class MediaController extends \BaseController {


    public function storeProfilePicture()
    {
        $media = new Media;

        $input = Input::all();

        $image = Image::make($input['media']->getRealPath());

        $name =  time() . '-' . Auth::user()->id . '.' . $input['media']->getClientOriginalExtension();
        $imagePath = public_path() . '/images/users/';
        $directory = Auth::user()->id;

        // check if directory exists, if not create the directory
        File::exists($imagePath . $directory . '/profilePictures') or File::makeDirectory($imagePath . $directory . '/profilePictures', 0777, true, true);

        $image->save($imagePath . $directory . '/profilePictures/' . $name)
              ->fit(176, 176)
              ->save($imagePath . $directory . '/profilePictures/' . '176thumb-' . $name)
              ->fit(50, 50)
              ->save($imagePath . $directory . '/profilePictures/' . '50thumb-' . $name)
              ->fit(30, 30)
              ->save($imagePath . $directory . '/profilePictures/' . '30thumb-' . $name);
        // save to database
        $media->url = $name;
        $media->mime_type = $input['media']->getMimeType();
        $media->user_id = $input['user_id'];
        $media->save();

        return Redirect::back();
    }
}

媒体模型

class Media extends Eloquent {
    /**
     * The database table used by the model.
     *
     * @var string
     */
    protected $table = 'medias';

    protected $fillable = ['url', 'user_id', 'mime_type'];

    public function user()
    {
        return $this->belongsTo('User');
    }
}

用户模型

class User extends Eloquent implements UserInterface, RemindableInterface {

    use UserTrait, RemindableTrait, EventGenerator, FollowableTrait;

    /**
     * Which feilds may be mass assigned
     * @var array
     */
    protected $fillable = ['first_name', 'last_name', 'email', 'password', 'media_id'];

    /**
     * The database table used by the model.
     *
     * @var string
     */
    protected $table = 'users';


    /**
     * @return mixed
     */
    public function media()
    {
        return $this->hasMany('Media');
    }

}

这是个人资料页面的路径

 Route::get('{id}', ['as' => 'profile', 'uses' => 'UsersController@show']);

这里是 UsersController@show

public function show($id)
    {
        $user = $this->userRepository->findById($id);

        return View::make('profile')->withUser($user);
    }

现在，在个人资料页面中，我可以轻松显示用户的名字：

<h4>{{ $user->first_name }}</h4>

我正在研究如何显示用户的 176x176 个人资料图片。

因为我把原图保存到public/images/users/{user id}/profilePictures/{image-name}

然后将图片名称保存到url字段下的media table

并制作了 3 个不同尺寸的图像，并将它们重命名为 176thumb-{image-name}、50thumb-{image-name} 和 30thumb-{image-name} 并将它们存储在 public/images/users/{user id}/profilePictures/{image-name}

我假设我可以通过以下方式获取图像：

<img src="images/users/{{ $user->id }}/profilePictures/176thumb-{{ $user->media->url }}" width="176" height="176">
<img src="images/users/{{ $user->id }}/profilePictures/50thumb-{{ $user->media->url }}" width="176" height="176">
<img src="images/users/{{ $user->id }}/profilePictures/30thumb-{{ $user->media->url }}" width="176" height="176">

但这不起作用。

我检查了 public/images/users/，我看到图像在目录中。我检查了数据库中的 medias table，user-id 是正确的，mime_type 是正确的，url 是正确的

但是我不知道如何让图片显示在页面上？

我知道我的问题之一是用户 table 中的 media_id 没有设置（用户的 media_id 应该是媒体的 ID头像）

当我将图像的 user_id、mime_type 和 url 保存到数据库时，如何设置用户的 media_id？

最后，我如何将属于用户的媒体 table 中的 url 调用到页面中？

在此先感谢您，我非常感谢任何花时间和精力帮助我的人。

Answer 1

首先，向 User 模型添加一个新关系：

public function profilePicture(){
    return $this->belongsTo('Media', 'media_id');
}

然后保存新媒体时，使用associate

$media->save();
$user = Auth::user();
$user->profilePicture()->associate($media);
$user->save();

然后在视图中使用 {{ $user->profilePicture->url }} 检索个人资料图片 URL。

然而，虽然这应该有效，但您可能需要考虑在媒体 table 中设置一个 is_profile_picture 标志。

如何将用户个人资料图片加载到视图中。 Laravel

How do I load a users profile image to a view. Laravel

php

database

laravel

eloquent

blade