Laravel-echo-server がリアルタイム アプリケーションを構築する方法の詳細な説明

青灯夜游
リリース: 2022-02-11 19:40:55
転載
3424 人が閲覧しました

Laravel の次のチュートリアル コラムでは、Laravel-echo-server を使用してリアルタイム アプリケーションを構築する方法を紹介します。

Laravel-echo-server がリアルタイム アプリケーションを構築する方法の詳細な説明

私の意見では、リアルタイム通信は APP アプリケーションの未来です。通常、ソケット サービスの実装は簡単ではありませんが、Laravel Echo サービスはこの状況を変えます。

この記事では、実行中の Socket サービスを作成し、このサービス上でイベントをブロードキャストする方法を簡単に紹介します。 (https://github.com/tlaverdure/laravel-echo-server、Laravel サポートドキュメント: https://learnku.com/docs/laravel/5.6/broadcasting#driver-prerequisites)

これは、です。完全に無料で、独自の Socket サービスを実行するだけで済みます。 Laravel のデフォルトで統合された Pusher を使用することもできますが、唯一の欠点は、制限があり、制限を超えると料金を支払う必要があることです。私はこれらのものを自分で構築することを好みます。

要件:

    Laravel フレームワーク (このチュートリアルではバージョン 5.6 を使用します)
  • Redis サービス
  • Laravel の基本知識

##laravel-echo-server をインストールするまず、laravel-echo-server をグローバルにインストールする必要があります。ターミナルに次のコマンドを入力するだけです。

 $ npm install -g laravel-echo-server
ログイン後にコピー

インストールが完了したら、Laravel アプリケーションを開くか、新しいテスト プロジェクトを開始します:

 $ composer create-project --prefer-dist laravel/laravel echo-test
ログイン後にコピー

次に、アプリケーション用に Predis をインストールします:

 $ composer require predis/predis
ログイン後にコピー

インストール後が完了したら、プロジェクトのルート ディレクトリに切り替え、ソケット サービスを初期化します:

 $ laravel-echo-server init
ログイン後にコピー

このコマンドを実行すると、ソケット サービスに関する構成情報の入力を求められます。独自の情報に従って入力できます。状況:

Laravel-echo-server がリアルタイム アプリケーションを構築する方法の詳細な説明

運用環境では、開発者モードを使用するときは常に開発者モードをオフにする必要があることに注意してください。

サービスを開始して、正常に実行されているかどうかを確認してみましょう:

$ laravel-echo-server start
ログイン後にコピー

出力は次のようになります:

Laravel-echo-server がリアルタイム アプリケーションを構築する方法の詳細な説明

Laravel Echo Server が適切に動作するように Laravel を設定します

config/app.php

ファイルを開き、BroadcastServiceProvider をキャンセルします この Providers 配列のコメント:

App\Providers\BroadcastServiceProvider::class,

このプロバイダーはブロードキャスト ルーティングを開始します (すでに
Routes/channels.php

ファイル内にすでに表示されています)

.env

ファイルを開き、BROADCAST_DRIVER の値を laravel の値に変更します。 echo-server 初期化中に定義された値 (Redis または Log)。このチュートリアルでは、Redis ドライバーを使用します。 また、QUEUE_DRIVER
を任意のキュー ドライバーに変更します。この例では、以前にインストールして実行しているため、Redis ドライバーに簡単に変更できます。 次に、Socket.io クライアントと Laravel-Echo パッケージをインストールする必要があります。次の手順でインストールできます:

$ npm install --save socket.io-client
$ npm install --save laravel-echo
ログイン後にコピー

(これを実行する前に

npm を実行する必要がある場合があります) install

して Laravel と関連する依存関係をインストールします)次に、

resources/assets/js/bootstrap.js

ファイル、またはすべての JS 基本コードを導入する独自の JS ファイルを開きます。 ここで、Echo 基本サービスを開始するコードを追加する必要があります:

import Echo from 'laravel-echo'

window.io = require('socket.io-client');
window.Echo = new Echo({
    broadcaster: 'socket.io',
    host: window.location.hostname + ':6001'
});
ログイン後にコピー

これで、チャネル上のメッセージをリッスンする準備が整いました。このチュートリアルでは、チャネルを開く方法を説明し、最初のチャネルのリスニングを開始します。

window.Echo.channel('test-event')
    .listen('ExampleEvent', (e) => {
        console.log(e);
    });
ログイン後にコピー

