问题描述
您好,我正在尝试为我的应用创建聊天系统,但是在使pusher和echo工作时遇到问题。当我在2个人之间打开聊天时,它不会实时更新,因此我必须刷新页面才能获取更新的内容,例如消息等。在控制台中,我遇到了这两个错误
POST http:// localhost / broadcasting / auth 403(禁止)
POST http:// localhost / broadcasting / auth 500(内部服务器错误)
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,encrypted: true,});
class Chatbroadcast implements ShouldbroadcastNow
{
use dispatchable,InteractsWithSockets,SerializesModels;
public $ticket;
/**
* Create a new event instance.
*
* @param $ticket
*/
public function __construct(Ticket $ticket)
{
$this->ticket = $ticket;
}
/**
* Get the channels the event should broadcast on.
*
* @return \Illuminate\broadcasting\Channel|array
*/
public function broadcastOn()
{
return new PrivateChannel('tickets_channel.' . $this->ticket->id);
}
public function broadcastWith(){
$messages = Message::all()->where('ticket_id','=',$this->ticket->id)->sortBy('created_at');
return [
'ticket' => $this->ticket,'messages' => $messages
];
}
}
channels.PHP
use App\Ticket;
use Illuminate\Support\Facades\Auth;
use Illuminate\Support\Facades\broadcast;
broadcast::channel('App.User.{id}',function ($user,$id) {
return (int) $user->id === (int) $id;
});
broadcast::channel('tickets_channel.{ticketID}',$ticketID) {
Auth::check();
$ticket = Ticket::all()->where('id',$ticketID)->first();
return $ticketID == $ticket->id;
});
VueComponent
mounted() {
Echo.private('tickets_channel.${ticketID}')
.listen('Chatbroadcast',(e) => {
console.log(e);
this.messagesMutable = e.messages;
this.state = e.ticket.isOpened;
});
},
这是我的500错误日志
[2020-09-08 09:25:24] local.ERROR: Invalid channel name private-tickets_channel.${ticketID} {"userId":11,"exception":"[object] (Pusher\\PusherException(code: 0): Invalid channel name private-tickets_channel.${ticketID} at /Users/miroslavjesensky/Documents/Blog/vendor/pusher/pusher-PHP-server/src/Pusher.PHP:282)
-编辑-
我已通过将VueComponent代码更改为此问题来解决了500个错误
mounted() {
let id = this.ticket.id;
Echo.private('tickets_channel' + id)
.listen('Chatbroadcast',(e) => {
this.messagesMutable = e.messages;
this.state = e.ticket.isOpened;
});
},
解决方法
原来问题出在我与第一个VueComponent一起使用的另一个VueComponent上。在修复了回声的收听部分之后,所有的工作也都应按要求进行