dorel_besliu's avatar

React js + Laravel echo. Do not listen events.

I have react js on front end part and Laravel for back end. On back end part I created a node server which are running laravel echo server:

require('dotenv').config();
const env = process.env;

const echoServer = require('laravel-echo-server');

echoServer.run({
    authHost: env.APP_URL,
    devMode: env.APP_DEBUG,
    database: "redis",
    port: env.ECHO_PORT,
    databaseConfig: {
        redis: {
            prefix: "studentapp_database_",
            host: env.REDIS_HOST,
            port: env.REDIS_PORT,
            password: env.REDIS_PASSWORD,
        }
    },
    protocol: env.ECHO_PROTOCOL,
    apiOriginAllow: {
        "allowCors" : true,
        "allowOrigin" : "*",
        "allowMethods" : "*",
        "allowHeaders" : "*"
    }
});

On front end part I created an instance of laravel-echo:

    export default new Echo({
    host: process.env.REACT_APP_API_BASE_URL + ':6001',
    broadcaster: 'socket.io',
    client: socketIo,
    auth: {
        headers: {
            'Authorization': 'Bearer ' + cookies.get('accessToken')
        }
    },
});

and of course I am listening an event:

    Echo.channel('school-chat-room').listen('chat', data => console.log(data, 'New Message'));

also on back end I created an event which I am broadcast:

    class MessageWritten implements ShouldBroadcastNow
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    public $message;

    /**
     * Create a new event instance.
     *
     * MessageWritten constructor.
     *
     * @param ChatMessage $message
     */
    public function __construct(ChatMessage $message)
    {
        $this->message = $message;
    }

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

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

with channel:

    Broadcast::channel('school-chat-room', function ($user) {
           return ['user' => $user];
        });

and broadcast: MessageWritten::broadcast($message);

But I am not receiving any message on front end. Can someone give me a suggestion - what I am doing wrong ?

0 likes
0 replies

Please or to participate in this conversation.