CODEWITHSUNDEEP
laravelvue.jspusherlaravel-notification
Pashupati Sah
Pashupati Sah

Reputation: 586

Cannot listen to pusher private channel using laravel and vue js

I have a created a notification system with all setup and its working fine when i send notification to pusher. But when I try to listen on private channel I get error.

Here is my bootstrap.js file laravel-echo code

    import Echo from 'laravel-echo';

    window.Pusher = require('pusher-js');
    let token = document.head.querySelector('meta[name="csrf-token"]').content;
    window.Echo = new Echo({
        broadcaster: 'pusher',
        key: process.env.MIX_PUSHER_APP_KEY,
        cluster: process.env.MIX_PUSHER_APP_CLUSTER,
        forceTLS: true,
            auth: {
            headers: {
              'X-CSRF-Token': token
            }
          }
      
    });

Here is my meta tag content of main html

 <meta name="csrf-token" content="{{ csrf_token() }}">
 <meta name="user-id" content="{{Auth::check() ? Auth::user()->api_token:''}}">

Here is the code to listen in app.js

let userId = document.head.querySelector('meta[name="user-id"]').content;
Echo.private('App.User.' + userId)
    .notification((notification) => {
        console.log(notification.type);
    });

Here is the error i am getting on console

POST http://localhost:3000/broadcasting/auth 419 (unknown status)

Thanks in advance

Upvotes: 1

Views: 733

Answers (2)

Pashupati Sah
Pashupati Sah

Reputation: 586

I figured it out. It was an issue due to route setup in BroadcastServiceProvider.php

Upvotes: 0

doydoy
doydoy

Reputation: 4091

Error code 419 is used by Laravel to indicate your CSRF token is either invalid or missing. You should ensure you are passing the correct token to your auth endpoint.

Upvotes: 0

Related Questions