「いいね」機能をつける場合、ログインユーザーのみが「いいね」できるようにする方法が一般的ですが、ログインなしの場合でも可能です。
今回は、前半はログインしているユーザー用の「いいね」機能について解説します。
後半は、ここにログインなしユーザーの「いいね」も反映されるようにしていきます。
ログインなしの場合は、IPアドレスを使って、ユーザーを識別します。

Laravelの醍醐味のひとつは、リレーション。
今回はリレーションをフル活用して、機能を搭載していきますね。
Laravel いいね機能追加・ログインユーザー用
まずはログインユーザーのみが「いいね」できる機能を搭載します。
今回は、すでにUserモデルとPostモデルがあるとします。
ここに「Nice」モデルを追加して、Userモデル、Postモデルとリレーションを設定していきます。
① Niceモデルを作成
Niceモデルをマイグレーションと共に作成します。
1 |
php artisan make:model Nice -m |
マイグレーションファイルには、次のようにいれます。
1 2 3 4 5 6 7 8 9 |
public function up() { Schema::create('nices', function (Blueprint $table) { $table->id(); $table->unsignedBigInteger('post_id')->nullable(); $table->unsignedBigInteger('user_id')->nullable(); $table->timestamps(); }); } |
マイグレートを実行します。
1 |
php artisan migrate |
② リレーションを設定
Userモデル・Postモデル・Niceモデルにリレーションを設定します。
【Userモデルファイル】
1人ユーザーがたくさん投稿をし、さらに「いいね」をする可能性があります。
そこで、PostモデルとNiceモデルに対して、hasManyメソッドを設定します。
1 2 3 4 5 6 7 |
public function posts() { return $this->hasMany('App\Models\Post'); } public function nices() { return $this->hasMany('App\Models\Nice'); } |
【Postモデルファイル】
ひとつの投稿は、ひとりのユーザーに紐づくので、Postモデルに対してはbelongsToメソッドを設定します。
ですが、ひとつの投稿は、たくさんの「いいね」を獲得する可能性があるので、Niceモデルに対してはhasManyメソッドを設定します。
1 2 3 4 5 6 7 |
public function user() { return $this->belongsTo('App\Models\User'); } public function nices() { return $this->hasMany('App\Models\Nice'); } |
【Niceモデルファイル】
ひとつの「いいね」は1人のユーザー、ひとつの投稿に紐づくので、UserモデルとPostモデルそれずれに対して、belongsToメソッドを設定します。
1 2 3 4 5 6 7 |
public function user() { return $this->belongsTo('App\Models\User'); } public function post() { return $this->belongsTo('App\Models\Post'); } |
③ ルートファイルの設定
今回は既にある投稿表示用の画面に「いいね」機能を搭載することにします。
新たに 「いいね」用と、「いいね」取消用の2つのルート設定を作ります。
【routes/web.php】
1 2 3 4 5 6 7 |
use App\Http\Controllers\NiceController; (省略) // いいねボタン Route::get('/community/nice/{post}', [NiceController::class, 'nice'])->name('nice'); Route::get('/community/unnice/{post}', [NiceController::class, 'unnice'])->name('unnice'); |
④ コントローラーの作成
「いいね」を付け足し消したりする処理を記述するため、NiceContollerを作ります。
1 |
php artisan make:controller NiceController |
NiceControllerを開き、上部に、次の3つのuse宣言を追加しておきましょう。
1 2 3 4 5 6 |
namespace App\Http\Controllers; use Illuminate\Http\Request; // use宣言追加 use App\Models\Post; use App\Models\Nice; use Illuminate\Support\Facades\Auth; |
次に「いいね」をつけるためにniceメソッドを入れます。
【NiceController niceメソッド】
1 2 3 4 5 6 7 |
public function nice(Post $post, Request $request){ $nice=New Nice(); $nice->post_id=$post->id; $nice->user_id=Auth::user()->id; $nice->save(); return back(); } |
もうひとつ「いいね」を取り消すunniceメソッドを入れます。
【NiceController unniceメソッド】
1 2 3 4 5 6 |
public function unnice(Post $post, Request $request){ $user=Auth::user()->id; $nice=Nice::where('post_id', $post->id)->where('user_id', $user)->first(); $nice->delete(); return back(); } |
⑤ 投稿表示用のコントローラーに記述を追加
「いいね」ボタンを表示する投稿表示用のコントローラーにも、コードを少し追加します。
ログインユーザーが、個別投稿に「いいね」をしてある場合、$niceに値が入ります。
この$niceをビューファイルに受け渡します。
投稿を表示させるためのコントローラーのメソッドに、下記のコードを追加してください。
なお、ファイルの上部にuse宣言 use App\Models\Nice; も入れておきましょう。
【書き方例(showメソッドに記述する場合)】
1 2 3 4 5 6 |
public function show(Post $post) { $nice=Nice::where('post_id', $post->id)->where('user_id', auth()->user()->id)->first(); return view('post.show', compact('post', 'nice')); } |
⑥ビューファイルの作成
最後は、見える部分を作っていきます。
既にある投稿表示用のビューファイルに、次のように、「いいね」ボタンを設置します。
ちなみに、「いいね」は、こちらのハートマーク使っております。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<span> <img src="{{asset('img/nicebutton.png')}}" width="30px"> <!-- もし$niceがあれば=ユーザーが「いいね」をしていたら --> @if($nice) <!-- 「いいね」取消用ボタンを表示 --> <a href="{{ route('unnice', $post) }}" class="btn btn-success btn-sm"> いいね <!-- 「いいね」の数を表示 --> <span class="badge"> {{ $post->nices->count() }} </span> </a> @else <!-- まだユーザーが「いいね」をしていなければ、「いいね」ボタンを表示 --> <a href="{{ route('nice', $post) }}" class="btn btn-secondary btn-sm"> いいね <!-- 「いいね」の数を表示 --> <span class="badge"> {{ $post->nices->count() }} </span> </a> @endif </span> |
⑦ テストしてみる
では、テストしてみます。
「いいね」前は、こんな表示。
「いいね」をすると、こうなります。
もう1回ボタンを押すと、「いいね」が取り消されます。
もちろん、他のユーザーの「いいね」もカウントされます。
Laravel いいね機能追加・ログインなしでも可能にする
上記を加工して、次に「ログインなし」のユーザーの「いいね」も反映されるようにしていきましょう。
① ipアドレス用のカラムを追加
Niceのデータベースに、ipアドレス用のカラムを追加します。
一度、マイグレーションを取り消します。
1 |
php artisan migrate:rollback |
niceのマイグレーションファイルに、ipアドレス用カラムを付け足します。
【nice マイグレーションファイル】
1 2 3 4 5 6 7 8 9 10 11 12 |
public function up() { Schema::create('nices', function (Blueprint $table) { $table->id(); $table->unsignedBigInteger('post_id')->nullable(); $table->unsignedBigInteger('comment_id')->nullable(); $table->unsignedBigInteger('user_id')->nullable(); // このカラムを追加 $table->string('ip')->nullable(); $table->timestamps(); }); } |
再度マイグレートします。
1 |
php artisan migrate |
② 投稿表示用のコントローラーに記述を追加
次に、投稿を表示するためのコントローラーに処理を追加します。
ユーザーのipアドレスを取得。
このipアドレスで投稿に「いいね」をしてある場合、$niceに値が入ります。
この$niceをビューファイルに受け渡します。
【show.blade.php】
1 2 3 4 5 6 7 |
public function show(Post $post) { $request=request(); $ip = $request->ip(); $nice=Nice::where('post_id', $post->id)->where('ip', $ip)->first(); return view('post.show', compact('post', 'nice')); } |
③コントローラーの作成
最後にコントローラーです。
NiceControllerのniceメソッドは、次のように書き替えます。
ユーザーが「いいね」をすると、新しくNiceのインスタンスができます。
ユーザーのipアドレスが、nicesデータベースの ipカラムに入ります。
もしユーザーがログインしていれば、ユーザーのidが、nicesデータベースのuser_idに入ります。
【NiceController niceメソッド】
1 2 3 4 5 6 7 8 9 10 11 12 |
public function nice(Post $post, Request $request){ $nice=New Nice(); $nice->post_id=$post->id; $nice->ip = $request->ip(); if(Auth::check()){ $nice->user_id=Auth::user()->id; } $nice->save(); return back(); } |
unniceは、次のように書き替えます。
【NiceController unniceメソッド】
1 2 3 4 5 6 |
public function unnice(Post $post, Request $request){ $user=$request->ip(); $nice=Nice::where('post_id', $post->id)->where('ip', $user)->first(); $nice->delete(); return back(); } |
④ テストしてみる
では、テストをしてみます。
画面はログインありと全く同じですが^^; うまくいきました。
なお、ipアドレスを変えたら、何度も「いいね」が出来ちゃいます。
この辺りは、仕方ないですね。
コメント