Laravel Vuejs 实战：开发知乎 （18-19）用户关注问题

1.添加授权策略

为了让问题只能被登录用户关注  且用户关注与未关注的区别不同显示

提示：使用policy

php artisan make:policy QuestionPolicy

QuestionPolicy文件：

<?php

namespace App\Policies;

use App\Models\Question;
use App\User;
use Illuminate\Auth\Access\HandlesAuthorization;

class QuestionPolicy
{
    use HandlesAuthorization;

    /**
     * Create a new policy instance.
     *
     * @return void
     */
    public function __construct()
    {
        //

    }


    /**
     * 判断用户是否有权编辑更新问题
     * @param User $user
     * @param Question $question
     * @return bool
     */
    public function update(User $user, Question $question)
    {
        return $user->id === $question->user_id;
    }


    /**
     * 判断用户是否有权删除问题
     * @param User $user
     * @param Question $question
     * @return bool
     */
    public function destroy(User $user, Question $question)
    {
        return $user->id === $question->user_id;
    }


    /** 用户是否可以关注问题，未登录不行，关注了不行
     * @param User $user
     * @param Question $question
     * @return bool
     */
    public function follow(User $user, Question $question)
    {
        return auth()->user()->id === $user->id && !$user->followQuestions->contains('id', $question->id);
    }
}

修改show页面对关注后和未关注的不同显示

@extends('layouts.app')
@section('content')
    <div class="container">
        <div class="row">
            <div class="col-md-8 col-md offset-1">
                {{--问题--}}
                <div class="card">
                    <div class="card-header">
                        {{ $question->title }}

                        @foreach(['success','warning','danger'] as $info)
                            @if(session()->has($info))
                                <div class="alert alert-{{$info}}">{{ session()->get($info) }}</div>
                            @endif
                        @endforeach

                        @can('update',$question)
                            <a href="{{ route('questions.edit',$question) }}" class="btn btn-warning">编辑</a>
                        @endcan

                        @can('destroy',$question)
                            <form action="{{ route('questions.destroy',$question) }}" method="post">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="btn btn-danger">删除</button>
                            </form>
                        @endcan

                        @forelse($question->topics as $topic)
                            <button class="btn btn-secondary float-md-right m-1">{{ $topic->name }}</button>
                        @empty
                            <p class="text text-warning float-md-right"> "No Topics"</p>
                        @endforelse

                        <p class="text text-info float-md-right"> 已有{{ count($question->answers) }}个回答</p>

                    </div>
                    <div class="card-body">
                        {!! $question->content !!}
                    </div>
                </div>


                {{--回答提交form--}}
                {{--只有登录用户可以提交回答--}}
                @if(auth()->check())
                    <div class="card mt-2">
                        <div class="card-header">
                            提交回答
                        </div>
                        <div class="card-body">
                            <form action="{{ route('answers.store',$question) }}" method="post">
                            @csrf
                            <!-- 回答编辑器容器 -->
                                <script id="container" name="content" type="text/plain"
                                        style="width: 100%;height: 200px">{!! old('content') !!}</script>
                                <p class="text text-danger"> @error('content') {{ $message }} @enderror </p>
                                <!--提交按钮-->
                                <button type="submit" class="btn btn-primary float-md-right mt-2">提交回答</button>
                            </form>
                        </div>
                    </div>
                @else
                    {{--显示请登录--}}
                    <a href="{{ route('login') }}" class="btn btn-success btn-block mt-4">登录提交答案</a>
                @endif
                {{--展示答案--}}
                @forelse($question->answers as $answer)
                    <div class="card mt-4">
                        <div class="card-header">
                            <div class="float-left">
                                <img src="{{ $answer->user->avatar }}" class="img-thumbnail imgWrap"
                                     style="height: 50px" alt="{{ $answer->user->name }}">
                                <span class="text text-info">{{ $answer->user->name }}</span>
                            </div>
                            <span class="float-right text text-info m-auto">{{ $answer->updated_at }}</span>
                        </div>

                        <div class="card-body">
                            {!!  $answer->content  !!}
                        </div>
                    </div>

                @empty

                @endforelse
            </div>

            <div class="col-md-3">
                <div class="card">
                    <div class="card-header">
                        <h2> {{ $question->followers_count }}</h2>
                        <span>关注者</span>
                    </div>

                    <div class="card-body">
                        @if(auth()->check())
                            {{--                        如果用户已经关注过，则显示取消关注按钮--}}
                            @can('follow',$question)
                                <a href="{{ route('questions.follow',$question) }}"
                                   class="btn btn-primary btn-block">点击关注</a>
                            @else
                                <a href="{{ route('questions.follow',$question) }}"
                                   class="btn btn-danger btn-block">取消关注</a>
                            @endcan
                        @else
                            <a href="{{ route('questions.follow',$question) }}"
                               class="btn btn-primary btn-block">点击关注</a>

                        @endif
                    </div>

                </div>
            </div>
        </div>
    </div>
