Laravel Observer Event Broadcast Inertiajs Websocket

Tüm bu işlemler Laravel 9.x ve Sail ile yapılmıştır.

BAĞIMLILIKLAR

Kaynak: https://beyondco.de/docs/laravel-websockets/getting-started/installation

Laravel Websocket:

composer require beyondcode/laravel-websockets
php artisan vendor:publish --provider="BeyondCode\LaravelWebSockets\WebSocketsServiceProvider" --tag="migrations"
php artisan migrate
php artisan vendor:publish --provider="BeyondCode\LaravelWebSockets\WebSocketsServiceProvider" --tag="config"

Pusher Replacement

https://beyondco.de/docs/laravel-websockets/basic-usage/pusher

composer require pusher/pusher-php-server

BACKEND

Modelin Oluşturulması

Bir adet Model Oluşturulur. Örnek Kitap modeli olsun

Kaynak: https://laravel.com/docs/9.x/eloquent#generating-model-classes

# -mc parametresi ile migration ve controller dosyalarını da oluşturacak
php artisan make:model Book -mc

Event Oluşturulması

Kaynak: https://laravel.com/docs/9.x/events#generating-events-and-listeners

php artisan make:event BookCreatedEvent

App\Events\BookCreatedEvent.php

use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use App\Models\Book

class BookCreatedEvent implements ShouldBroadcast
{
public $book;

public function __construct(Book $book)
    {
        $this->book = $book;
    }
...
}

Broadcasting için ShouldBroadcast implement etmemiz gerekiyor. Buna bağlı olarak aşağıdaki metotları dolduruyoruz.

public function broadcastOn()
{
    return new Channel('book.created');
}

public function broadcastWith()
{
    return [
        'id' => $this->book->id,
        'title' => $this->book->title
    ];
}

public function broadcastAs()
{
    return 'book-created';
}

Observer oluşturulması

Bu model için bir adet observer oluşturalım:

Kaynak: https://laravel.com/docs/9.x/eloquent#observers

php artisan make:observer BookObserver --model=Book

App\Providers\EventServiceProvider içinde boot() methodunda

App\Models\Book::observe(App\Observers\BookObserver::class); satırı eklenir. Böylece Model için observer tanıtılır.

App\Observers\BookObserver class’ında istediğimiz event içinde
Örnek:

public function created(Book $Book)
{
    broadcast(new BookCreatedEvent($book));
}

FRONTEND

npm install --save-dev laravel-echo

resources/js/bootstrap.js


import Echo from 'laravel-echo';
window.Echo = new Echo({
    broadcaster: 'pusher',
    key: import.meta.env.VITE_PUSHER_APP_KEY,
    cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER,
    forceTLS: false,
    wsHost: window.location.hostname,
    wsPort: 6001
});
...
mounted() {
	window.Echo.channel(`book.created`)
	.listen('.book-created', (e) => {
	  console.log(e.history);
	});
},
unmounted() {
	window.Echo.channel(`book.created`)
	.stopListening('.book-created');
},
...

DOCKER

docker/8.1/supervisord.conf

...
[program:websockets]
command=/usr/bin/php /var/www/html/artisan websockets:serve
numprocs=1
autostart=true
autorestart=true
user=sail

CLI

php artisan ./vendor/bin/sail build
php artisan ./vendor/bin/sail up -d

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir