コンテンツへスキップ

ブロードキャスティング

イントロダクション

多くのモダンなWebアプリケーションでは、リアルタイムでライブ更新されるユーザーインターフェイスを実装するためにWebSocketが使用されます。サーバ上でデータが更新されると、通常、WebSocket接続を介してメッセージが送信され、クライアントで処理されます。WebSocketは、UIに反映すべきデータ変更のためにアプリケーションのサーバを継続的にポーリングするよりも効率的な代替手段を提供します。

たとえば、アプリケーションがユーザーのデータをCSVファイルにエクスポートしてメールで送信できると想像してください。しかし、このCSVファイルの作成には数分かかるため、CSVの作成と郵送をキュー投入したジョブ内で処理することにします。CSVが作成され、ユーザーにメールで送信されたら、イベントブロードキャストを使用してApp\Events\UserDataExportedイベントをディスパッチし、アプリケーションのJavaScriptで受信できます。イベントを受信すると、ユーザーがページを更新することなく、CSVがメールで送信されたことをユーザーにメッセージで表示できます。

このような機能の構築を支援するために、LaravelはサーバサイドのLaravelイベントをWebSocket接続を介して「ブロードキャスト」するのを簡単にします。Laravelイベントをブロードキャストすることで、サーバサイドのLaravelアプリケーションとクライアントサイドのJavaScriptアプリケーション間で同じイベント名とデータを共有できます。

ブロードキャストの背後にある中心的な概念は単純です。クライアントはフロントエンドで名前付きチャンネルに接続し、Laravelアプリケーションはバックエンドでこれらのチャンネルにイベントをブロードキャストします。これらのイベントには、フロントエンドで利用可能にしたい追加データを含めることができます。

対応ドライバ

デフォルトで、Laravelには3つのサーバサイドブロードキャストドライバが用意されています。Laravel ReverbPusher ChannelsAblyです。

イベントブロードキャストを深く掘り下げる前に、Laravelのイベントとリスナに関するドキュメントを必ず読んでください。

サーバサイドのインストール

Laravelのイベントブロードキャストを使い始めるには、Laravelアプリケーション内でいくつかの設定を行い、いくつかのパッケージをインストールする必要があります。

イベントブロードキャストは、サーバサイドのブロードキャストドライバによって実現され、LaravelイベントをブロードキャストしてLaravel Echo(JavaScriptライブラリ)がブラウザクライアント内で受信できるようにします。心配はいりません。インストールの各部分を段階的に説明します。

設定

アプリケーションのすべてのイベントブロードキャスト設定は、config/broadcasting.php設定ファイルに保存されます。アプリケーションにこのディレクトリが存在しなくても心配いりません。install:broadcasting Artisanコマンドを実行すると作成されます。

Laravelは、すぐに使えるいくつかのブロードキャストドライバをサポートしています。Laravel ReverbPusher ChannelsAbly、そしてローカル開発とデバッグ用のlogドライバです。さらに、テスト中にブロードキャストを無効にできるnullドライバも含まれています。これらの各ドライバの設定例がconfig/broadcasting.php設定ファイルに含まれています。

インストール

デフォルトでは、新しいLaravelアプリケーションではブロードキャストは有効になっていません。install:broadcasting Artisanコマンドを使用してブロードキャストを有効にできます。

1php artisan install:broadcasting

install:broadcastingコマンドは、config/broadcasting.php設定ファイルを作成します。さらに、このコマンドは、アプリケーションのブロードキャスト認可ルートとコールバックを登録できるroutes/channels.phpファイルも作成します。

キューの設定

イベントをブロードキャストする前に、まずキューワーカを設定して実行する必要があります。すべてのイベントブロードキャストは、アプリケーションの応答時間がイベントのブロードキャストによって深刻な影響を受けないように、キュー投入されたジョブを介して行われます。

Reverb

install:broadcastingコマンドを実行すると、Laravel Reverbをインストールするように促されます。もちろん、Composerパッケージマネージャを使用してReverbを手動でインストールすることもできます。

1composer require laravel/reverb

パッケージがインストールされたら、Reverbのインストールコマンドを実行して設定を公開し、Reverbの必須環境変数を追加し、アプリケーションでイベントブロードキャストを有効にすることができます。

1php artisan reverb:install

詳細なReverbのインストールと使用方法については、Reverbのドキュメントで確認できます。

Pusher Channels

Pusher Channelsを使用してイベントをブロードキャストする予定がある場合は、Composerパッケージマネージャを使用してPusher Channels PHP SDKをインストールする必要があります。

1composer require pusher/pusher-php-server

次に、config/broadcasting.php設定ファイルでPusher Channelsの資格情報を設定する必要があります。このファイルにはすでにPusher Channelsの設定例が含まれており、キー、シークレット、アプリケーションIDを素早く指定できます。通常、アプリケーションの.envファイルでPusher Channelsの資格情報を設定する必要があります。

1PUSHER_APP_ID="your-pusher-app-id"
2PUSHER_APP_KEY="your-pusher-key"
3PUSHER_APP_SECRET="your-pusher-secret"
4PUSHER_HOST=
5PUSHER_PORT=443
6PUSHER_SCHEME="https"
7PUSHER_APP_CLUSTER="mt1"

config/broadcasting.phpファイルのpusher設定では、クラスタなど、Channelsでサポートされている追加のoptionsを指定することもできます。

次に、アプリケーションの.envファイルでBROADCAST_CONNECTION環境変数をpusherに設定します。

1BROADCAST_CONNECTION=pusher

最後に、クライアントサイドでブロードキャストイベントを受信するLaravel Echoをインストールして設定する準備ができました。

Ably

以下のドキュメントでは、「Pusher互換」モードでAblyを使用する方法について説明しています。しかし、Ablyチームは、Ablyが提供する独自の機能を活用できるブロードキャスタとEchoクライアントを推奨および維持しています。Ablyが維持しているドライバの使用に関する詳細については、AblyのLaravelブロードキャスタドキュメントを参照してください。

Ablyを使用してイベントをブロードキャストする予定の場合は、Composerパッケージマネージャを使用してAbly PHP SDKをインストールする必要があります。

1composer require ably/ably-php

次に、config/broadcasting.php設定ファイルでAblyの資格情報を設定する必要があります。このファイルにはすでにAblyの設定例が含まれており、キーを素早く指定できます。通常、この値はABLY_KEY 環境変数を介して設定する必要があります。

1ABLY_KEY=your-ably-key

次に、アプリケーションの.envファイルでBROADCAST_CONNECTION環境変数をablyに設定します。

