将事件发送到Pusher时如何修复POST http:// localhost:8000 / broadcasting / auth 419(未知状态)

时间:2019-07-11 11:42:17

标签: laravel vue.js pusher

我正在使用laravel和pusher创建一个聊天应用程序,并且需要在与pusher端点之间广播事件的帮助。

经过数小时的搜索和尝试,我在网上看到的解决方案是在标题中添加csrf令牌,因为laravel在每个帖子中都需要这样做。我尝试将csrf_token添加到html的head标记中,以消除错误,但仍得到POST http://localhost:8000/broadcasting/auth 419(未知状态)。另外,我确保正确添加了API凭据。我已经完成了所有这些工作,但仍然没有得到。另外,我有一个私人频道,通过使它返回true,我已经在channels.php中进行了身份验证。

这是我的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)

1 个答案:

答案 0 :(得分:0)

如果出于安全目的在不使用 csrf 令牌的情况下发送请求,则会发生此错误,因此您需要通过将此标记添加到HTML的头部来将其添加到请求中

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