Laravel 使用 Socket.io 广播到私人频道

Question

我正在尝试创建一个 real-time 通知系统，使用 Laravel 作为后端 API 客户端和一个 SPA 作为我的前端，我使用 React 作为前端，但是对于下面的示例我将使用我创建的简单 Vue.Js 和 blade 以获得一个工作示例。

所以，总而言之，我有一个触发事件的路由，如下例所示：

Route::get('fire', function () {
    // this fires the event
    $user = App\Models\User::find(1);
    event(new App\Events\CampaignUploadedWithSuccess($user, 'testing a notification'));
    return "event fired";
});

它触发的事件将如下所示

<?php

namespace App\Events;

use Illuminate\Broadcasting\Channel;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;

class CampaignUploadedWithSuccess implements ShouldBroadcast
{
    protected $user;

    public $notification;

    use Dispatchable, InteractsWithSockets, SerializesModels;

    /**
     * Create a new event instance.
     *
     * @param $user
     * @param $notification
     */
    public function __construct($user, $notification)
    {
        $this->user = $user;
        $this->notification = $notification;
    }

    /**
     * Get the channels the event should broadcast on.
     *
     * @return Channel|array
     */
    public function broadcastOn()
    {
        return ['notifications-channel.' . $this->user->id];
    }
}

所以我在一个名为 notification-channel.{userId}

的频道上广播

然后我有一个 socket.js 文件，我运行使用节点。

看起来像这样

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var Redis = require('ioredis');

var redis = new Redis();
redis.subscribe('notifications-channel.1', function(err, count) {
});
redis.on('message', function(channel, message) {
    console.log('Notification Recieved: ' + message);
    message = JSON.parse(message);
    io.emit(channel + ':' + message.event, message.data);
});
http.listen(3000, function(){
    console.log('Listening on Port 3000');
});

使用 node socket.js 运行s 服务器并触发事件，如下所示：

快乐的日子！我正在向频道广播..

但是，我现在有一个名为 test.blade 的 blade 文件，它将引入 Vue 和 Socket.io

看起来像这样

<!DOCTYPE html>
<html>
<head>
    <title>Laravel</title>
</head>
<body>
<h1>Notifications</h1>

<ul>
    <li v-repeat="notification: notifications">@{{ notifications }}</li>
</ul>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/0.12.16/vue.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.7/socket.io.min.js"></script>

<script>
    var socket = io('http://localhost:3000');
    new Vue({
        el: 'body',
        data: {
            notifications: []
        },
        ready: function() {
            socket.on('notifications-channel.1', function(data) {
                alert(data.notification);
            });
        }
    });
</script>
</body>
</html>

这里的目标是在 notification-channel.1 有数据广播给它时发出消息警报。然而这不起作用。

所以我的问题是，如何使用 socket.io、Laravel 和 Redis.

向频道广播并使用来自频道的广播

我也对私人频道以及如何仅为一个用户创建频道一无所知。文档很好，但它没有提供真实世界的示例来说明如何实现这一点以及如何让多个平台使用通知。

Answer 1

我认为你错过了 io 的设置

https://socket.io/docs/server-api/

你的 nodejs 服务器和/或客户端需要这样的东西。

io.on('connect', onConnect);

function onConnect(socket){
   socket.emit(channel + ':' + message.event, message.data);
}

希望对您有所帮助

Answer 2

我也遇到了同样的问题，搜索后发现是socket版本问题。请确保您在服务器端和客户端都使用了相同的 socket.io 版本，您可以通过首先检查 package.json 文件中的套接字版本来验证这一点，就像我的情况一样，您可以在下面看到

"devDependencies": {
    "socket.io": "^2.0.3",
    "socket.io-client": "^2.0.3",
 }

然后验证您 test.blade 文件中的套接字版本，如下所示

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script>

你可以看到这两个是相同的版本。

并且您的 blade 文件中存在一个问题，您通过键 channel:event.name 发出套接字事件，但是在您的 blade 文件中，您只能监听通道名称而无需连接事件名称。请用下面的代码替换它

<script>
    var socket = io('http://localhost:3000');
    new Vue({
        el: 'body',
        data: {
            notifications: []
        },
        ready: function() {
            socket.on('notifications-channel.1:App\Events\CampaignUploadedWithSuccess', function(data) {
                alert(data.notification);
            });
        }
    });
</script>

Laravel 使用 Socket.io 广播到私人频道

Laravel Broadcast to a private channel using Socket.io

sockets

websocket

socket.io

laravel

laravel-5.4