1BROADCAST_CONNECTION=ably

最後に、クライアントサイドでブロードキャストイベントを受信するLaravel Echoをインストールして設定する準備ができました。

クライアントサイドのインストール

Reverb

Laravel Echoは、チャンネルへの購読や、サーバサイドのブロードキャストドライバによってブロードキャストされたイベントのリッスンを簡単にするJavaScriptライブラリです。NPMパッケージマネージャを介してEchoをインストールできます。この例では、ReverbがWebSocketの購読、チャンネル、メッセージにPusherプロトコルを利用するため、pusher-jsパッケージもインストールします。

1npm install --save-dev laravel-echo pusher-js

Echoをインストールしたら、アプリケーションのJavaScriptで新しいEchoインスタンスを作成する準備ができました。これを行うのに最適な場所は、Laravelフレームワークに含まれているresources/js/bootstrap.jsファイルの末尾です。デフォルトでは、このファイルにはすでにEchoの設定例が含まれています。コメントを解除し、broadcaster設定オプションをreverbに更新するだけです。

1import Echo from 'laravel-echo';
2 
3import Pusher from 'pusher-js';
4window.Pusher = Pusher;
5 
6window.Echo = new Echo({
7 broadcaster: 'reverb',
8 key: import.meta.env.VITE_REVERB_APP_KEY,
9 wsHost: import.meta.env.VITE_REVERB_HOST,
10 wsPort: import.meta.env.VITE_REVERB_PORT,
11 wssPort: import.meta.env.VITE_REVERB_PORT,
12 forceTLS: (import.meta.env.VITE_REVERB_SCHEME ?? 'https') === 'https',
13 enabledTransports: ['ws', 'wss'],
14});

次に、アプリケーションのアセットをコンパイルする必要があります。

1npm run build

Laravel Echoのreverbブロードキャスタには、laravel-echo v1.16.0以降が必要です。

Pusher Channels

Laravel Echoは、チャンネルへの購読や、サーバサイドのブロードキャストドライバによってブロードキャストされたイベントのリッスンを簡単にするJavaScriptライブラリです。Echoはまた、WebSocketの購読、チャンネル、メッセージにPusherプロトコルを実装するためにpusher-js NPMパッケージを活用しています。

install:broadcasting Artisanコマンドは、laravel-echopusher-jsパッケージを自動的にインストールします。しかし、これらのパッケージをNPMを介して手動でインストールすることもできます。

1npm install --save-dev laravel-echo pusher-js

Echoをインストールしたら、アプリケーションのJavaScriptで新しいEchoインスタンスを作成する準備ができました。install:broadcastingコマンドは、resources/js/echo.jsにEchoの設定ファイルを作成します。ただし、このファイルのデフォルト設定はLaravel Reverb用です。以下の設定をコピーして、設定をPusherに移行できます。

1import Echo from 'laravel-echo';
2 
3import Pusher from 'pusher-js';
4window.Pusher = Pusher;
5 
6window.Echo = new Echo({
7 broadcaster: 'pusher',
8 key: import.meta.env.VITE_PUSHER_APP_KEY,
9 cluster: import.meta.env.VITE_PUSHER_APP_CLUSTER,
10 forceTLS: true
11});

次に、アプリケーションの.envファイルでPusher環境変数に適切な値を定義する必要があります。これらの変数が.envファイルにまだ存在しない場合は、追加してください。

1PUSHER_APP_ID="your-pusher-app-id"
2PUSHER_APP_KEY="your-pusher-key"
3PUSHER_APP_SECRET="your-pusher-secret"
4PUSHER_HOST=
5PUSHER_PORT=443
6PUSHER_SCHEME="https"
7PUSHER_APP_CLUSTER="mt1"
8 
9VITE_APP_NAME="${APP_NAME}"
10VITE_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
11VITE_PUSHER_HOST="${PUSHER_HOST}"
12VITE_PUSHER_PORT="${PUSHER_PORT}"
13VITE_PUSHER_SCHEME="${PUSHER_SCHEME}"
14VITE_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"

アプリケーションのニーズに合わせてEchoの設定を調整したら、アプリケーションのアセットをコンパイルできます。

1npm run build

アプリケーションのJavaScriptアセットのコンパイルについて詳しく知るには、Viteに関するドキュメントを参照してください。

既存のクライアントインスタンスの使用

Echoで利用したい、事前に設定済みのPusher Channelsクライアントインスタンスがすでにある場合は、client設定オプションを介してEchoに渡すことができます。

1import Echo from 'laravel-echo';
2import Pusher from 'pusher-js';
3 
4const options = {
5 broadcaster: 'pusher',
6 key: 'your-pusher-channels-key'
7}
8 
9window.Echo = new Echo({
10 ...options,
11 client: new Pusher(options.key, options)
12});

Ably

以下のドキュメントでは、「Pusher互換」モードでAblyを使用する方法について説明しています。しかし、Ablyチームは、Ablyが提供する独自の機能を活用できるブロードキャスタとEchoクライアントを推奨および維持しています。Ablyが維持しているドライバの使用に関する詳細については、AblyのLaravelブロードキャスタドキュメントを参照してください。

Laravel Echoは、チャンネルへの購読や、サーバサイドのブロードキャストドライバによってブロードキャストされたイベントのリッスンを簡単にするJavaScriptライブラリです。Echoはまた、WebSocketの購読、チャンネル、メッセージにPusherプロトコルを実装するためにpusher-js NPMパッケージを活用しています。

install:broadcasting Artisanコマンドは、laravel-echopusher-jsパッケージを自動的にインストールします。しかし、これらのパッケージをNPMを介して手動でインストールすることもできます。

1npm install --save-dev laravel-echo pusher-js

続行する前に、Ablyアプリケーション設定でPusherプロトコルのサポートを有効にする必要があります。この機能は、Ablyアプリケーションの「Protocol Adapter Settings」部分で有効にできます。

Echoをインストールしたら、アプリケーションのJavaScriptで新しいEchoインスタンスを作成する準備ができました。install:broadcastingコマンドは、resources/js/echo.jsにEchoの設定ファイルを作成します。ただし、このファイルのデフォルト設定はLaravel Reverb用です。以下の設定をコピーして、設定をAblyに移行できます。

1import Echo from 'laravel-echo';
2 
3import Pusher from 'pusher-js';
4window.Pusher = Pusher;
5 
6window.Echo = new Echo({
7 broadcaster: 'pusher',
8 key: import.meta.env.VITE_ABLY_PUBLIC_KEY,
9 wsHost: 'realtime-pusher.ably.io',
10 wsPort: 443,
11 disableStats: true,
12 encrypted: true,
13});

