I want create a chat with laravel 5.4, vuejs and pusher api with Echo. I did it two time to communicate with pusher but i have no callback and my vue. I work in local with MAPM if its can help.
i have install
composer require pusher/pusher-php-server npm install --save laravel-echo pusher-js and my blade i put this
<meta name="csrf-token" content="{{ csrf_token() }}"> in my bootstrap.js i have uncomment Echo and i have entry my pusher key
import Echo from "laravel-echo" window.Echo = new Echo({ broadcaster: 'pusher', key: 'my-push-key' }); my broadcasting config
'default' => env('BROADCAST_DRIVER', 'null'), 'connections' => [ 'pusher' => [ 'driver' => 'pusher', 'key' => env('PUSHER_APP_KEY'), 'secret' => env('PUSHER_APP_SECRET'), 'app_id' => env('PUSHER_APP_ID'), 'options' => [ // ], ], 'redis' => [ 'driver' => 'redis', 'connection' => 'default', ], 'log' => [ 'driver' => 'log', ], 'null' => [ 'driver' => 'null', ], ], my .env
BROADCAST_DRIVER=log PUSHER_APP_ID=my id key PUSHER_APP_KEY=my app key PUSHER_APP_SECRET=my secret key and my app.js
const root = new Vue({ el: '#root', data: { messages: [] }, methods: { addMessage(message){ this.messages.push(message); axios.post('/messages', message).then(response => { }); } }, created() { axios.get('/messages').then(response => { this.messages = response.data; }); Echo.join('chatroom') .here() .joining() .leaving() .listen('MessagePosted', (e) => { console.log(e); }); } }); my controller
public function store(Request $request){ $user = Auth::user(); $message = $user->messages()->create([ 'message' => $request->message ]); event(new MessagePosted($message, $user)); return ['status' => 'OK']; } my event
namespace App\Events; use App\Message; use App\User; 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 MessagePosted implements ShouldBroadcast { use Dispatchable, InteractsWithSockets, SerializesModels; public $message; public $user; /** * Create a new event instance. * * @return void */ public function __construct(Message $message, User $user) { $this->message = $message; $this->user = $user; } /** * Get the channels the event should broadcast on. * * @return Channel|array */ public function broadcastOn() { return new PresenceChannel('chatroom'); } } and channel route
Broadcast::channel('chatroom', function ($user) { return $user; }); 