Недействительный ключ в данных аутентификации подписки, введите: websocketError

Я использую Laravel 5.8. *, Laravel echo, pusher и vuejs для приватного чата.

Попытка прослушать транслируемое событие с использованием vuejs в качестве внешнего интерфейса, но данные не получены в обратном вызове от pusher. Я вижу частный канал и данные, отправленные на пушер, но полученные пустыми. При подключении к pusher я вижу в консоли следующие сообщения:

Pusher : Event sent : {"event":"pusher:subscribe","data":{"auth":"460f6d3e4959b66a186a:3a759e55e46fc62d0188461344828ee4266edba8f1c0f5a5fd9743beb086d8cf","channel":"private-messages.1"}}

Pusher : Event recd : {"event":"pusher:error","data":{"code":null,"message":"Invalid key in subscription auth data: '460f6d3e4959b66a186a'"}}

Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":null,"message":"Invalid key in subscription auth data: '460f6d3e4959b66a186a'"}}}

Я перепробовал все возможные способы, но не смог найти причину этой ошибки подписки. Я правильно установил все данные толкателя (имя канала, ключ, секретный идентификатор, идентификатор приложения, кластер). Я прочитал все другие вопросы, в которых уже упоминалась та же проблема здесь, в stackoverflow, но ни у одного из них нет соответствующего решения или ответа. Итак, снова пришел сюда за помощью, если кто-то подключится удаленно и проверит на моем ноутбуке.

ChatApp.vue

<template>
    <div class="chat-app">
        <Conversation :contact="selectedContact" :messages="messages" @new="saveNewMessage"/>
        <ContactsList :contacts="contacts" @selected="startConversationWith"/>
    </div>
</template>

<script>
import Conversation from './Conversation';
import ContactsList from './ContactsList';

export default {
    props: {
        user: {
            type: Object,
            required: true
        }
    },
    data(){
        return {
            selectedContact: null,
            messages: [],
            contacts: []
        };
    },
    mounted() {
        Echo.private(`messages.${this.user.id}`)
        .listen('NewMessage', (e) => {
            console.log('listening NewMessage');
            this.handleIncoming(e.message);
        });
        axios.get('/contacts')
        .then((response)=>{
            this.contacts = response.data;
        });
    },
    methods:{
        startConversationWith(contact){
            this.updateUnreadCount(contact, true);
            axios.get(`/conversation/${contact.id}`)
            .then((response) => {
                this.messages = response.data;
                this.selectedContact = contact;
            })
        },
        saveNewMessage(message){
            this.messages.push(message);
        },
        handleIncoming(message){
            if (this.selectedContact && message.from == this.selectedContact.id) {
                this.saveNewMessage(message);
                return;
            }
            this.updateUnreadCount(message.from_contact, false);
        },
        updateUnreadCount(contact, reset){
            this.contacts = this.contacts.map((single)=>{
                if (single.id !== contact.id) {
                    return single;
                }
                if (reset)
                    single.unread = 0;
                else
                    single.unread += 1;
                return single;
            })
        }
    },
    components: {Conversation, ContactsList}
}
</script>

<style lang="scss" scoped>
.chat-app{
    display:flex;
}
</style>

СОБЫТИЕ

<?php

namespace App\Events;

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

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

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

    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        return new PrivateChannel('messages.'.$this->message->to);
    }

    public function broadcastWith(){
        $this->message->load('fromContact');
        return ["message" => $this->message];
    }
}

channels.php

Broadcast::channel('messages.{id}', function ($user, $id) {
  return $user->id === (int) $id;
});

broadcasting.php

'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,
            ],
        ],

связь с laravel echo

 window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    encrypted: true
});

.env

PUSHER_APP_ID=xxxx
PUSHER_APP_KEY=dbxxxxxxxb29
PUSHER_APP_SECRET=160xxxxxxxx11af
PUSHER_APP_CLUSTER=ap2

MIX_PUSHER_APP_KEY="${PUSHER_APP_KEY}"
MIX_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"

BROADCAST_DRIVER=pusher
CACHE_DRIVER=file
QUEUE_CONNECTION=sync
SESSION_DRIVER=file
SESSION_LIFETIME=120

В журнале ошибок панели управления толкателем ошибок нет.