Ably Echoの設定がVITE_ABLY_PUBLIC_KEY環境変数を参照していることにお気づきかもしれません。この変数の値は、Ablyの公開鍵である必要があります。公開鍵は、Ablyキーの:文字の前の部分です。

ニーズに合わせてEchoの設定を調整したら、アプリケーションのアセットをコンパイルできます。

1npm run dev

アプリケーションのJavaScriptアセットのコンパイルについて詳しく知るには、Viteに関するドキュメントを参照してください。

概念の概要

Laravelのイベントブロードキャストを使用すると、ドライバベースのアプローチでWebSocketを使用して、サーバサイドのLaravelイベントをクライアントサイドのJavaScriptアプリケーションにブロードキャストできます。現在、LaravelにはPusher ChannelsAblyドライバが付属しています。イベントは、Laravel Echo JavaScriptパッケージを使用してクライアントサイドで簡単に消費できます。

イベントは「チャンネル」を介してブロードキャストされ、パブリックまたはプライベートとして指定できます。アプリケーションへの訪問者は誰でも、認証や認可なしにパブリックチャンネルを購読できます。ただし、プライベートチャンネルを購読するには、ユーザーが認証され、そのチャンネルでリッスンすることが認可されている必要があります。

アプリケーション例の使用

イベントブロードキャストの各コンポーネントを詳しく見る前に、eコマースストアを例に挙げて、高レベルの概要を見てみましょう。

私たちのアプリケーションでは、ユーザーが注文の配送状況を表示できるページがあると仮定します。また、配送状況の更新がアプリケーションによって処理されるときにOrderShipmentStatusUpdatedイベントが発生すると仮定します。

1use App\Events\OrderShipmentStatusUpdated;
2 
3OrderShipmentStatusUpdated::dispatch($order);

ShouldBroadcastインターフェース

ユーザーが自分の注文の1つを表示しているとき、ステータスの更新を表示するためにページを更新する必要はありません。代わりに、更新が作成されたときにアプリケーションにブロードキャストしたいと考えています。そこで、OrderShipmentStatusUpdatedイベントにShouldBroadcastインターフェースをマークする必要があります。これにより、イベントが発生したときにLaravelにイベントをブロードキャストするように指示します。

1<?php
2 
3namespace App\Events;
4 
5use App\Models\Order;
6use Illuminate\Broadcasting\Channel;
7use Illuminate\Broadcasting\InteractsWithSockets;
8use Illuminate\Broadcasting\PresenceChannel;
9use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
10use Illuminate\Queue\SerializesModels;
11 
12class OrderShipmentStatusUpdated implements ShouldBroadcast
13{
14 /**
15 * The order instance.
16 *
17 * @var \App\Models\Order
18 */
19 public $order;
20}

ShouldBroadcastインターフェースは、イベントにbroadcastOnメソッドを定義することを要求します。このメソッドは、イベントがブロードキャストされるべきチャンネルを返す責任があります。このメソッドの空のスタブは、生成されたイベントクラスにすでに定義されているため、詳細を埋めるだけで済みます。注文の作成者のみがステータスの更新を表示できるようにしたいため、注文に関連付けられたプライベートチャンネルでイベントをブロードキャストします。

1use Illuminate\Broadcasting\Channel;
2use Illuminate\Broadcasting\PrivateChannel;
3 
4/**
5 * Get the channel the event should broadcast on.
6 */
7public function broadcastOn(): Channel
8{
9 return new PrivateChannel('orders.'.$this->order->id);
10}

イベントを複数のチャンネルでブロードキャストしたい場合は、代わりにarrayを返すことができます。

1use Illuminate\Broadcasting\PrivateChannel;
2 
3/**
4 * Get the channels the event should broadcast on.
5 *
6 * @return array<int, \Illuminate\Broadcasting\Channel>
7 */
8public function broadcastOn(): array
9{
10 return [
11 new PrivateChannel('orders.'.$this->order->id),
12 // ...
13 ];
14}

チャンネルの認可

ユーザーはプライベートチャンネルでリッスンするために認可されている必要があることを忘れないでください。チャンネルの認可ルールは、アプリケーションのroutes/channels.phpファイルで定義できます。この例では、プライベートなorders.1チャンネルでリッスンしようとするユーザーが実際に注文の作成者であることを確認する必要があります。

1use App\Models\Order;
2use App\Models\User;
3 
4Broadcast::channel('orders.{orderId}', function (User $user, int $orderId) {
5 return $user->id === Order::findOrNew($orderId)->user_id;
6});

channelメソッドは2つの引数を受け取ります。チャンネルの名前と、ユーザーがチャンネルでリッスンすることを認可されているかどうかを示すtrueまたはfalseを返すコールバックです。

すべての認可コールバックは、現在認証されているユーザーを最初の引数として受け取り、追加のワイルドカードパラメータを後続の引数として受け取ります。この例では、{orderId}プレースホルダーを使用して、チャンネル名の「ID」部分がワイルドカードであることを示しています。

イベントブロードキャストのリッスン

次に、残っているのはJavaScriptアプリケーションでイベントをリッスンすることだけです。これはLaravel Echoを使用して行うことができます。まず、privateメソッドを使用してプライベートチャンネルにサブスクライブします。次に、listenメソッドを使用してOrderShipmentStatusUpdatedイベントをリッスンできます。デフォルトでは、イベントのすべてのパブリックプロパティがブロードキャストイベントに含まれます。

1Echo.private(`orders.${orderId}`)
2 .listen('OrderShipmentStatusUpdated', (e) => {
3 console.log(e.order);
4 });

ブロードキャストイベントの定義

特定のイベントをブロードキャストすべきことをLaravelに通知するには、イベントクラスにIlluminate\Contracts\Broadcasting\ShouldBroadcastインターフェースを実装する必要があります。このインターフェースは、フレームワークによって生成されたすべてのイベントクラスにすでにインポートされているため、どのイベントにも簡単に追加できます。

ShouldBroadcastインターフェースは、1つのメソッドbroadcastOnを実装することを要求します。broadcastOnメソッドは、イベントがブロードキャストされるべきチャンネルまたはチャンネルの配列を返す必要があります。チャンネルはChannelPrivateChannel、またはPresenceChannelのインスタンスである必要があります。Channelのインスタンスは、どのユーザーでもサブスクライブできるパブリックチャンネルを表し、PrivateChannelsPresenceChannelsチャンネル認可が必要なプライベートチャンネルを表します。

