Laravel Echo + Pusher subscription_error on private channel

Question

I can't manage to get echo and pusher working when using private channels, googled for two days and found nada.

What seems to be happening is some sort of problem with the authentication (I'm using Laravel basic Auth) cause I can subscribe to public channels

routes/channels.php

Broadcast::channel('private-ci-received-{userId}', function ($user, $userId) {
    return (int) $user->id === (int) $userId;
});

Broadcast::channel('private-ci-received-{toUserId}', function ($currentUser, $toUserId) {
    return true;
});

bootstrap.js

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,
     logToConsole: true,
     encrypted: true,
 });

default.blade.php(main layout)

        Pusher.logToConsole = true;
        Echo.logToConsole = true;

        Echo.private('ci-received-{{ Auth::user()->id}}')
            .listen('.CIReceived', (e) => {
                console.log(e);
            });

What get printed on the console is :

Pusher : No callbacks on private-ci-received-1 for pusher:subscription_error

It's a pretty generic error, then for debug purposes I tried to bind the error using Pusher (not laravel echo)

var pusher = new Pusher('MYSECRETAPPKEYHERE', {
            cluster: 'us2',
            forceTLS: true
        });

        var channel = pusher.subscribe('private-ci-received-1');
        channel.bind('pusher:subscription_error', function(data) {
            console.log(data);
        });

console.log(data) output

JSON returned from webapp was invalid, yet status code was 200

The default authEndPoint is /broadcasting/auth IIRC I think it expects to return a JSON but instead it returns the HTML CODE from my page.

Those routes are created by the framework itself and from what I've read Laravel echo and Laravel Auth should work great together without much fiddling.

My .env file is correct i'm using pusher as broadcast driver and BroadcastServiceProvider is properly uncommented.

Can anyone shed a light in the matter? Thanks

Answer 1

This worked for me

Default value of .env is
BROADCAST_DRIVER=log

Pls change it to

BROADCAST_DRIVER=pusher

I was also getting ["No callbacks on private-user.1 for pusher:subscription_error"]

After making the above changes, it works fine for me

Answer 2

Set APP_DEBUG=true in your .env file and check the HTTP response of your auth route in the network section of your browser's developer tools. If authentication is successful, your laravel app should respond with JSON like this:

{"auth": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"}

If there's an error it will show you in the response since you set debug mode to true.

Answer 3

You do not need to add private- onto your channel in broadcasting.php this is done automagically

Try this

Broadcast::channel('ci-received-{userId}', function ($user, $userId) {
    return (int) $user->id === (int) $userId;
});