RossUK
445
1
Laravel

Laravel Echo not listening/working on pusher channel event

Posted 9 months ago by RossUK

Hi I have been trying to use Laravel Echo with pusher after going through the tutorial on Laracasts. I am trying to listen on a public channel just as a test but cannot get a message to log to the console. The project I am trying to add this to is Laravel 5.5.

So far I have the following:

my .env file setup

an event called UpdateProgressData

<?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;

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

    public $foo;

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

    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        return new Channel('progressBar');
    }
}

and the following at the bottom of /resources/assets/js/bootstrap.js

import Echo from 'laravel-echo'

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

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: '8e30361e3c24c96c3397',
    cluster: 'eu',
    encrypted: true
});

window.Echo.channel('progressBar')
    .listen('UpdateProgressData', e => {
        console.log('UpdateProgressData has been updated!');
        console.log(e);
    });

I can see the connections in the pusher debug console and also the event data but nothing is being logged to the console.

I have probably missed something obvious if any can help me debug it will be much appreciated :)

Please sign in or create an account to participate in this conversation.