CODEWITHSUNDEEP
laravelvue.jspusher
Amjos.com
Amjos.com

Reputation: 83

How to fix POST http://localhost:8000/broadcasting/auth 419 (unknown status) when sending event to pusher

I am creating a chatting app with laravel and pusher and need help with the broadcasting the events from and to pusher endpoint

After hours of searching and trying, what I saw online as solution is adding csrf token to my headers because laravel need this on every post. I have tried adding the csrf_token to my head tag in html in order to remove the error but still getting POST http://localhost:8000/broadcasting/auth 419 (unknown status). Also I make sure the API credentials are added correctly. All these I have worked on but still not getting it. Also I have a private channel which I have authenticated in channels.php by making it return true.

This is my app.js

const app = new Vue({
el: '#app',
data: {
    message: '',
    chat: {
        message:[],
        user:[],
        color:[],
        "_token": "{{ csrf-token() }}"
    },
},

methods: {
    send(){
        if (this.message.length != 0){
            this.chat.message.push(this.message);
            this.chat.user.push("You");
            this.chat.color.push("success");
            axios.post('/send', {
                message : this.message,
              })
              .then(response =>  {
                console.log(response);
                this.message = '';
              })
              .catch(error =>  {
                console.log(error);
              });
        }

    }
},

mounted() {
    Echo.private('private-chat')
        .listen('ChatEvent', (e) => {
            this.chat.message.push(e.message); 
            this.chat.user.push(e.user);
            this.chat.color.push("warning");
            console.log(e);
    });
}


This is my chatController.php

public function send(Request $request)
 {
      return $request->all();
      $user = User::find(Auth::id());
      broadcast (new ChatEvent($request->message, $user));

   }
// Broadcast.js

  import Echo from 'laravel-echo'

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

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





I expect to have all my events broadcast when users subscribed to the channel but I am getting POST http://localhost:8000/broadcasting/auth 419 (unknown status)

Upvotes: 0

Views: 1854

Answers (1)

user10392165
user10392165

Reputation:

this error happens if you send a request without using csrf token for security purposes, so you will need to add it to your request by adding this tag to the head of HTML

<meta name="csrf-token" content="{{ csrf_token() }}">

Upvotes: 2

Related Questions