laravel 和 React 推送器设置

laravel and react pusher setup

我正在做一个网络项目。

我有 laravel 作为我的后端 reactjs 作为我的前端

我有用户,post我的数据库中有评论。

我想实现推送器,这样我就可以在任何用户 post 编辑一个新的 post 后实时显示 post。

我非常接近实现此行为。

在 laravel

我有这个活动

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

    public $post;

    /**
     * Create a new event instance.
     *
     * @return void
     */
    public function __construct($post)
    {
        $this->post = $post;
    }

    /**
     * Get the channels the event should broadcast on.
     *
     * @return \Illuminate\Broadcasting\Channel|array
     */
    public function broadcastOn()
    {
        return new Channel('posts');
    }

} 

一旦 post 存储到我的数据库中,我就会触发此事件

event(new NewPostsCast($output)); 

反应

let channel = pusher.subscribe("posts");
// i guess error is here because this function never called
// it's only called at startup
channel.bind("NewPostsCast", post => {
    console.log("pusher::: ", post);
});

可能有用

来自推送日志

Pusher : No callbacks on posts for App\Events\NewPostsCast

然而 pusher returns 这个日志也

Pusher : Event recd : {"event":"App\Events\NewPostsCast","channel":"posts","data":{"post":{"id":19,"title":"sd","body":"eksdl","tags":"[\"ds\",\"dsf\"]","user_id":1,"created_at":"2019-04-18 14:22:00","updated_at":"2019-04-18 14:22:00","votes":0,"user":{"id":1,"name":"user1","username":"user1","email":"user1@health.io","address":null,"state":null,"country":null,"gender":"female","phone":null,"avatar":"http://healthqo.api/public/profile_pics/default/female.png","created_at":"2019-04-09 08:30:12","updated_at":"2019-04-09 08:30:12"}}}}

in case anyone is still struggling with the same problem

来自推送器日志它说(App\Events\NewPostsCast 的帖子没有回调) 完全解决了问题

因为 react 和 laravel 在我的项目中是分开的 (NewPostsCast) 未定义 所以我不得不更改绑定函数的第一个参数

像这样:
来自

let channel = pusher.subscribe("posts");
channel.bind("NewPostsCast", post => {
    console.log("pusher::: ", post);
});

let channel = pusher.subscribe("posts");
channel.bind("App\Events\NewPostsCast", post => {
    console.log("pusher::: ", post);
});

不确定为什么要双双反斜杠,但它给我一个单反斜杠的语法错误