It is possible that each modal has its own event channel to only update the modal that I need, my application uses vuetify, then I add a snippet of my code
vuetify js
data() {
return {
items: [],
},
mounted() {
this.update_products();
},
methods: {
update_products() {
Echo.channel('QueryProducts').listen('QueryProducts', (e) => {
this.items = QueryProducts;
})
}
vuetify
<v-data-table :headers="headers" :items="items" >
QueryProducts.php
<?php
namespace App\Events;
use Illuminate\Broadcasting\Channel;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Queue\SerializesModels;
class QueryProducts implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
public $QueryProducts;
/**
* Create a new event instance.
*
* #return void
*/
public function __construct($QueryProducts)
{
//
$this->QueryProducts= $QueryProducts;
}
/**
* Get the channels the event should broadcast on.
*
* #return \Illuminate\Broadcasting\Channel|array
*/
public function broadcastOn()
{
return newChannel('QueryProducts');
}
}
So I have that every time I open a modal it is updated but if I open the modal of another different id, well it updates me with the channel
Related
I did the update to Laravel 9 today. Before, Pusher worked well on the application.
Now, I receive always the following error:
Pusher error: The data content of this event exceeds the allowed maximum (10240 bytes)
I didn't change the content.
I tested to change the content with the given supplier_id, with a fake id like "ee" and without any restrictions.
In the console log, I have the following result:
Why does pusher work, even there is an error in the backend?
<?php
namespace App\Events\Kanban;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Queue\SerializesModels;
use Illuminate\Support\Facades\Log;
class KanbanOrderCreatedEvent implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
public $kanbanOrder;
public function __construct($kanbanOrder)
{
$this->kanbanOrder = $kanbanOrder;
}
/**
* Get the channels the event should broadcast on.
*
* #return \Illuminate\Broadcasting\Channel|array
*/
public function broadcastOn()
{
return ['kanbanOrders.'.$this->kanbanOrder->network_supplier_id];
}
public function broadcastAs()
{
return 'kanbanOrderCreated';
}
public function broadcastWith()
{
return ['supplier_id' => $this->kanbanOrder->network_supplier_id];
}
}
I have newly started working with laravel broadcasting and faced a problem. I am using Pusher and I want to check if users are authorized to subscribe to a private channel. Users' access to posts' comment notification is authenticated but not authorized. I am trying to send notification of new comment only to the post's author but all authenticated users who have opened the post get notifications. Am I missing something or what?
<?php
namespace App\Events;
use Illuminate\Broadcasting\Channel;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
class NewCommentEvent implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
/**
* Create a new event instance.
*
* #return void
*/
public $comment;
public function __construct($comment)
{
$this->comment = $comment;
}
/**
* Get the channels the event should broadcast on.
*
* #return \Illuminate\Broadcasting\Channel|array
*/
public function broadcastOn()
{
return new PrivateChannel('post-'.$this->comment->post_id);
}
public function broadcastAs()
{
return 'new-comment-event';
}
public function broadcastWith()
{
return ['comment' => $this->comment->comment];
}
}
routes/channel.php:
<?php
use App\models\Post;
Broadcast::channel('App.User.{id}', function ($user, $id) {
return (int) $user->id === (int) $id;
});
Broadcast::channel('post-{id}', function ($user, $id) {
return false;
//return $user->id == Post::find($id)->author_id;
});
And the JavaScript in view:
var pusher = new Pusher('904d58ankty8c8397d000', {
authEndpoint: 'http://localhost/blog/public/broadcasting/auth',
cluster: 'ap2',
forceTLS: true,
auth: {
headers: {
'X-CSRF-Token': "{{csrf_token()}}"
}
}
});
var privateChannel = pusher.subscribe("private-post-{{{$post->id}}}");
privateChannel.bind('new-comment-event', function(data) {
$('#post-comments').append('<p>'+data.comment+'</p>');
});
By the way the following is the provider code:
public function boot()
{
Broadcast::routes(['middleware' => ['auth']]);
require base_path('routes/channels.php');
}
The laravel version i am using is: 5.8
What does "$this->comment->post_id" denote? If it denotes the id of that particular post, then who ever has access to that post will get the notification. Get author_id from post_id and Broadcast on 'post-'.author_id.
I am very new laravel broadcasting. I am working with redis, socket.io and laravel echo. When i reflesh the page this is write on console
GET http://localhost:6001/socket.io/?EIO=3&transport=polling&t=MloS95c
net::ERR_CONNECTION_REFUSED
My Test Event:
namespace App\Events;
use Illuminate\Broadcasting\Channel; use Illuminate\Queue\SerializesModels; use Illuminate\Broadcasting\PrivateChannel; use Illuminate\Broadcasting\PresenceChannel; use Illuminate\Foundation\Events\Dispatchable; use Illuminate\Broadcasting\InteractsWithSockets; use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
class TestEvent {
use SerializesModels;
public $message;
/**
* Create a new event instance.
*
* #return void
*/
public function __construct($message)
{
$this->message = $message;
}
/**
* Get the channels the event should broadcast on.
*
* #return \Illuminate\Broadcasting\Channel|array
*/
public function broadcastOn()
{
return new Channel ('Message');
}
}
My head :
<script src="http://{{ Request::getHost() }}:6001/socket.io/socket.io.js"></script>
<meta name="csrf-token" content="{{ csrf_token() }}">
My Controller:
public function dev(){
event(new TestEvent("Hello"));
return view('home');
}
My Js file:
window.Echo.channel(`Message`)
.listen('TestEvent', (data) => {
console.log(data);
});
You are getting this error as the laravel echo server is not started. Inside your package.json file add under script the following line.
"scripts": {
"start": "laravel-echo-server start",
```
},
Now you need to go to the console and run npm start command into your project root directory. It will start the lavavel echo server and the error will be gone.
hi i am trying to connect with Socket.I.O vuejs laravel
in my App.js or Main.js code is
import io from 'socket.io-client';
import Echo from 'laravel-echo';
import VueEcho from 'vue-echo';
import VueSocketio from 'vue-socket.io';
window.io = require('socket.io-client');
const EchoInstance = new Echo({
broadcaster: 'socket.io',
host: window.location.hostname + ':6001'
});
Vue.use(VueEcho, EchoInstance);
In Channels.php
Broadcast::channel('test-event', function() {
return true;
});
Example event
namespace App\Events;
use Illuminate\Broadcasting\Channel;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
class ExampleEvent implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
/**
* Create a new event instance.
*
* #return void
*/
public function __construct()
{
return "Hello";
}
/**
* Get the channels the event should broadcast on.
*
* #return \Illuminate\Broadcasting\Channel|array
*/
public function broadcastOn()
{
return new Channel('test-event');
}
public function broadcastWith()
{
return [
'data' => 'key'
];
}
}
in Routes web.php
Route::get('test-broadcast', function(){
broadcast(new \App\Events\ExampleEvent);
});
in my Components file
mounted() {
this.$echo.channel("test-event").listen("ExampleEvent", e => {
console.log(e);
});
}
according to
https://medium.com/#dennissmink/laravel-echo-server-how-to-24d5778ece8b
when i run
/test-broadcast
it have to give response in my about.vue browser console , but there is nothing to display at all. can any help what thing i am missing yet , Thanks in Advance
have you setup any queue driver? you will need to configure and run a queue listener. All event broadcasting is done via queued jobs.
or else you can use ShouldBroadcastNow interface.
change in you Example Event:
use Illuminate\Contracts\Broadcasting\ShouldBroadcastNow;
class ExampleEvent implements ShouldBroadcastNow
{ ...
Hi there i'm under development of a Laravel webapp that use events broacasting troug redis, and socket.io. All is working fine, but i tring to return a rendered view as response of Event.
Mi event is something like this:
<?php
namespace App\Events;
use Illuminate\Broadcasting\Channel;
use Illuminate\Queue\SerializesModels;
use Illuminate\Broadcasting\PrivateChannel;
use Illuminate\Broadcasting\PresenceChannel;
use Illuminate\Foundation\Events\Dispatchable;
use Illuminate\Broadcasting\InteractsWithSockets;
use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
class EventName implements ShouldBroadcast
{
use Dispatchable, InteractsWithSockets, SerializesModels;
/**
* Create a new event instance.
*
* #return void
*/
public $data;
public function __construct()
{
$this->data = array(
'power'=> 'Funziona',
'view'=> view('dashboard.partials.messages')->render()
);
}
/**
* Get the channels the event should broadcast on.
*
* #return \Illuminate\Broadcasting\Channel|array
*/
public function broadcastOn()
{
return ['test-channel'];
}
}
and i use this code to render response on the page:
<script src="/frontend/socket.io.js"></script>
<script>
var socket = io('http://1clickfashion.com:3002');
socket.on("test-channel:App\\Events\\EventName", function(message){
// increase the power everytime we load test route
alert(message.data.power);
$('#messages').html('');
$('#messages').html(message.data.view);
});
</script>
The "power" alert is displayed correctly but the view don't work as well. In another view i'm use the view as return response()->json($view) and works perfectly... Someone have similar issues?
For anyone that struggle in this issue, solved by passing the view as variable rendered in Controller. Like this.
In Controller:
$view = view('dashboard.partials.messages')->with('post', $post_c)->render();
event(new \App\Events\Post($view));
in event:
public $data;
public function __construct($view)
{
$this->data = array(
'view'=> $view
);
}