@endsection
@section('footer-js')
    @include('questions._footer_js')
@endsection

修改跳转位置:

在RouteServiceProvider中添加：

public const QUESTION = '/questions';

LoginController中：

将RouteServiceProvider::Home 改为 RouteServiceProvider::QUESTION

RedirectIfAuthenticated中：

将RouteServiceProvider::Home 改为 RouteServiceProvider::QUESTION

2. 添加一张表用于管理用户关注问题，多对多 一个用户可以关注多个问题，一个问题可以被多个用户关注

可以参考follow系统原理：

Laravel 6 | Follow Unfollow System Example From Scratch

Laravel Eloquent followers relationship

【之前创建的表是用户创建问题 及 tags与questions之间的表】

php artisan make:migration create_users_questions_table

migration文件代码：

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

class CreateUsersQuestionsTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        //用户关注的问题 与 问题下关注的用户 的表
        Schema::create('users_questions', function (Blueprint $table) {
            $table->bigIncrements('id');
            $table->unsignedBigInteger('user_id')->index();
            $table->unsignedBigInteger('question_id')->index();
            $table->timestamps();
        });
    }

    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('users_questions');
    }
}

然后：

php artisan migrate

model关联关系：

Question.php

<?php

namespace App\Models;

use App\Answer;
use App\Topic;
use App\User;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\SoftDeletes;

class Question extends Model
{
    //软删除 添加
    use SoftDeletes;
    //
    protected $fillable = ['title', 'content', 'user_id'];
    //支持软删除 添加
    protected $dates = ['deleted_at'];

    public function topics()
    {
        return $this->belongsToMany(
            Topic::class,
            'questions_topics' //表名我设置的是questions_topics，可能不是系统自动解析的question_topic
        )->withTimestamps();//withTimestamps操作questions_topics表中create_at及updated_at字段的
    }

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

    /** scope+请求名命名的
     * @return bool
     */
    public function scopePublished($query)
    {
        return $query->where('is_hidden', 'F');//等于F表示不隐藏
    }


    /** 一个问题有多个回答
     * @return \Illuminate\Database\Eloquent\Relations\HasMany
     */
    public function answers()
    {
        return $this->hasMany(Answer::class);
    }


    public function followUsers()
    {
        //默认表名 可以不设置后面三个参数，自定义表名需要设置
        return $this->belongsToMany(Question::class, 'users_questions', 'user_id', 'question_id');
    }

}

User.php

<?php

namespace App;

use App\Models\Question;
use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\SoftDeletes;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;

class User extends Authenticatable implements MustVerifyEmail
{
    use Notifiable;
    #region 支持软删除
    use SoftDeletes;
    protected $dates = ['deleted_at'];
    #endregion
    /**
     * The attributes that are mass assignable.
     *
     * @var array
     */
    protected $fillable = [
        'name', 'email', 'password', 'avatar', 'activation_token'
    ];

    /**
     * The attributes that should be hidden for arrays.
     *
     * @var array
     */
    protected $hidden = [
        'password', 'remember_token',
    ];

    /**
     * The attributes that should be cast to native types.
     *
     * @var array
     */
    protected $casts = [
        'email_verified_at' => 'datetime',
    ];


    /**添加用户模型和问题模型的模型关联
     * @return \Illuminate\Database\Eloquent\Relations\HasMany
     */
    public function questions()
    {
        return $this->hasMany(Question::class);
    }


