laravel7.0의 브로드캐스트 메커니즘에 대해 이야기해 보겠습니다. 원하는 것은 항상 있습니다!

laravel7.0 브로드캐스트 메커니즘(Redis + 소켓.io)

브로드캐스트 서비스 제공자

이벤트를 브로드캐스팅하기 전에 먼저 AppProvidersBroadcastServiceProvider를 등록해야 합니다. . 새로 설치된 Laravel 애플리케이션에서는 config/app.php 구성 파일을 선택 취소하면 됩니다. 제공자에서 해당 서비스 제공자 앞에 있는 주석 코드> 배열이면 충분합니다. 이 공급자를 사용하면 브로드캐스트 인증 경로 및 콜백을 등록할 수 있습니다.AppProvidersBroadcastServiceProvider。在新安装的 Laravel 应用中，你只需要取消 config/app.php 配置文件中 providers 数组内对应服务提供者之前的注释即可。该提供者允许你注册广播授权路由和回调

相关栏目教程推荐：《laravel教程》

设置 Redis 连接

需要修改 .env 文件中的广播驱动为 redis：

BROADCAST_DRIVER=redis

建立 Event

php artisan make:event OrderShipped

执行上诉命令之后 app 目录下会出现一个 Events 目录，在该目录下产生了广播事件类 OrderShipped.php。我们要对自动生成的 OrderShipped 类进行以下修改

• 增加对 ShouldBroadcast 的实现

• 修改 broadcastOn 方法，使用公共广播通道 orderStatus

• 自定义广播的消息名(非必须)【默认情况下，Laravel 会使用事件的类名来广播事件，不过，你可以通过在事件中定义 broadcastAs 方法来自定义广播名称：】

• 修改构造函数

完整修改如下 可直接替换

<?php
namespace App\Events;
use Illuminate\Broadcasting\Channel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Queue\SerializesModels;
class OrderShipped implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;
    //可添加任意成员变量
    public $id;
    //事件构造函数
    public function __construct($id)
    {
        $this->id = $id;
    }
    //自定义广播的消息名
    public function broadcastAs()
    {
        return &#39;anyName&#39;;
    }
    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        return new Channel(&#39;orderStatus&#39;);
    }
}

设置 api 路由

Route::get('/ship', function (Request $request) {
    $id = $request->input('id');
    broadcast(new OrderShipped($id)); // 触发事件
    return 'Order Shipped!';
});

安装前端脚手架

composer require laravel/uiphp artisan ui vue --auth

Redis

因为咱们使用 Redis 广播，需要安装 Predis 库：

composer require predis/predis

Redis 广播使用 Redis 的 pub/sub 功能进行广播；不过，你需要将其和能够接受 Redis 消息的 Websocket 服务器进行配对以便将消息广播到 Websocket 频道

当 Redis 广播发布事件时，事件将会被发布到指定的频道上，传递的数据是一个 JSON 格式的字符串，其中包含了事件名称、负载数据 data、以及生成事件 socket ID 的用户

安装 laravel-echo-server 订阅 Redis Sub

如果使用 pusher 那么直接使只用 laravel 就可以了，如果使用 Redis + socket.io 则需要使用开源项目 laravel-echo-server 。所以我们现在要使用 laravel-echo-server

全局安装

npm install -g laravel-echo-server

初始化 laravel-echo-server

laravel-echo-server init

// 是否在开发模式下运行此服务器（y/n） 输入y
? Do you want to run this server in development mode? (y/N)// 设置服务器的端口 默认 6001 输入 6001就可以了 或者你想要的
? Which port would you like to serve from? (6001)// 想用的数据库  选择 redis
? Which database would you like to use to store presence channel members? (Use arrow keys)❯ redis
  sqlite

