3

使用 Laravel (v5.7) 我试图让广播与 Pusher 和 Vue 一起工作。

该应用程序就像一个聊天。当私聊有消息发送时，调用如下函数： broadcast(new NewChat($message));

这是“NewChat”事件：

class NewChat implements ShouldBroadcast
{
    use Dispatchable, InteractsWithSockets, SerializesModels;

    public $message;

    public function __construct(\App\Message $message)
    {
        $this->message = $message;
    }

    public function broadcastOn()
    {
        return new PrivateChannel('chats.' . $this->message->conversation_id);
    }

    public function broadcastWith()
    {
        return ['message' => $this->message];
    }
}

有channels.php：

Broadcast::channel('chats.{conversationId}', function ($user, $conversationId) {
    return true; // security i'll do later
});

它将所有内容发送给 Pusher： 在此处输入图像描述

但我不知道如何正确地用 Vue 监听事件并更新它。我在 boostrap.js 中添加了以下内容（全部用 Vue 应用程序编写）：

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
});
window.Echo.private(`chats.1`)
    .listen('NewChat', (e) => {
        console.log(e);
    });

在示例中，我将数字 1 硬编码为专用频道，因为这与屏幕截图中的频道相同。

我错过了什么？我多次重新阅读文档页面并尝试按照教程查看我是否跳过了一些小的但不知道的内容。有人看到我错过了什么吗？

4

1 回答 1

-2

根据您在评论中的回复，您的broadcasting/auth请求调用不会被触发。这似乎表明您的bootstrap.js文件中的 Laravel Echo 代码没有被调用。

您可以测试它的一种方法是简单地console.log在您的bootstrap.js文件中添加一个。可能的原因可能是 a) 错过了部署脚本运行，b) 您的应用入口点未调用bootstrap.js.

如果您错过了部署脚本运行，只需运行npm run prod即可解决问题。

于 2018-10-30T11:09:25.513 回答