    /** 添加用户模型和回答模型的模型关联 一个用户可以有多个回答
     * @return \Illuminate\Database\Eloquent\Relations\HasMany
     */
    public function answers()
    {
        return $this->hasMany(Answer::class);
    }


    public function followQuestions()
    {
        //默认表名 可以不设置后面三个参数，自定义表名需要设置
        return $this->belongsToMany(Question::class, 'users_questions', 'question_id', 'user_id');
    }
}

QuestionController.php

<?php

namespace App\Http\Controllers;

use App\Http\Requests\QuestionStoreRequest;
use App\Models\Question;
use App\Repositories\QuestionRepository;


class QuestionController extends Controller
{

    /**
     * @var QuestionRepository
     */
    private $questionRepository;

    public function __construct(QuestionRepository $questionRepository)
    {
        $this->middleware(
            'auth',
            [
                'except' =>
                    [
                        'index',
                        'show',
                    ]//非注册用户只能查看不能编辑添加更改删除
            ]
        );

        $this->questionRepository = $questionRepository;
    }


    /** Display a listing of the resource.
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function index()
    {
        //
        $questions = $this->questionRepository->getQuestionPublished();
        return view('questions.index', compact('questions'));
    }


    /**
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function create()
    {
        //
        return view('questions.create');
    }


    /**
     * @param QuestionStoreRequest $request
     * @return \Illuminate\Http\RedirectResponse
     */
    public function store(QuestionStoreRequest $request)//依赖注入QuestionStoreRequest实例
    {
        //
//        $data = $request->validate([
//            'title' => 'required|min:8',
//            'content' => 'required|min:28',
//        ]);
        //存储topics
        $topics = $this->questionRepository->normalizeTopics($request->get('topics'));
        //初始化question要用到的数据
        $data = $request->all();
        $data['user_id'] = auth()->user()->id;

//        $question=Question::create($data); 被下方代码取代
        $question = $this->questionRepository->create($data);

        //使用我们再question model里面添加的topics方法获得 topics关联，再使用attach方法
        $question->topics()->attach($topics);

        return redirect()->route('questions.show', $question);
    }


    /**
     * @param Question $question
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function show(Question $question)
    {
        //使用关系关联加载，with方法会将分类之下的主题一起查询出来，而且不会出现N+1影响性能的问题
        $question->with('topics')->get();
        //使用关系关联加载，with方法会将分类之下的回答一起查询出来，而且不会出现N+1影响性能的问题
        $question->with('answers')->get();

        return view('questions.show', compact('question'));
    }


    /**判断权限 返回视图
     * @param Question $question
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\Http\RedirectResponse|\Illuminate\View\View
     */
    public function edit(Question $question)
    {
        if (auth()->user()->can('update', $question)) //判断当前用户是否有权编辑更新该question实例
        {
            //返回编辑视图
            return view('questions.edit', compact('question'));
        } else {
            //返回警告 没有权限
            return redirect()->back()->with('warning', '你不能编辑不属于你的问题！');
        }
    }


    /** Update the specified resource in storage.
     * @param QuestionStoreRequest $questionStoreRequest
     * @param Question $question
     * @return \Illuminate\Http\RedirectResponse
     */
    public function update(QuestionStoreRequest $questionStoreRequest, Question $question)
    {
        //更新前 判断下权限
        if (!(auth()->user()->can('update', $question))) {
            //返回警告 没有权限
            return redirect()->back()->with('warning', '你不能编辑不属于你的问题！');
        }
        //取得更新的字段 使用Eloquent提供的update方法执行问题更新
        $question->update([
            'title' => $questionStoreRequest->get('title'),
            'content' => $questionStoreRequest->get('content'),
        ]);


        //topics的操作这时候看起来有点臃肿 可以使用TopicController来管理，暂时省略
        //存储topics
        $topics = $this->questionRepository->normalizeTopics($questionStoreRequest->get('topics'));
        //使用我们再question model里面添加的topics方法获得 topics关联，
        //再使用sync方法同步tag 【删除的会被删除掉，没删除的就保留，新的就增加】
        $question->topics()->sync($topics);

        //更新完成，跳转回去
        return redirect()->back();
    }