1<?php
2 
3namespace App\Events;
4 
5use App\Models\User;
6use Illuminate\Broadcasting\Channel;
7use Illuminate\Broadcasting\InteractsWithSockets;
8use Illuminate\Broadcasting\PresenceChannel;
9use Illuminate\Broadcasting\PrivateChannel;
10use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
11use Illuminate\Queue\SerializesModels;
12 
13class ServerCreated implements ShouldBroadcast
14{
15 use SerializesModels;
16 
17 /**
18 * Create a new event instance.
19 */
20 public function __construct(
21 public User $user,
22 ) {}
23 
24 /**
25 * Get the channels the event should broadcast on.
26 *
27 * @return array<int, \Illuminate\Broadcasting\Channel>
28 */
29 public function broadcastOn(): array
30 {
31 return [
32 new PrivateChannel('user.'.$this->user->id),
33 ];
34 }
35}

ShouldBroadcastインターフェースを実装した後、通常どおりにイベントを発生させるだけです。イベントが発生すると、キュー投入されたジョブが指定されたブロードキャストドライバを使用して自動的にイベントをブロードキャストします。

ブロードキャスト名

デフォルトでは、Laravelはイベントのクラス名を使用してイベントをブロードキャストします。ただし、イベントにbroadcastAsメソッドを定義することで、ブロードキャスト名をカスタマイズできます。

1/**
2 * The event's broadcast name.
3 */
4public function broadcastAs(): string
5{
6 return 'server.created';
7}

broadcastAsメソッドを使用してブロードキャスト名をカスタマイズする場合は、先頭に.文字を付けてリスナを登録してください。これにより、Echoはアプリケーションの名前空間をイベントに付加しなくなります。

1.listen('.server.created', function (e) {
2 // ...
3});

ブロードキャストデータ

イベントがブロードキャストされると、そのすべてのpublicプロパティが自動的にシリアライズされ、イベントのペイロードとしてブロードキャストされるため、JavaScriptアプリケーションからそのパブリックデータにアクセスできます。したがって、たとえば、イベントにEloquentモデルを含む単一のパブリックな$userプロパティがある場合、イベントのブロードキャストペイロードは次のようになります。

1{
2 "user": {
3 "id": 1,
4 "name": "Patrick Stewart"
5 ...
6 }
7}

ただし、ブロードキャストペイロードをより細かく制御したい場合は、イベントにbroadcastWithメソッドを追加できます。このメソッドは、イベントペイロードとしてブロードキャストしたいデータの配列を返す必要があります。

1/**
2 * Get the data to broadcast.
3 *
4 * @return array<string, mixed>
5 */
6public function broadcastWith(): array
7{
8 return ['id' => $this->user->id];
9}

ブロードキャストキュー

デフォルトでは、各ブロードキャストイベントは、queue.php設定ファイルで指定されたデフォルトのキュー接続のデフォルトキューに配置されます。イベントクラスにconnectionおよびqueueプロパティを定義することで、ブロードキャスタが使用するキュー接続と名前をカスタマイズできます。

1/**
2 * The name of the queue connection to use when broadcasting the event.
3 *
4 * @var string
5 */
6public $connection = 'redis';
7 
8/**
9 * The name of the queue on which to place the broadcasting job.
10 *
11 * @var string
12 */
13public $queue = 'default';

または、イベントにbroadcastQueueメソッドを定義することで、キュー名をカスタマイズできます。

1/**
2 * The name of the queue on which to place the broadcasting job.
3 */
4public function broadcastQueue(): string
5{
6 return 'default';
7}

デフォルトのキュードライバの代わりにsyncキューを使用してイベントをブロードキャストしたい場合は、ShouldBroadcastの代わりにShouldBroadcastNowインターフェースを実装できます。

1<?php
2 
3use Illuminate\Contracts\Broadcasting\ShouldBroadcastNow;
4 
5class OrderShipmentStatusUpdated implements ShouldBroadcastNow
6{
7 // ...
8}

ブロードキャスト条件

特定の条件が真の場合にのみイベントをブロードキャストしたい場合があります。これらの条件は、イベントクラスにbroadcastWhenメソッドを追加することで定義できます。

1/**
2 * Determine if this event should broadcast.
3 */
4public function broadcastWhen(): bool
5{
6 return $this->order->value > 100;
7}

ブロードキャストとデータベーストランザクション

ブロードキャストイベントがデータベーストランザクション内でディスパッチされると、データベーストランザクションがコミットされる前にキューによって処理されることがあります。これが発生した場合、データベーストランザクション中に行ったモデルやデータベースレコードへの更新がまだデータベースに反映されていない可能性があります。さらに、トランザクション内で作成されたモデルやデータベースレコードがデータベースに存在しない場合があります。イベントがこれらのモデルに依存している場合、イベントをブロードキャストするジョブが処理されるときに予期しないエラーが発生する可能性があります。

キュー接続のafter_commit設定オプションがfalseに設定されている場合でも、イベントクラスにShouldDispatchAfterCommitインターフェースを実装することで、特定のブロードキャストイベントが開いているすべてのデータベーストランザクションがコミットされた後にディスパッチされるべきであることを示すことができます。

1<?php
2 
3namespace App\Events;
4 
5use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
6use Illuminate\Contracts\Events\ShouldDispatchAfterCommit;
7use Illuminate\Queue\SerializesModels;
8 
9class ServerCreated implements ShouldBroadcast, ShouldDispatchAfterCommit
10{
11 use SerializesModels;
12}

これらの問題の回避策の詳細については、キュー投入するジョブとデータベーストランザクションに関するドキュメントを確認してください。

チャンネルの認可

プライベートチャンネルでは、現在認証されているユーザーが実際にチャンネルでリッスンできることを認可する必要があります。これは、チャンネル名を含むHTTPリクエストをLaravelアプリケーションに行い、アプリケーションがユーザーがそのチャンネルでリッスンできるかどうかを判断できるようにすることで実現されます。Laravel Echoを使用する場合、プライベートチャンネルへのサブスクリプションを認可するためのHTTPリクエストは自動的に行われます。

ブロードキャストが有効になると、Laravelは認可リクエストを処理するために/broadcasting/authルートを自動的に登録します。/broadcasting/authルートは自動的にwebミドルウェアグループ内に配置されます。

認可コールバックの定義

