CODEWITHSUNDEEP
phplaravelsocketswebsocketlaravel-echo
Jenssen
Jenssen

Reputation: 1881

Laravel laravel-echo-server not receiving messages (chat)

I'm trying to setup laravel-echo-server but I can't get it to work. With the same setup (I use Vue.js) it's working with pusher. I have build a chat.

My laravel-echo-server.json looks like this:

{
    "authHost": "https://sayhidog.test",
    "authEndpoint": "/broadcasting/auth",
    "clients": [],
    "database": "redis",
    "databaseConfig": {
        "redis": {},
        "sqlite": {}
    },
    "devMode": true,
    "host": null,
    "port": "6001",
    "protocol": "https",
    "socketio": {},
    "secureOptions": 67108864,
    "sslCertPath": "/Users/lars/.config/valet/Certificates/sayhidog.test.crt",
    "sslKeyPath": "/Users/lars/.config/valet/Certificates/sayhidog.test.key",
    "sslCertChainPath": "",
    "sslPassphrase": "",
    "subscribers": {
        "http": true,
        "redis": true
    },
    "apiOriginAllow": {
        "allowCors": false,
        "allowOrigin": "",
        "allowMethods": "",
        "allowHeaders": ""
    }
}

When I run laravel-echo-server start I see:

enter image description here

This looks great, when I send a message I see:

enter image description here

In vue.js I connect like this:

window.io = require('socket.io-client');

    if (typeof io !== 'undefined') {
        window.Echo = new Echo({
            broadcaster: 'socket.io',
            host: window.location.hostname + ':6001',
        });
    }

And I listen like this:

window.Echo.private('chat')
    .listen('MessageSent', (e) => {
        this.messages.push({
            body: e.message.body,
            user: e.user
        });
    });

My channels.php looks like this:

Broadcast::channel('chat', function ($user) {
    return true;
});

In my Controller I broadcast:

broadcast(new MessageSent($user, $message))->toOthers();

The MessageSent looks like this:

class MessageSent implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;
/**
 * User that sent the message
 *
 * @var User
 */
public $user;

/**
 * Message details
 *
 * @var ChatMessage
 */
public $message;

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

/**
 * Get the channels the event should broadcast on.
 *
 * @return Channel|array
 */
public function broadcastOn()
{
    return new PrivateChannel('chat');
}

}

The connection in my network tab looks fine:

enter image description here

I don't get any new messages in my chat. With pusher it's working. What could I be doing wrong here? Thanks!

Upvotes: 3

Views: 3979

Answers (3)

saswanb
saswanb

Reputation: 1985

Check your package.json to make sure you have installed socket.io-client version 2.3.0. Currently (Jan 2021) version 3.0 will not work, as I have spent many hours discovering.

Upvotes: 1

Adam Dyderski
Adam Dyderski

Reputation: 21

Try add this line in .env file, this solved my problem:

REDIS_PREFIX=

Why laravel broadcast channel has a prefix? #28210

Upvotes: 2

Ahmed Atoui
Ahmed Atoui

Reputation: 1556

First define method on your MessageSent channel named broadcastAs and it return custom name like this:

public function broadcastAs()
{
    return 'message.sent';
}

then listen to this event with custom name you have choose and prepend with dot (.) like this:

window.Echo.private('chat')
    .listen('.message.sent', (e) => {
        this.messages.push({
            body: e.message.body,
            user: e.user
        });
    });

Upvotes: 2

Related Questions