    /**Remove the specified resource from storage.
     * @param Question $question
     * @return \Illuminate\Http\RedirectResponse
     * @throws \Exception
     */
    public function destroy(Question $question)
    {
        //
        if (auth()->user()->can('destroy', $question)) {
            $question->delete();
            return redirect()->route('questions.index')->with('success', "删除成功！");
        }
        return redirect()->back()->with('danger', "你不能删除不属于你的问题！");
    }


    public function follow(Question $question)
    {
        if (auth()->user()->can('follow', $question)) //通过QuestionPolicy的follow方法判断用户是否可以关注问题
        {
            //同步记录
            auth()->user()->followQuestions()->sync($question);
            //关注数加1
            $question->increment('followers_count');
            $message = "关注";
        } else {
            //取消记录
            auth()->user()->followQuestions()->detach($question);
            //关注数减1
            $question->decrement('followers_count');
            $message = "取关";
        }

        return redirect()->back()->with('success', $message . '成功！');
    }

}

3.优化：

关注 使用toggle方法，tags 与 questions 适合用sync detach attach方法 具体参考官方文档: 切换关联 或 laravel toggle方法

<?php

namespace App\Http\Controllers;

use App\Http\Requests\QuestionStoreRequest;
use App\Models\Question;
use App\Repositories\QuestionRepository;


class QuestionController extends Controller
{

    /**
     * @var QuestionRepository
     */
    private $questionRepository;

    public function __construct(QuestionRepository $questionRepository)
    {
        $this->middleware(
            'auth',
            [
                'except' =>
                    [
                        'index',
                        'show',
                    ]//非注册用户只能查看不能编辑添加更改删除
            ]
        );

        $this->questionRepository = $questionRepository;
    }


    /** Display a listing of the resource.
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function index()
    {
        //
        $questions = $this->questionRepository->getQuestionPublished();
        return view('questions.index', compact('questions'));
    }


    /**
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function create()
    {
        //
        return view('questions.create');
    }


    /**
     * @param QuestionStoreRequest $request
     * @return \Illuminate\Http\RedirectResponse
     */
    public function store(QuestionStoreRequest $request)//依赖注入QuestionStoreRequest实例
    {
        //
//        $data = $request->validate([
//            'title' => 'required|min:8',
//            'content' => 'required|min:28',
//        ]);
        //存储topics
        $topics = $this->questionRepository->normalizeTopics($request->get('topics'));
        //初始化question要用到的数据
        $data = $request->all();
        $data['user_id'] = auth()->user()->id;

//        $question=Question::create($data); 被下方代码取代
        $question = $this->questionRepository->create($data);

        //使用我们再question model里面添加的topics方法获得 topics关联，再使用attach方法
        $question->topics()->attach($topics);

        return redirect()->route('questions.show', $question);
    }


    /**
     * @param Question $question
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
     */
    public function show(Question $question)
    {
        //使用关系关联加载，with方法会将分类之下的主题一起查询出来，而且不会出现N+1影响性能的问题
        $question->with('topics')->get();
        //使用关系关联加载，with方法会将分类之下的回答一起查询出来，而且不会出现N+1影响性能的问题
        $question->with('answers')->get();

        return view('questions.show', compact('question'));
    }


    /**判断权限 返回视图
     * @param Question $question
     * @return \Illuminate\Contracts\View\Factory|\Illuminate\Http\RedirectResponse|\Illuminate\View\View
     */
    public function edit(Question $question)
    {
        if (auth()->user()->can('update', $question)) //判断当前用户是否有权编辑更新该question实例
        {
            //返回编辑视图
            return view('questions.edit', compact('question'));
        } else {
            //返回警告 没有权限
            return redirect()->back()->with('warning', '你不能编辑不属于你的问题！');
        }
    }