次に、現在認証されているユーザーが特定のチャンネルでリッスンできるかどうかを実際に決定するロジックを定義する必要があります。これは、install:broadcasting Artisanコマンドによって作成されたroutes/channels.phpファイルで行われます。このファイルでは、Broadcast::channelメソッドを使用してチャンネル認可コールバックを登録できます。

1use App\Models\User;
2 
3Broadcast::channel('orders.{orderId}', function (User $user, int $orderId) {
4 return $user->id === Order::findOrNew($orderId)->user_id;
5});

channelメソッドは2つの引数を受け取ります。チャンネルの名前と、ユーザーがチャンネルでリッスンすることを認可されているかどうかを示すtrueまたはfalseを返すコールバックです。

すべての認可コールバックは、現在認証されているユーザーを最初の引数として受け取り、追加のワイルドカードパラメータを後続の引数として受け取ります。この例では、{orderId}プレースホルダーを使用して、チャンネル名の「ID」部分がワイルドカードであることを示しています。

channel:list Artisanコマンドを使用して、アプリケーションのブロードキャスト認可コールバックのリストを表示できます。

1php artisan channel:list

認可コールバックのモデル結合

HTTPルートと同様に、チャンネルルートも暗黙的および明示的なルートモデル結合を利用できます。たとえば、文字列または数値の注文IDを受け取る代わりに、実際のOrderモデルインスタンスを要求できます。

1use App\Models\Order;
2use App\Models\User;
3 
4Broadcast::channel('orders.{order}', function (User $user, Order $order) {
5 return $user->id === $order->user_id;
6});

HTTPルートモデル結合とは異なり、チャンネルモデル結合は自動的な暗黙的モデル結合のスコープ指定をサポートしていません。しかし、ほとんどのチャンネルは単一のモデルの一意の主キーに基づいてスコープを指定できるため、これはほとんど問題になりません。

認可コールバックの認証

プライベートおよびプレゼンスブロードキャストチャンネルは、アプリケーションのデフォルトの認証ガードを介して現在のユーザーを認証します。ユーザーが認証されていない場合、チャンネル認可は自動的に拒否され、認可コールバックは実行されません。ただし、必要に応じて、受信リクエストを認証する複数のカスタムガードを割り当てることができます。

1Broadcast::channel('channel', function () {
2 // ...
3}, ['guards' => ['web', 'admin']]);

チャンネルクラスの定義

アプリケーションが多くの異なるチャンネルを使用している場合、routes/channels.phpファイルが肥大化する可能性があります。そこで、クロージャを使用してチャンネルを認可する代わりに、チャンネルクラスを使用できます。チャンネルクラスを生成するには、make:channel Artisanコマンドを使用します。このコマンドは、App/Broadcastingディレクトリに新しいチャンネルクラスを配置します。

1php artisan make:channel OrderChannel

次に、routes/channels.phpファイルにチャンネルを登録します。

1use App\Broadcasting\OrderChannel;
2 
3Broadcast::channel('orders.{order}', OrderChannel::class);

最後に、チャンネルの認可ロジックをチャンネルクラスのjoinメソッドに配置できます。このjoinメソッドには、通常チャンネル認可クロージャに配置するのと同じロジックを格納します。チャンネルモデル結合も利用できます。

1<?php
2 
3namespace App\Broadcasting;
4 
5use App\Models\Order;
6use App\Models\User;
7 
8class OrderChannel
9{
10 /**
11 * Create a new channel instance.
12 */
13 public function __construct() {}
14 
15 /**
16 * Authenticate the user's access to the channel.
17 */
18 public function join(User $user, Order $order): array|bool
19 {
20 return $user->id === $order->user_id;
21 }
22}

Laravelの他の多くのクラスと同様に、チャンネルクラスはサービスコンテナによって自動的に解決されます。したがって、コンストラクタでチャンネルが必要とする依存関係をタイプヒントで指定できます。

イベントのブロードキャスト

イベントを定義し、ShouldBroadcastインターフェースでマークしたら、イベントのディスパッチメソッドを使用してイベントを発生させるだけです。イベントディスパッチャは、イベントがShouldBroadcastインターフェースでマークされていることに気づき、ブロードキャストのためにイベントをキューに入れます。

1use App\Events\OrderShipmentStatusUpdated;
2 
3OrderShipmentStatusUpdated::dispatch($order);

他者へのみ

イベントブロードキャストを利用するアプリケーションを構築する際、現在のユーザーを除く特定のチャンネルのすべてのサブスクライバにイベントをブロードキャストする必要がある場合があります。これは、broadcastヘルパとtoOthersメソッドを使用して実現できます。

1use App\Events\OrderShipmentStatusUpdated;
2 
3broadcast(new OrderShipmentStatusUpdated($update))->toOthers();

toOthersメソッドを使用したい場合をよりよく理解するために、ユーザーがタスク名を入力して新しいタスクを作成できるタスクリストアプリケーションを想像してみましょう。タスクを作成するために、アプリケーションは/task URLにリクエストを送信し、タスクの作成をブロードキャストして、新しいタスクのJSON表現を返すかもしれません。JavaScriptアプリケーションがエンドポイントから応答を受信すると、次のようにタスクリストに新しいタスクを直接挿入するかもしれません。

1axios.post('/task', task)
2 .then((response) => {
3 this.tasks.push(response.data);
4 });

しかし、タスクの作成もブロードキャストしたことを忘れないでください。JavaScriptアプリケーションがタスクリストにタスクを追加するためにこのイベントもリッスンしている場合、リストに重複したタスクが表示されます。1つはエンドポイントから、もう1つはブロードキャストからです。この問題は、toOthersメソッドを使用して、現在のユーザーにイベントをブロードキャストしないようにブロードキャスタに指示することで解決できます。

toOthersメソッドを呼び出すには、イベントがIlluminate\Broadcasting\InteractsWithSocketsトレイトを使用している必要があります。

設定

Laravel Echoインスタンスを初期化すると、接続にソケットIDが割り当てられます。JavaScriptアプリケーションからHTTPリクエストを行うためにグローバルなAxiosインスタンスを使用している場合、ソケットIDはすべての送信リクエストにX-Socket-IDヘッダとして自動的に添付されます。その後、toOthersメソッドを呼び出すと、LaravelはヘッダからソケットIDを抽出し、そのソケットIDを持つ接続にはブロードキャストしないようにブロードキャスタに指示します。

グローバルなAxiosインスタンスを使用していない場合は、JavaScriptアプリケーションを手動で設定して、すべての送信リクエストにX-Socket-IDヘッダを送信する必要があります。ソケットIDは、Echo.socketIdメソッドを使用して取得できます。