JS コードを通じてプログラムに、「test-event」という名前のチャネルにサブスクライブすることを伝え、リッスンします。これに「ExampleEvent」イベントを追加します (これはイベントのクラス名であり、必要に応じてカスタマイズすることもできます)。

このイベント クラスを作成しましょう:

$ php artisan make:event ExampleEvent
ログイン後にコピー

これにより、

ExampleEvent.php

という名前のイベント クラスが App/Events ディレクトリ に作成されます。このイベント クラスを少し調整して、Socket サービスで正常に実行できるようにします。まず、イベント クラスが次のように ShouldBroadcast
インターフェイスから継承されていることを確認します。

class ExampleEvent は ShouldBroadcast

次に下にスクロールして
broadcastOn

関数を見つけ、正しいチャネルでブロードキャストできるように変更します。 <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">public function broadcastOn() {     return new Channel('test-event'); }</pre><div class="contentsignin">ログイン後にコピー</div></div>新しい関数を作成しましょうインスタンス データを取得できるように、以下の関数を使用します。

public function broadcastWith()
{
    return [
        'data' => 'key'
    ];
}
ログイン後にコピー

この関数は、イベントが呼び出されたときに呼び出され、データを Socket サービスに返します。

さあ、試してみましょう!

routes/web.php

ファイルを開き、テスト ルートを追加します: <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">Route::get('test-broadcast', function(){     broadcast(new \App\Events\ExampleEvent); });</pre><div class="contentsignin">ログイン後にコピー</div></div> <p>(有很多种方式来广播 <code>ExampleEvent  类 ,在这个示例中我使用 Laravel 提供的 broadcast() 助手,在我看来这是最简洁的方式)

启动队列监听:

$ php artisan queue:listen --tries=1
ログイン後にコピー

浏览器打开一个包含 JS 文件的页面(可以是 Laravel 默认的欢迎页面),这是第一个页面,请不要关闭次页面,我们已经在此页面上订阅了 Socket 服务。

接下来打开另一个页面访问  /test-broadcast ,这将会返回一个空白页面,但是它将会通过你的 ExampleEvent  类广播到你的 Socket 服务上。返回到我们的第一个页面,打开浏览器控制台,应该可以看到类似信息:

Laravel-echo-server がリアルタイム アプリケーションを構築する方法の詳細な説明

正如你所看到的,数据通过这种形式展示在我们的客户端。你能输入任意数据通过你的  ExampleEvent 类来广播他们,这些数据可以是新闻更新,页面更新,总浏览量或者更多。

因为我们有在 laravel-echo-server 配置中有设置开发者模式,所以你能看到 Socket 服务上的所有基本信息:

Laravel-echo-server がリアルタイム アプリケーションを構築する方法の詳細な説明

现在你已经安装并运行了一个基本的 Socket 服务!但这并不是全部,你可以根据这个来做更多的事情,比如为单个用户提供认证的私有渠道。(当您想广播订单更新或私人消息时)

要做到这一点,我建议你去查看 Laravel 文档了解更多相关的内容。通过这个主题你能做很多事情,让你的应用程序变得更加神奇。你可以在这里找到相应的文档:

Broadcasting - Laravel - The PHP framework for web artisans.laravel.com

其他: 在生产环境中运行

正如我之前所说,你必须在 laravel-echo-server.json 配置文件中禁用开发者模式。 当然在服务器上你可以忽略这个文件,重新初始化它,因为你的主机可能和本地不同。

你还需要保持你的 Socket 服务在你的生产环境中运行,你可以用 Supervisor ,但是我通常使用 PM2  ,它可以方便快速的管理你的服务。 (http://pm2.keymetrics.io/)

这里是我使用 PM2 的 Socket.sh 基本配置:

#!/usr/bin/env bash

laravel-echo-server  start
ログイン後にコピー

安装了 PM2 后, 你可以通过 pm2 start socket.sh 命令来启动脚本,运行你的 Socket 服务。

我希望它能够帮助到你。 这篇文章主要介绍的是一些基础知识,接下来我们会继续讨论广播路由的授权和不同的广播频道。

感谢你的阅读!

英文原文地址:https://medium.com/@dennissmink/laravel-echo-server-how-to-24d5778ece8b

译文地址:https://learnku.com/laravel/t/13101/using-laravel-echo-server-to-build-real-time-applications

更多编程相关知识,请访问:编程视频!!

以上がLaravel-echo-server がリアルタイム アプリケーションを構築する方法の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:learnku.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート