laravel / reverb

Laravel Reverb provides a real-time WebSocket communication backend for Laravel applications.
https://reverb.laravel.com
MIT License
1.05k stars 76 forks source link

Details of members in presence channel #229

Closed Zen0x7 closed 1 month ago

Zen0x7 commented 1 month ago

Reverb Version

v1.0.0

Laravel Version

11.15.0

PHP Version

8.3

Description

When you're trying to implement the presence channel like the following:

window.Echo
        .join(`App`)
        .here((users) => {
            console.log(users);
        })
        .joining((user) => {
            console.log(user.name);
        })
        .leaving((user) => {
            console.log(user.name);
        })
        .error((error) => {
            console.error(error);
        });

Then users, if there are two users connected, will print as [true, true].

image

Digging deeper, by moving window.Echo.join('App') into a const and printing the const into the here context then you'll have the following:

image

So what's the point? channel.subscription.members.members contains an object, key-valued, with the id of the user and a true.

I expect that users in here function contains that data. Basically, the code responsible to bind users param into the callback is doing something unexpected, by design or by failure, which removes those keys. Probably because converts the object channel.subscription.members.members into an array without that keys preservation.

So:

(users) => users.forEach((item, index) => console.log(index, item))

returns

image

By the way, i'm considering using the channel.subscription.members.members as a short-term solution but honestly, sounds weird to use the api of the channel instead of the parameter. I mean, that's why users param exists. LOL

Steps To Reproduce

  1. Start a fresh project
  2. Install reverb
  3. Build an SPA / Use Sanctum for authentication
  4. Implement a presence channel
  5. Use previous code
Zen0x7 commented 1 month ago

Just forget about it. The following code produces the issue:

image

Fixed by:

image