Laravel Echo不听事件

Question

我正在Docker容器中运行Laravel，并且尝试使用Laravel Websockets项目来设置websocket：https://docs.beyondco.de/laravel-websockets/在容器中运行php artisan websocket:serve后访问websockets仪表板（http：// localhost：8080 / laravel-websockets）会按预期显示我的api消息：

但是，当我尝试在控制台中监听和console.log这个事件（使用Vue组件）时，它不起作用。这些是我认为相关的代码段：

resources / js / bootstrap.js

import Echo from 'laravel-echo';

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

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: 'local',
    namespace: null,
    encrypted: false,
    disableStats: false,
    wshost: window.location.hostname,
    wsPort: 6001
});

资源/js/components/timeline/AppTimeline.vue

mounted() {
    Echo.private(`timeline.${this.$user.id}`)
                .listen('.TweetWasCreated', (e) => {
                    console.log(e) //I don't see any log on my console
                });

  }

config / broadcasting.php

'connections' => [

        'pusher' => [
            'driver' => 'pusher',
            'key' => env('PUSHER_APP_KEY'),
            'secret' => env('PUSHER_APP_SECRET'),
            'app_id' => env('PUSHER_APP_ID'),
            'options' => [
                'cluster' => env('PUSHER_APP_CLUSTER'),
                'encrypted' => true,
                'host' => '127.0.0.1',
                'port' => 6001,
                'scheme' => 'http'
            ],
        ],

.env

BROADCAST_DRIVER=pusher
PUSHER_APP_ID=local
PUSHER_APP_KEY=local
PUSHER_APP_SECRET=local
PUSHER_APP_CLUSTER=mt1

应用程序/事件/推文/TweetWasCreated.php

<?php

namespace App\Events\Tweets;

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


class TweetWasCreated implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    protected $tweet;

    /**
     * Create a new event instance.
     *
     * @return void
     */
    public function __construct(Tweet $tweet)
    {
        $this->tweet = $tweet;
    }

    public function broadcastAs()
    {
        return 'TweetWasCreated';
    }

    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        return $this->tweet->user->followers->map(function ($user) {
            return new PrivateChannel('timeline.' . $user->id);
        })->toArray();

    }
}

docker-compose.yml

version: "3"

services:
    # nginx
    nginx:
        container_name: ${PROJECT_NAME}_nginx
        build: ./docker-assets/nginx
        volumes:
            - ./src:/src
            - ./docker-assets/nginx/conf.d:/etc/nginx/conf.d
        links:
            - php-fpm
        ports:
            - 8080:8080
        working_dir: /src

    # php
    php-fpm:
        container_name: ${PROJECT_NAME}_php-fpm
        build: ./docker-assets/php
        links:
            - mysql
            - redis
            - mailhog
        ports:
            - 6001:6001
        volumes:
            - ./src:/src
        working_dir: /src

    # database
    mysql:
        container_name: ${PROJECT_NAME}_mysql
        image: mysql
        volumes:
            - ./database:/var/lib/mysql
        ports:
            - 3306:3306
        command: --default-authentication-plugin=mysql_native_password
        restart: always
        environment:
            MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD}
            MYSQL_DATABASE: ${MYSQL_DATABASE}
            MYSQL_USER: ${MYSQL_USER}
            MYSQL_PASSWORD: ${MYSQL_PASSWORD}

    # adminer
    adminer:
        container_name: ${PROJECT_NAME}_adminer
        image: adminer
        restart: always
        links:
            - mysql
        ports:
            - 6080:8080
        environment:
            ADMINER_DESIGN: 'pepa-linha'
            ADMINER_DEFAULT_SERVER: mysql

    # redis
    redis:
        container_name: ${PROJECT_NAME}_redis
        image: redis:alpine

    # redis commander
    redis-commander:
        container_name: ${PROJECT_NAME}_redis_commander
        hostname: redis-commander
        image: rediscommander/redis-commander:latest
        restart: always
        links:
            - redis
        environment:
            - REDIS_HOST=redis
            - REDIS_PORT=6379
        ports:
            - 6081:8081

    # mailhog
    mailhog:
        container_name: ${PROJECT_NAME}_mailhog
        image: mailhog/mailhog
        ports:
            - 1025:1025
            - 6082:8025