//   这里输入 你的laravel  项目的访问域名
? Enter the host of your Laravel authentication server. (http://localhost)// 选择 网络协议 http
? Will you be serving on http or https? (Use arrow keys)❯ http
  https

// 您想为HTTP API生成客户端ID/密钥吗 N
? Do you want to generate a client ID/Key for HTTP API? (y/N)// 要设置对API的跨域访问吗？（y/n）N
Configuration file saved. Run laravel-echo-server start to run server.

//您希望将此配置另存为什么？ （laravel-echo-server.json）回车就行
? What do you want this config to be saved as? (laravel-echo-server.json)

启动 laravel-echo-server

laravel-echo-server start

• 成功启动后会输出以下日志

L A R A V E L  E C H O  S E R V E R

version 1.6.0

⚠ Starting server in DEV mode...

✔  Running at localhost on port 6001
✔  Channels are ready.
✔  Listening for http events...
✔  Listening for redis events...

Server ready!

测试广播

在浏览器上执行 http://yourhost/api/ship?id=16

Channel: laravel_database_orderStatus
Event: anyName

• laravel-echo-server 连接成功！

安装 laravel-echo 的前依赖

由于前端使用的是 laravel-echo来收听广播，我们选择的底层实现方式是socket.io。所以首先我们要在package.json中添加 laravel-echo 和 socket.io

관련 열의 권장 튜토리얼: "

laravel 튜토리얼

》

Redis 연결 설정

.env 파일에서 브로드캐스트 드라이버를 수정해야 합니다. redis:

npm i --save socket.io-client
npm i --save laravel-echo

Create Event🎜🎜🎜

import Echo from "laravel-echo";
window.io = require("socket.io-client");
window.Echo = new Echo({    
broadcaster: "socket.io",    
host: window.location.hostname + ":6001"
});

🎜🎜🎜appeal 명령을 실행한 후 Events 디렉터리가 앱 디렉터리에 나타납니다. 방송 이벤트 클래스 OrderShipped.php가 이 디렉터리에 생성됩니다. 자동으로 생성된 OrderShipped 클래스를 다음과 같이 수정해야 합니다🎜

• 🎜 ShouldBroadcast 구현 추가🎜
• 🎜broadcastOn 메소드를 수정하고 공개 방송 채널 orderStatus를 사용하세요🎜
• 🎜방송의 메시지 이름을 사용자 정의합니다. (🎜필요하지 않습니다🎜) [기본적으로 Laravel은 이벤트의 클래스 이름을 사용하여 이벤트를 방송하지만, event:]🎜
• 🎜생성자 수정🎜

🎜전체 수정은 다음과 같으며 직접 교체 가능합니다🎜

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="">
    <title>News Room</title>
    <link href="" rel="stylesheet">
</head>

<body>
    <div class="content">
        News Room
    </div>
    <script src=""></script>
    <script>
        Echo.channel("laravel_database_orderStatus") // 广播频道名称
    .listen(".anyName", e => {
        // 消息名称
        console.log(e); // 收到消息进行的操作，参数 e 为所携带的数据
    });
    </script>
</body>

</html>

API 라우팅 설정🎜

npm install && npm run watch

프론트엔드 스캐폴딩 설치🎜🎜🎜rrreee🎜🎜

Redis🎜🎜우리는 Redis 브로드캐스트를 사용하기 때문에 Predis를 설치해야 합니다. 라이브러리: 🎜🎜🎜rrreee🎜🎜

🎜Redis 브로드캐스트는 Redis pub/sub 기능을 사용하여 브로드캐스트합니다. 그러나 메시지를 Websocket 채널에 브로드캐스트하려면 Redis 메시지를 수용할 수 있는 Websocket 서버와 페어링해야 합니다.🎜

🎜Redis가 이벤트를 브로드캐스트하면 이벤트가 지정된 채널에 게시되고 전달된 데이터는 이벤트 이름, 페이로드 데이터 및 이벤트 소켓 ID를 생성한 사용자가 포함된 JSON 형식 문자열입니다. 🎜

laravel 설치 -echo-server Redis Sub 구독🎜🎜 pusher를 사용하는 경우에는 laravel을 사용하세요. 🎜Redis +socket.io🎜를 사용하는 경우에는 오픈소스 프로젝트 laravel-echo-server . 이제 laravel-echo-server🎜🎜전역 설치🎜🎜🎜rrreee🎜🎜

를 사용하여 laravel을 초기화하겠습니다. -echo- server🎜

🎜rrreee🎜🎜

laravel-echo-server🎜🎜🎜rrreee🎜🎜

• 시작합니다. 성공적인 시작 후 출력 다음 로그

rrreee

테스트 방송 🎜🎜브라우저에서 실행http://yourhost /api/ship ?id=16🎜🎜🎜rrreee🎜🎜

• laravel-echo-server 연결에 성공했습니다!

laravel-echo의 종속성을 설치합니다. 🎜🎜프런트 엔드는 laravel-echo를 사용하므로 > 라디오를 듣기 위해 우리가 선택한 기본 구현은 socket.io입니다. 따라서 먼저 package.json에 laravel-echo 및 를 추가해야 합니다. > class="언어-plaintext 하이라이트-루즈">socket.io의 종속성🎜🎜🎜rrreee🎜🎜🎜resource/js/bootstrap.js를 편집하고 다음 코드를 추가하세요🎜🎜🎜rrreee🎜🎜

测试页面

在 resources/views/ 下建立页面 test.blade.php 内容为

<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="">
    <title>News Room</title>
    <link href="" rel="stylesheet">
</head>

<body>
    <div class="content">
        News Room
    </div>
    <script src=""></script>
    <script>
        Echo.channel("laravel_database_orderStatus") // 广播频道名称
    .listen(".anyName", e => {
        // 消息名称
        console.log(e); // 收到消息进行的操作，参数 e 为所携带的数据
    });
    </script>
</body>

</html>

js 代码的意思是收听 news 通道内的 News 事件对象，将接收到的事件在控制台打印出来。

基本构建

npm install && npm run watch

相关推荐：最新的五个Laravel视频教程