1var socketId = Echo.socketId();

接続のカスタマイズ

アプリケーションが複数のブロードキャスト接続と対話していて、デフォルト以外のブロードキャスタを使用してイベントをブロードキャストしたい場合は、viaメソッドを使用してイベントをプッシュする接続を指定できます。

1use App\Events\OrderShipmentStatusUpdated;
2 
3broadcast(new OrderShipmentStatusUpdated($update))->via('pusher');

あるいは、イベントのコンストラクタ内でbroadcastViaメソッドを呼び出すことで、イベントのブロードキャスト接続を指定できます。ただし、その前に、イベントクラスがInteractsWithBroadcastingトレイトを使用していることを確認してください。

1<?php
2 
3namespace App\Events;
4 
5use Illuminate\Broadcasting\Channel;
6use Illuminate\Broadcasting\InteractsWithBroadcasting;
7use Illuminate\Broadcasting\InteractsWithSockets;
8use Illuminate\Broadcasting\PresenceChannel;
9use Illuminate\Broadcasting\PrivateChannel;
10use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
11use Illuminate\Queue\SerializesModels;
12 
13class OrderShipmentStatusUpdated implements ShouldBroadcast
14{
15 use InteractsWithBroadcasting;
16 
17 /**
18 * Create a new event instance.
19 */
20 public function __construct()
21 {
22 $this->broadcastVia('pusher');
23 }
24}

匿名イベント

専用のイベントクラスを作成せずに、単純なイベントをアプリケーションのフロントエンドにブロードキャストしたい場合があります。これに対応するために、Broadcastファサードを使用すると、「匿名イベント」をブロードキャストできます。

1Broadcast::on('orders.'.$order->id)->send();

上記の例では、次のイベントがブロードキャストされます。

1{
2 "event": "AnonymousEvent",
3 "data": "[]",
4 "channel": "orders.1"
5}

asおよびwithメソッドを使用して、イベントの名前とデータをカスタマイズできます。

1Broadcast::on('orders.'.$order->id)
2 ->as('OrderPlaced')
3 ->with($order)
4 ->send();

上記の例では、次のようなイベントがブロードキャストされます。

1{
2 "event": "OrderPlaced",
3 "data": "{ id: 1, total: 100 }",
4 "channel": "orders.1"
5}

匿名イベントをプライベートまたはプレゼンスチャンネルでブロードキャストしたい場合は、privateおよびpresenceメソッドを利用できます。

1Broadcast::private('orders.'.$order->id)->send();
2Broadcast::presence('channels.'.$channel->id)->send();

sendメソッドを使用して匿名イベントをブロードキャストすると、イベントは処理のためにアプリケーションのキューにディスパッチされます。ただし、イベントをすぐにブロードキャストしたい場合は、sendNowメソッドを使用できます。

1Broadcast::on('orders.'.$order->id)->sendNow();

現在認証されているユーザーを除くすべてのチャンネルサブスクライバにイベントをブロードキャストするには、toOthersメソッドを呼び出すことができます。

1Broadcast::on('orders.'.$order->id)
2 ->toOthers()
3 ->send();

ブロードキャストの受信

イベントのリッスン

Laravel Echoをインストールしてインスタンス化したら、Laravelアプリケーションからブロードキャストされるイベントのリッスンを開始する準備ができました。まず、channelメソッドを使用してチャンネルのインスタンスを取得し、次にlistenメソッドを呼び出して指定されたイベントをリッスンします。

1Echo.channel(`orders.${this.order.id}`)
2 .listen('OrderShipmentStatusUpdated', (e) => {
3 console.log(e.order.name);
4 });

プライベートチャンネルでイベントをリッスンしたい場合は、代わりにprivateメソッドを使用します。listenメソッドの呼び出しをチェーンして、単一のチャンネルで複数のイベントをリッスンし続けることができます。

1Echo.private(`orders.${this.order.id}`)
2 .listen(/* ... */)
3 .listen(/* ... */)
4 .listen(/* ... */);

イベントのリッスンを停止

特定のイベントのリッスンをチャンネルから退出せずに停止したい場合は、stopListeningメソッドを使用できます。

1Echo.private(`orders.${this.order.id}`)
2 .stopListening('OrderShipmentStatusUpdated')

チャンネルからの退出

チャンネルから退出するには、EchoインスタンスでleaveChannelメソッドを呼び出すことができます。

1Echo.leaveChannel(`orders.${this.order.id}`);

チャンネルとその関連するプライベートおよびプレゼンスチャンネルから退出したい場合は、leaveメソッドを呼び出すことができます。

1Echo.leave(`orders.${this.order.id}`);

名前空間

上記の例では、イベントクラスの完全なApp\Events名前空間を指定していないことにお気づきかもしれません。これは、Echoが自動的にイベントがApp\Events名前空間にあると想定するためです。ただし、Echoをインスタンス化するときにnamespace設定オプションを渡すことで、ルート名前空間を設定できます。

1window.Echo = new Echo({
2 broadcaster: 'pusher',
3 // ...
4 namespace: 'App.Other.Namespace'
5});

あるいは、Echoを使用してイベントをサブスクライブするときに、イベントクラスの前に.を付けることができます。これにより、常に完全修飾クラス名を指定できます。

1Echo.channel('orders')
2 .listen('.Namespace\\Event\\Class', (e) => {
3 // ...
4 });

プレゼンスチャンネル

プレゼンスチャンネルは、プライベートチャンネルのセキュリティを基盤としながら、誰がチャンネルにサブスクライブしているかを認識するという追加機能を公開します。これにより、別のユーザーが同じページを表示しているときにユーザーに通知したり、チャットルームの参加者をリストしたりするなど、強力で協調的なアプリケーション機能を簡単に構築できます。

プレゼンスチャンネルの認可

すべてのプレゼンスチャンネルはプライベートチャンネルでもあるため、ユーザーはアクセスを認可されている必要があります。ただし、プレゼンスチャンネルの認可コールバックを定義する場合、ユーザーがチャンネルへの参加を認可されていればtrueを返すわけではありません。代わりに、ユーザーに関するデータの配列を返す必要があります。

認可コールバックによって返されたデータは、JavaScriptアプリケーションのプレゼンスチャンネルイベントリスナで利用可能になります。ユーザーがプレゼンスチャンネルへの参加を認可されていない場合は、falseまたはnullを返す必要があります。

1use App\Models\User;
2 
3Broadcast::channel('chat.{roomId}', function (User $user, int $roomId) {
4 if ($user->canJoinRoom($roomId)) {
5 return ['id' => $user->id, 'name' => $user->name];
6 }
7});

プレゼンスチャンネルへの参加

プレゼンスチャンネルに参加するには、Echoのjoinメソッドを使用できます。joinメソッドは、listenメソッドを公開するとともに、herejoiningleavingイベントにサブスクライブできるPresenceChannel実装を返します。

1Echo.join(`chat.${roomId}`)
2 .here((users) => {
3 // ...
4 })
5 .joining((user) => {
6 console.log(user.name);
7 })
8 .leaving((user) => {
9 console.log(user.name);
10 })
11 .error((error) => {
12 console.error(error);
13 });

hereコールバックは、チャンネルへの参加が成功するとすぐに実行され、現在チャンネルにサブスクライブしている他のすべてのユーザーのユーザー情報を含む配列を受け取ります。joiningメソッドは、新しいユーザーがチャンネルに参加したときに実行され、leavingメソッドは、ユーザーがチャンネルから退出したときに実行されます。errorメソッドは、認証エンドポイントが200以外のHTTPステータスコードを返すか、返されたJSONの解析に問題がある場合に実行されます。

プレゼンスチャンネルへのブロードキャスト

プレゼンスチャンネルは、パブリックまたはプライベートチャンネルと同様にイベントを受信できます。チャットルームの例を使用して、NewMessageイベントをルームのプレゼンスチャンネルにブロードキャストしたい場合があります。そのためには、イベントのbroadcastOnメソッドからPresenceChannelのインスタンスを返します。

1/**
2 * Get the channels the event should broadcast on.
3 *
4 * @return array<int, \Illuminate\Broadcasting\Channel>
5 */
6public function broadcastOn(): array
7{
8 return [
9 new PresenceChannel('chat.'.$this->message->room_id),
10 ];
11}

他のイベントと同様に、broadcastヘルパとtoOthersメソッドを使用して、現在のユーザーがブロードキャストを受信しないように除外できます。

1broadcast(new NewMessage($message));
2 
3broadcast(new NewMessage($message))->toOthers();

他の種類のイベントと同様に、Echoのlistenメソッドを使用して、プレゼンスチャンネルに送信されたイベントをリッスンできます。

1Echo.join(`chat.${roomId}`)
2 .here(/* ... */)
3 .joining(/* ... */)
4 .leaving(/* ... */)
5 .listen('NewMessage', (e) => {
6 // ...
7 });

モデルのブロードキャスト

モデルブロードキャストに関する以下のドキュメントを読む前に、Laravelのモデルブロードキャストサービスの一般的な概念と、ブロードキャストイベントを手動で作成およびリッスンする方法についてよく理解しておくことをお勧めします。

アプリケーションのEloquentモデルが作成、更新、または削除されたときにイベントをブロードキャストすることは一般的です。もちろん、これは、Eloquentモデルの状態変化に対するカスタムイベントを手動で定義し、それらのイベントにShouldBroadcastインターフェースをマークすることで簡単に実現できます。

しかし、アプリケーションでこれらのイベントを他の目的で使用していない場合、ブロードキャストするためだけにイベントクラスを作成するのは面倒な場合があります。これを解決するために、LaravelではEloquentモデルがその状態変化を自動的にブロードキャストすることを示すことができます。

まず、EloquentモデルはIlluminate\Database\Eloquent\BroadcastsEventsトレイトを使用する必要があります。さらに、モデルはbroadcastOnメソッドを定義する必要があり、これはモデルのイベントがブロードキャストされるべきチャンネルの配列を返します。

1<?php
2 
3namespace App\Models;
4 
5use Illuminate\Broadcasting\Channel;
6use Illuminate\Broadcasting\PrivateChannel;
7use Illuminate\Database\Eloquent\BroadcastsEvents;
8use Illuminate\Database\Eloquent\Factories\HasFactory;
9use Illuminate\Database\Eloquent\Model;
10use Illuminate\Database\Eloquent\Relations\BelongsTo;
11 
12class Post extends Model
13{
14 use BroadcastsEvents, HasFactory;
15 
16 /**
17 * Get the user that the post belongs to.
18 */
19 public function user(): BelongsTo
20 {
21 return $this->belongsTo(User::class);
22 }
23 
24 /**
25 * Get the channels that model events should broadcast on.
26 *
27 * @return array<int, \Illuminate\Broadcasting\Channel|\Illuminate\Database\Eloquent\Model>
28 */
29 public function broadcastOn(string $event): array
30 {
31 return [$this, $this->user];
32 }
33}

モデルがこのトレイトを含み、ブロードキャストチャンネルを定義すると、モデルインスタンスが作成、更新、削除、ごみ箱移動、または復元されたときに自動的にイベントのブロードキャストを開始します。

さらに、broadcastOnメソッドが文字列の$event引数を受け取っていることにお気づきかもしれません。この引数には、モデルで発生したイベントの種類が含まれ、createdupdateddeletedtrashed、またはrestoredの値になります。この変数の値を調べることで、特定のイベントに対してモデルがどのチャンネルにブロードキャストすべきか(もしあれば)を判断できます。

1/**
2 * Get the channels that model events should broadcast on.
3 *
4 * @return array<string, array<int, \Illuminate\Broadcasting\Channel|\Illuminate\Database\Eloquent\Model>>
5 */
6public function broadcastOn(string $event): array
7{
8 return match ($event) {
9 'deleted' => [],
10 default => [$this, $this->user],
11 };
12}

モデルブロードキャストイベント作成のカスタマイズ

時々、Laravelが基礎となるモデルブロードキャストイベントを作成する方法をカスタマイズしたい場合があります。これは、EloquentモデルにnewBroadcastableEventメソッドを定義することで実現できます。このメソッドは、Illuminate\Database\Eloquent\BroadcastableModelEventOccurredインスタンスを返す必要があります。

1use Illuminate\Database\Eloquent\BroadcastableModelEventOccurred;
2 
3/**
4 * Create a new broadcastable model event for the model.
5 */
6protected function newBroadcastableEvent(string $event): BroadcastableModelEventOccurred
7{
8 return (new BroadcastableModelEventOccurred(
9 $this, $event
10 ))->dontBroadcastToCurrentUser();
11}

モデルブロードキャストの規約

チャンネル規約

