Question

我正在学习比萨订单跟踪器项目上的广播。我有一个管理面板，其中显示所有订单。管理员可以更新特定订单

public function update(Request $re)
{
    DB::table('orderr')->where('id',$re->order)->update(['status_id'=>$re->status]);
    $user=Auth::user();
    $order=Order::find($re->order);
    event(new oscEvent($order));
    return redirect()->route('all');

}

在发出更新后的oscEvent。

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

/**
 * Create a new event instance.
 *
 * @return void
 */
public $order;

public function __construct($order)
{
    $this->order=$order;

}

/**
 * Get the channels the event should broadcast on.
 *
 * @return \Illuminate\Broadcasting\Channel|array
 */
public function broadcastOn()
{
    return new PrivateChannel('osc'.$this->order->id);
}

public function broadcastWith()
{
    return
    [
        'order_id'=>$this->order->id,
        'order_user_id'=>$this->order->user_id,
        'order_status_name'=>$this->order->status->name,
        'order_status_percent'=>$this->order->status->percent,


    ];
}

}

用户拥有自己的面板，该面板上显示了他的订单。每个订单都有自己的进度栏。管理员更新订单时，每个进度条都会更改而不会刷新页面值。我为此使用广播和按钮。进度栏位于vue组件pas.vue

中

///用户视图

 foreach($orders as $o)
<tr>
<td>{{ $o->name }}</td>
<td>{{ $o->user->name }}</td>
<td>{{ $o->status->name }}</td>
<td width="50%"><pas :perc="{{ $o->status->percent }}" :order_id={{ $o->id }}></pas></td>
</tr>

//// pas.vue

<template>
    <div>
   <b-progress :value="perc" :max="max" show-progress animated></b-progress>
  </div>
</template>

 export default {
data() {
return {

    max:100
};
 },
   props:['perc','order_id'],
   mounted(){

  Echo.private('osc'+this.order_id)
.listen('oscEvent', (e) => {
    this.perc=e.order_status_percent
    console.log('progressbar updated');
});

}，

我也在授权频道。

Broadcast::channel('osc1', function () {
///return (int) $user->id === (int) $o->user_id;
return true;
});

使用公共频道，一切正常。有问题的是私人渠道。上面介绍的配置无法正常工作。 Pusher调试控制台在专用通道上正确返回了api消息，但progressbar没有更新。请帮忙。

Answer 1

您需要将$user和$o变量传递到广播路由回调中，并将参数定义用花括号括起来：

Broadcast::channel('osc{o}', function($user, Order $o) { ... });

如果您不希望echo将整个事件名称空间添加到事件的前缀，则需要在事件名称（仅在前端）上添加.：

.listen('.oscEvent', (e) ...

在您的oscEvent类中，您应该在构造函数中键入$ order参数的提示：

public function __construct(Order $order) { ... }

在没有看到Echo初始化的情况下，很难判断您是否已正确配置它以进行身份验证。您是否将csrf令牌添加到页面中，以便echo可以接收到它？

从Laravel docs：

Laravel Echo将需要访问当前会话的CSRF令牌。您应该验证应用程序的头HTML元素是否定义了包含CSRF令牌的元标记：

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

确保在您的Broadcast::routes();方法中调用了BroadcastServiceProvider::boot。

希望这会有所帮助。

注意

我认为您可能确实希望将整个名称空间添加到事件的前缀，因此您可能会忽略建议2

Answer 2

它仍然不起作用。

我修改了频道回调

 Broadcast::channel('osc{o}', function ($user,Order $o) {
 return (int) $user === (int) $o->user_id;
});

我制作了类型提示Order类。
我正在用户视图和管理员视图中扩展“ layouts.app”模板。
是的，它被称为。

我正在使用laravel 5.6。

laravel vue pusher-在私人频道上播放不起作用

2 个答案: