Laravel Echo не слушает

Настроил мероприятие и новый канал:

class TaskCreated implements shouldBroadcast
 {
use Dispatchable, InteractsWithSockets, SerializesModels;
public $task;

public function __construct(Task $task)
{
    $this->task = $task;
}

}

и установил Echo и настроил его

 import Echo from "laravel-echo"
window.Pusher = require('pusher-js');
window.Echo = new Echo({
    broadcaster: 'pusher',
    key: 'pusher-key',
    cluster: 'ap2',
    encrypted: true
});

затем я вызываю событие TaskCreated при публикации задачи

event(new TaskCreated($task));

Однако проблема в том, что Echo не слушает журналы pusher или НИЧЕГО. хотя в laravel-websockets событие было создано как api-сообщение.

вот реализация vue js Echo:

 mounted () {
        axios.get('/tasks').then(response => (this.tasks = response.data));

       Echo.channel('taskCreated').listen('TaskCreated', (e) => {
            console.log(e);
            this.tasks.push(task.body)
        });

в дашборде:

api-message Channel: taskCreated, Event: App\Events\TaskCreated 19:01:55

ОБНОВИТЬ

Теперь, когда я пытался подключиться к WS, состояние подключения ожидает в течение 10 секунд, а затем завершается с ошибкой, WebSocket закрывается до того, как соединение установлено. И Ошибка при установлении соединения: net::ERR_CERT_AUTHORITY_INVALID.

URL-адрес запроса: wss://127.0.0.1/app/local? Protocol=7&client=js&version=6.0.2&flash=false

import Echo from "laravel-echo"
window.Pusher = require('pusher-js');
window.Echo = new Echo({
broadcaster: 'pusher',
 key: process.env.MIX_PUSHER_APP_KEY,
 wsHost: window.location.hostname,
 wssPort: 6001,
 disableStats: true,
 enabledTransports: ['ws', 'wss']
Источник

6 ответов

Я не вижу broadcastOn в событии TaskCreated, если он есть в вашем коде, просто используйте метод broadcastAs следующим образом:

public function broadcastAs()
{
    return 'task.created';
}

и в компоненте vue прослушивайте такое событие:

Echo.channel('taskCreated').listen('.task.created', (e) => {
            this.tasks.push(task.body)
        });

дополнительная информация: https://laravel.com/docs/broadcasting, но о laravel-websockets я использую его недавно, и у меня есть аналогичная проблема, и проверьте их репозиторий на github, оказалось, что у них есть некоторые открытые проблемы для этой ошибки, которую они не исправили. Мне нравятся пакеты spatie, но для этого я предпочитаю tlaverdure/laravel-echo-server, и с ним легче работать.

Источник

Для всех, после многих попыток вот что я нашел... вы ДОЛЖНЫ иметь учетные данные pusher, установленные в вашем env. и broadcast.js. Я много пробовал с Laravel 7, чтобы установить его без учетных данных (не повезло), иначе многие проблемы с Google Chrome и сетевыми запросами взорвутся. это для меня и, надеюсь, сработает для вас

Источник

Для Laravel 6.2 используйте socket.io-client@2.4.0

Источник

Может быть, вы можете попробовать:

В вашем TaskCreated событие:

public function broadcastOn()
{
   return new Channel('task.created');     
}

и в вашем Vue:

Echo.channel('task.created').listen('TaskCreated', (e) => {
            this.tasks.push(task.body)
        });
Источник

Как сказал Кабельбаан, удалите точку, но перейдите в консоль отладки и просто обновите свое приложение для начала. Вы должны увидеть подключение и подписку на канал ваших задач. Если вы этого не сделаете, вы можете начать отладку соединения, а не отправлять отправку события. Кроме того, я понимаю, что копирование и вставка просто неполные, но ваш оператор window.Echo неполный.

Источник

net::ERR_CERT_AUTHORITY_INVALID.

URL-адрес запроса: wss://127.0.0.1/app/local? Protocol=7&client=js&version=6.0.2&flash=false

Возможно, у вас проблема с сертификатом SSL. Вы используете wss, который подключается только по https. Вы должны проверить свой ssl-сертификат или использовать вместо него ws.

Плюс совет:

Я бы использовал комбинацию socket.io + redis вместо pusher.

Источник
Другие вопросы по тегам