    /** Update the specified resource in storage.
     * @param QuestionStoreRequest $questionStoreRequest
     * @param Question $question
     * @return \Illuminate\Http\RedirectResponse
     */
    public function update(QuestionStoreRequest $questionStoreRequest, Question $question)
    {
        //更新前 判断下权限
        if (!(auth()->user()->can('update', $question))) {
            //返回警告 没有权限
            return redirect()->back()->with('warning', '你不能编辑不属于你的问题！');
        }
        //取得更新的字段 使用Eloquent提供的update方法执行问题更新
        $question->update([
            'title' => $questionStoreRequest->get('title'),
            'content' => $questionStoreRequest->get('content'),
        ]);


        //topics的操作这时候看起来有点臃肿 可以使用TopicController来管理，暂时省略
        //存储topics
        $topics = $this->questionRepository->normalizeTopics($questionStoreRequest->get('topics'));
        //使用我们再question model里面添加的topics方法获得 topics关联，
        //再使用sync方法同步tag 【删除的会被删除掉，没删除的就保留，新的就增加】
        $question->topics()->sync($topics);

        //更新完成，跳转回去
        return redirect()->back();
    }


    /**Remove the specified resource from storage.
     * @param Question $question
     * @return \Illuminate\Http\RedirectResponse
     * @throws \Exception
     */
    public function destroy(Question $question)
    {
        //
        if (auth()->user()->can('destroy', $question)) {
            $question->delete();
            return redirect()->route('questions.index')->with('success', "删除成功！");
        }
        return redirect()->back()->with('danger', "你不能删除不属于你的问题！");
    }


    public function follow(Question $question)
    {
        if (auth()->user()->can('follow', $question)) //通过QuestionPolicy的follow方法判断用户是否可以关注问题
        {
            $message = "关注";
        } else {
            $message = "取关";
        }
        //同步记录
        auth()->user()->followQuestions()->toggle($question);
        $question->followers_count = $question->followUsers()->count();
        $question->save();
        return redirect()->back()->with('success', $message . '成功！');
    }

}

更新模型关系，加时间数据存储：

User.php

<?php

namespace App;

use App\Models\Question;
use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\SoftDeletes;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;

class User extends Authenticatable implements MustVerifyEmail
{
    use Notifiable;
    #region 支持软删除
    use SoftDeletes;
    protected $dates = ['deleted_at'];
    #endregion
    /**
     * The attributes that are mass assignable.
     *
     * @var array
     */
    protected $fillable = [
        'name', 'email', 'password', 'avatar', 'activation_token'
    ];

    /**
     * The attributes that should be hidden for arrays.
     *
     * @var array
     */
    protected $hidden = [
        'password', 'remember_token',
    ];

    /**
     * The attributes that should be cast to native types.
     *
     * @var array
     */
    protected $casts = [
        'email_verified_at' => 'datetime',
    ];


    /**添加用户模型和问题模型的模型关联
     * @return \Illuminate\Database\Eloquent\Relations\HasMany
     */
    public function questions()
    {
        return $this->hasMany(Question::class);
    }


    /** 添加用户模型和回答模型的模型关联 一个用户可以有多个回答
     * @return \Illuminate\Database\Eloquent\Relations\HasMany
     */
    public function answers()
    {
        return $this->hasMany(Answer::class);
    }


    public function followQuestions()
    {
        //默认表名 可以不设置后面三个参数，自定义表名需要设置
        return $this->belongsToMany(Question::class, 'users_questions', 'question_id', 'user_id')->withTimestamps();
    }
}

Question.php

<?php

namespace App\Models;

use App\Answer;
use App\Topic;
use App\User;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Database\Eloquent\SoftDeletes;

class Question extends Model
{
    //软删除 添加
    use SoftDeletes;
    //
    protected $fillable = ['title', 'content', 'user_id'];
    //支持软删除 添加
    protected $dates = ['deleted_at'];

    public function topics()
    {
        return $this->belongsToMany(
            Topic::class,
            'questions_topics' //表名我设置的是questions_topics，可能不是系统自动解析的question_topic
        )->withTimestamps();//withTimestamps操作questions_topics表中create_at及updated_at字段的
    }

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

    /** scope+请求名命名的
     * @return bool
     */
    public function scopePublished($query)
    {
        return $query->where('is_hidden', 'F');//等于F表示不隐藏
    }


    /** 一个问题有多个回答
     * @return \Illuminate\Database\Eloquent\Relations\HasMany
     */
    public function answers()
    {
        return $this->hasMany(Answer::class);
    }


    public function followUsers()
    {
        //默认表名 可以不设置后面三个参数，自定义表名需要设置
        return $this->belongsToMany(Question::class, 'users_questions', 'user_id', 'question_id')->withTimestamps();
    }

}