如何解决 Laravel 广播 + 推送器..?
How to troubleshoot Laravel Broadcasts + Pusher..?
我正在按照 Laravel Documentation 使用 Pusher 设置广播,它看起来很简单,但我还没有让它工作,所以我一定是在某个地方犯了一个错误方式。
这是我所做的:
服务器端
我创建了一个 Event
来实现 ShouldBroadcastNow
接口并定义了 broadcastsOn()
方法。
class ThreadMessageCreated implements ShouldBroadcastNow {
use Dispatchable, InteractsWithSockets, SerializesModels;
public function broadcastOn() {
return new Channel('bobtest');
}
我正在从我的 API 控制器之一引发事件:
public function createMessage(Thread $thread, Request $request) {
...
event(new ThreadMessageCreated($message, $thread));
return $message;
}
我已经在我的 .env
文件中配置了推送器凭据。
客户端
我已经在客户端配置了 Laravel Echo(通过 angular-laravel-echo 包)并为我的客户订阅了该频道。
ngOnInit() {
this.echo
.join('bobtest', 'public')
.listen('bobtest', 'ThreadMessageCreated')
.subscribe(()=>alert('message received'));
console.log(this.echo);
}
然而,当我的 API 端点被命中时,事件被触发,但我在客户端没有看到任何东西。
因此,我在 broadcastOn() 方法中添加了日志记录以验证它是否被调用。然后我将驱动程序从 pusher
更改为 log
,我确实看到广播信息被写入 laravel.log
文件。
所以,我假设广播也在使用 Pusher 驱动程序时发生,并且不是从 Laravel 发出,或者不是' 正在被客户接收。
我是 sockets、pusher 和 Laravel Echo 的新手,所以我不确定到哪里寻找更多信息来追踪它。
- 我在
laravel.log
文件中没有看到任何错误。
- 我在客户端的 Chrome 开发工具中没有看到任何错误。
- 我登录了 pusher,'Error Logs' 选项卡中没有错误
我怎样才能获得更多详细信息以找出问题发生的位置?
谢谢! :-)
[更新]
我可以看到广播出现在我的推送帐户中,所以问题似乎出在客户端。也许我没有正确订阅正确的频道?
此外,我仅使用 Laravel 作为后端,使用 JWT 身份验证。我目前没有使用 laravel csrf 令牌,不确定这是否相关。
我现在知道我可以在 Dev Tools 中看到网络套接字数据。我假设这个错误之前就存在,我只是没有注意到它。我想 101 状态代码对我来说并不突出 :-o
但是在 Dev Tools 中查看后,我可以清楚地看到这个错误:
{
message: "App key xxx not in this cluster. Did you forget to specify the cluster?",
event: "pusher:error"
}
查看 Web Socket activity:
开发工具 > 网络 > 过滤器 > WS(Web 套接字):
在我的例子中,我只需要在 Laravel Echo 配置中指定集群:
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'xxxxxxxxxxxxxxxxxxxx',
cluster: 'us2', <--------------[pusher needs a cluster :-)]
host: 'http://the-host.com',
auth: {
headers: {
'Authorization': 'Bearer ' + token
}
}
});
我正在按照 Laravel Documentation 使用 Pusher 设置广播,它看起来很简单,但我还没有让它工作,所以我一定是在某个地方犯了一个错误方式。
这是我所做的:
服务器端
我创建了一个 Event
来实现 ShouldBroadcastNow
接口并定义了 broadcastsOn()
方法。
class ThreadMessageCreated implements ShouldBroadcastNow {
use Dispatchable, InteractsWithSockets, SerializesModels;
public function broadcastOn() {
return new Channel('bobtest');
}
我正在从我的 API 控制器之一引发事件:
public function createMessage(Thread $thread, Request $request) {
...
event(new ThreadMessageCreated($message, $thread));
return $message;
}
我已经在我的 .env
文件中配置了推送器凭据。
客户端
我已经在客户端配置了 Laravel Echo(通过 angular-laravel-echo 包)并为我的客户订阅了该频道。
ngOnInit() {
this.echo
.join('bobtest', 'public')
.listen('bobtest', 'ThreadMessageCreated')
.subscribe(()=>alert('message received'));
console.log(this.echo);
}
然而,当我的 API 端点被命中时,事件被触发,但我在客户端没有看到任何东西。
因此,我在 broadcastOn() 方法中添加了日志记录以验证它是否被调用。然后我将驱动程序从 pusher
更改为 log
,我确实看到广播信息被写入 laravel.log
文件。
所以,我假设广播也在使用 Pusher 驱动程序时发生,并且不是从 Laravel 发出,或者不是' 正在被客户接收。
我是 sockets、pusher 和 Laravel Echo 的新手,所以我不确定到哪里寻找更多信息来追踪它。
- 我在
laravel.log
文件中没有看到任何错误。 - 我在客户端的 Chrome 开发工具中没有看到任何错误。
- 我登录了 pusher,'Error Logs' 选项卡中没有错误
我怎样才能获得更多详细信息以找出问题发生的位置?
谢谢! :-)
[更新] 我可以看到广播出现在我的推送帐户中,所以问题似乎出在客户端。也许我没有正确订阅正确的频道?
此外,我仅使用 Laravel 作为后端,使用 JWT 身份验证。我目前没有使用 laravel csrf 令牌,不确定这是否相关。
我现在知道我可以在 Dev Tools 中看到网络套接字数据。我假设这个错误之前就存在,我只是没有注意到它。我想 101 状态代码对我来说并不突出 :-o
但是在 Dev Tools 中查看后,我可以清楚地看到这个错误:
{
message: "App key xxx not in this cluster. Did you forget to specify the cluster?",
event: "pusher:error"
}
查看 Web Socket activity:
开发工具 > 网络 > 过滤器 > WS(Web 套接字):
在我的例子中,我只需要在 Laravel Echo 配置中指定集群:
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'xxxxxxxxxxxxxxxxxxxx',
cluster: 'us2', <--------------[pusher needs a cluster :-)]
host: 'http://the-host.com',
auth: {
headers: {
'Authorization': 'Bearer ' + token
}
}
});