Laravel Echo not listening only on private channel

Question

I'm trying to listen on a private channel with Laravel Echo, but it does not listen on private channel only, public channel works fine.

I'm also using beyondcode/Laravel-Websockets package, and it shows me in the websockets dashboard panel, all the connections and event made. It shows al the private connections made by the package itself, my public connections and all the events triggered (private and public), but it does not show me my private connections

The event if fired and the data is saved in the database, all works totally fine except that in the view, I'm not receiven any data from the private event triggered

I tried downgrading my Laravel Echo version, to version "^1.3.2", when the predefined was "^1.5.4"

This is my laravel event wich broadcast on a private channel

<?php

namespace App\Events;

use Illuminate\Contracts\Broadcasting\ShouldBroadcastNow;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;

class NuevoGasto implements ShouldBroadcastNow
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    public $gasto;

    public function __construct($gasto)
    {
        $this->gasto = $gasto;
    }

    public function broadcastOn()
    {
        return new PrivateChannel('nuevo-gasto-channel');
    }
}

Note I'm using ShouldBroadcastNow trait, so I don't need to use a queue

This is my bootstrap.js file wich have my Laravel Echo configuration

import Echo from 'laravel-echo'

window.Pusher = require('pusher-js');

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    wsHost: window.location.hostname,
    wsPort: 6001,
    disableStats: true,
});

This is my routes/channels.php file

Broadcast::channel('nuevo-gasto-channel', function ($user) {
    return true;
});

Note I'm returning true for demo purposes

This is my view file when I listen for a NuevoGasto event, on nuevo-gasto-channel

Echo.private('nuevo-gasto-channel')
    .listen('NuevoGasto', (e) => {
            console.log(e);
});

And finally this is my Controller, where I trigger the event

...

broadcast(new NuevoGasto($gasto))->toOthers();

...

I'm not getting any errors, it's just no listening on the private channel

Answer 1

Try uncommenting App\Providers\BroadcastServiceProvider::class in your config/app.php, if you haven't already.

Answer 2

Add a dot in the event "NuevoGasto"

It should be like this:

enter code here Echo.private('nuevo-gasto-channel')
.listen('.NuevoGasto', (e) => {
        console.log(e);
});

Answer 3

Only To Others

As mentioned here in Laravel Documentation. Doc

You are using only to others which means that it will not send events to your current user.

Try using Direct event dispatch as mentioned here Doc

---

And please keep in mind the following things regarding broadcast name and namespace as well.

Broadcast Name

As mentioned here in Laravel documentation. Doc

By default, Laravel will broadcast the event using the event's class name. However, you may customize the broadcast name by defining a broadcastAs method on the event:

/**
 * The event's broadcast name.
 *
 * @return string
 */

public function broadcastAs()
{
    return 'server.created';
}

If you customize the broadcast name using the broadcastAs method, you should make sure to register your listener with a leading . character.

This will instruct Echo to not prepend the application's namespace to the event:

.listen('.server.created', function (e) {
    ....
});

Namespaces

As mentioned here you can also use namespace Doc

You may have noticed in the examples above that we did not specify the full App\Events namespace for the event classes. This is because Echo will automatically assume the events are located in the App\Events namespace. However, you may configure the root namespace when you instantiate Echo by passing a namespace configuration option:

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

Alternatively, you may prefix event classes with a . when subscribing to them using Echo. This will allow you to always specify the fully-qualified class name:

Echo.channel('orders')
    .listen('.Namespace\\Event\\Class', (e) => {
        //
    })