お気づきかもしれませんが、上記のモデル例のbroadcastOnメソッドはChannelインスタンスを返しませんでした。代わりに、Eloquentモデルが直接返されました。EloquentモデルインスタンスがモデルのbroadcastOnメソッドによって返される(またはメソッドによって返される配列に含まれる)場合、Laravelはモデルのクラス名と主キー識別子をチャンネル名として使用して、モデルのプライベートチャンネルインスタンスを自動的にインスタンス化します。

したがって、id1App\Models\Userモデルは、名前がApp.Models.User.1Illuminate\Broadcasting\PrivateChannelインスタンスに変換されます。もちろん、モデルのbroadcastOnメソッドからEloquentモデルインスタンスを返すことに加えて、完全なChannelインスタンスを返すことで、モデルのチャンネル名を完全に制御できます。

1use Illuminate\Broadcasting\PrivateChannel;
2 
3/**
4 * Get the channels that model events should broadcast on.
5 *
6 * @return array<int, \Illuminate\Broadcasting\Channel>
7 */
8public function broadcastOn(string $event): array
9{
10 return [
11 new PrivateChannel('user.'.$this->id)
12 ];
13}

モデルのbroadcastOnメソッドから明示的にチャンネルインスタンスを返す予定がある場合は、Eloquentモデルインスタンスをチャンネルのコンストラクタに渡すことができます。そうすると、Laravelは上記で説明したモデルチャンネル規約を使用して、Eloquentモデルをチャンネル名文字列に変換します。

1return [new Channel($this->user)];

モデルのチャンネル名を決定する必要がある場合は、任意のモデルインスタンスでbroadcastChannelメソッドを呼び出すことができます。たとえば、このメソッドは、id1App\Models\Userモデルに対して文字列App.Models.User.1を返します。

1$user->broadcastChannel()

イベント規約

モデルブロードキャストイベントは、アプリケーションのApp\Eventsディレクトリ内の「実際の」イベントに関連付けられていないため、規約に基づいて名前とペイロードが割り当てられます。Laravelの規約では、モデルのクラス名(名前空間を含まない)と、ブロードキャストをトリガーしたモデルイベントの名前を使用してイベントをブロードキャストします。

したがって、たとえば、App\Models\Postモデルの更新は、クライアントサイドアプリケーションにPostUpdatedとしてイベントをブロードキャストし、次のペイロードを送信します。

1{
2 "model": {
3 "id": 1,
4 "title": "My first post"
5 ...
6 },
7 ...
8 "socket": "someSocketId",
9}

App\Models\Userモデルの削除は、UserDeletedという名前のイベントをブロードキャストします。

必要に応じて、モデルにbroadcastAsおよびbroadcastWithメソッドを追加することで、カスタムのブロードキャスト名とペイロードを定義できます。これらのメソッドは、発生しているモデルイベント/操作の名前を受け取り、各モデル操作のイベントの名前とペイロードをカスタマイズできます。broadcastAsメソッドからnullが返された場合、Laravelはイベントをブロードキャストするときに上記で説明したモデルブロードキャストイベント名規約を使用します。

1/**
2 * The model event's broadcast name.
3 */
4public function broadcastAs(string $event): string|null
5{
6 return match ($event) {
7 'created' => 'post.created',
8 default => null,
9 };
10}
11 
12/**
13 * Get the data to broadcast for the model.
14 *
15 * @return array<string, mixed>
16 */
17public function broadcastWith(string $event): array
18{
19 return match ($event) {
20 'created' => ['title' => $this->title],
21 default => ['model' => $this],
22 };
23}

モデルブロードキャストのリッスン

モデルにBroadcastsEventsトレイトを追加し、モデルのbroadcastOnメソッドを定義したら、クライアントサイドアプリケーション内でブロードキャストされたモデルイベントのリッスンを開始する準備ができました。開始する前に、イベントのリッスンに関する完全なドキュメントを参照することをお勧めします。

まず、privateメソッドを使用してチャンネルのインスタンスを取得し、次にlistenメソッドを呼び出して指定されたイベントをリッスンします。通常、privateメソッドに与えられるチャンネル名は、Laravelのモデルブロードキャスト規約に対応する必要があります。

チャンネルインスタンスを取得したら、listenメソッドを使用して特定のイベントをリッスンできます。モデルブロードキャストイベントは、アプリケーションのApp\Eventsディレクトリ内の「実際の」イベントに関連付けられていないため、イベント名の前に.を付けて、特定の名前空間に属していないことを示す必要があります。各モデルブロードキャストイベントには、モデルのすべてのブロードキャスト可能なプロパティを含むmodelプロパティがあります。

1Echo.private(`App.Models.User.${this.user.id}`)
2 .listen('.PostUpdated', (e) => {
3 console.log(e.model);
4 });

クライアントイベント

Pusher Channelsを使用する場合、クライアントイベントを送信するには、アプリケーションダッシュボードの「App Settings」セクションで「Client Events」オプションを有効にする必要があります。

Laravelアプリケーションにまったくヒットせずに、他の接続されたクライアントにイベントをブロードキャストしたい場合があります。これは、「タイピング中」の通知など、アプリケーションのユーザーに別のユーザーが特定の画面でメッセージを入力していることを警告したい場合に特に役立ちます。

クライアントイベントをブロードキャストするには、Echoのwhisperメソッドを使用できます。

1Echo.private(`chat.${roomId}`)
2 .whisper('typing', {
3 name: this.user.name
4 });

クライアントイベントをリッスンするには、listenForWhisperメソッドを使用できます。

1Echo.private(`chat.${roomId}`)
2 .listenForWhisper('typing', (e) => {
3 console.log(e.name);
4 });

通知

イベントブロードキャストを通知と組み合わせることで、JavaScriptアプリケーションはページを更新する必要なく、新しい通知が発生したときに受信できます。開始する前に、ブロードキャスト通知チャンネルの使用に関するドキュメントを必ず読んでください。

通知がブロードキャストチャンネルを使用するように設定したら、Echoのnotificationメソッドを使用してブロードキャストイベントをリッスンできます。チャンネル名は、通知を受信するエンティティのクラス名と一致する必要があることを忘れないでください。

1Echo.private(`App.Models.User.${userId}`)
2 .notification((notification) => {
3 console.log(notification.type);
4 });

この例では、broadcastチャンネルを介してApp\Models\Userインスタンスに送信されたすべての通知がコールバックによって受信されます。App.Models.User.{id}チャンネルのチャンネル認可コールバックは、アプリケーションのroutes/channels.phpファイルに含まれています。

Laravelは最も生産的な方法です
ソフトウェアを構築、デプロイ、監視します。