Laravel + Pusher，无法订阅状态频道

如何解决Laravel + Pusher，无法订阅状态频道

我目前正在研究 Laravel 广播

我已经了解了公共频道、私人频道，但是当我尝试学习状态频道时，遇到了一个问题，无法订阅状态频道

举一个简单的例子：我创建了一个简单的基本登录/注销功能，用于检测用户是离开在线频道还是加入他们

// AuthController
public function login(Request $request) {
    $request->validate([
        ...
    ]);

    $user = User ... where ... first;
    
    if ($user && Hash::check($request->password,$user->password)) {
        $user->update(['online' => 1]);

        $token = $user->createtoken(...,['*']);

        ... // Login attempts

        broadcast(new LoginEvent($user))->toOthers();
        
        return Response::json([
            'token' => $token->plainTextToken,'user' => $user
        ]);
    }

    // Fail
}

然后假设我将用户重定向到 /home 路由

// home.vue
<template>
    ...
</template>

<script>
    import { mapGetters } from 'vuex'

    export default {
        ...
        created() {
            Echo.join('room.1')
                .here(users => {
                    console.log(users)
                })
                .joining(user => {
                    console.log(`User: ${user.name} has enter the room`)
                })
                .leaving(user => {
                    console.log(`User: ${user.name} has leave the room`)
                })
        }
    }
</script>

这是我的 bootstrap.js

// resource/js/bootstrap.js
...
...

import Echo from 'laravel-echo'

window.Pusher = require('pusher')

window.Echo = new Echo({
    broadcaster: 'pusher',key: process.env.MIX_PUSHER_APP_KEY,cluster: process.env.MIX_PUSHER_APP_CLUSTER,forceTLS: true,authEndpoint: '/api/broadcasting/auth',auth: { // Ref: // https://laracasts.com/discuss/channels/laravel/how-to-auth-broadcasting-with-airlocksanctum-access-tokens
        headers: {
            'Authorization': `Bearer ${localStorage['token']}`
        }
    }
})


// routes/channels.PHP
...

broadcast::channel('room.{id}',function ($user,$id) {
    // I have read that if we want to allow users to join a presence channel,we must return array or null for not allowing them to join
    return [
        'id' => $user->id,'name' => $user->name
    ];
})

我使用不同的浏览器查看结果，假设 A 登录 Chrome，B 登录 Opera

然后在设置好一切之后，我尝试登录，并检查我的浏览器控制台选项卡， 但它没有显示任何内容，然后我查看 Pusher，只有 connected，但没有订阅

所以我试着把 home.vue 改成：

// home.vue
...

created() {
    var channel = Echo.join('room.1')

    console.log(channel)
}

然后我刷新页面，重新进行身份验证，控制台选项卡只给我 PusherPresenceChannel 对象

我该如何解决这个问题？公共和私人频道都很好，可以处理我的案例，但不是在线频道

抱歉英语不好

提前致谢