Laravel, вещающий с Pusher, не слушает с Vue - PullRequest
0 голосов
/ 25 октября 2018

С помощью Laravel (v5.7) я пытаюсь заставить Broacasting работать с Pusher и Vue.

Приложение похоже на чат.Когда в приватном чате отправляется сообщение, вызывается следующая функция: broadcast(new NewChat($message));

Это событие «NewChat»:

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

    public $message;

    public function __construct(\App\Message $message)
    {
        $this->message = $message;
    }

    public function broadcastOn()
    {
        return new PrivateChannel('chats.' . $this->message->conversation_id);
    }

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

channels.php имеет:

Broadcast::channel('chats.{conversationId}', function ($user, $conversationId) {
    return true; // security i'll do later
});

Он отправляет все это Pusher: enter image description here

Но я не могу понять, как правильно слушать События с помощью Vue и обновлять еговсе.Следующее, что я добавил в boostrap.js (все написано в приложении Vue):

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, 
    encrypted: true
});
window.Echo.private(`chats.1`)
    .listen('NewChat', (e) => {
        console.log(e);
    });

В этом примере я жестко закодировал номер 1 для частного канала, потому что это тот же канал, что и изскриншот.

Что мне не хватает?Я перечитывал страницу документации несколько раз и пробовал следовать инструкциям, чтобы увидеть, пропустил ли я что-то маленькое, но не знаю.Кто-нибудь, кто видит, что мне не хватает?

1 Ответ

0 голосов
/ 30 октября 2018

На основании ваших ответов в комментариях ваш broadcasting/auth запрос на звонок не сработал.Это говорит о том, что ваш код Laravel Echo в вашем файле bootstrap.js не вызывается.

Один из способов проверить это - просто добавить console.log в ваш файл bootstrap.js.Возможные причины: а) пропущенный запуск сценария развертывания, б) точка входа вашего приложения не вызывает bootstrap.js.

Если вы пропустили запуск сценария развертывания, просто запустите npm run prod, чтобы исправить проблему.

...