Merge pull request #63 from BinaryStudioAcademy/feature/pusher

Implement pusher service

Author: aLLeXUs

backend/app/Action/Tweet/AddTweetAction.php

@@ -7,6 +7,7 @@
 use App\Entity\Tweet;
 use App\Repository\TweetRepository;
 use Illuminate\Support\Facades\Auth;
+use App\Events\TweetAddedEvent;
 
 final class AddTweetAction
 {
@@ -24,6 +25,8 @@ public function execute(AddTweetRequest $request): AddTweetResponse
         $tweet->text = $request->getText();
 
         $tweet = $this->tweetRepository->save($tweet);
+        
+        broadcast(new TweetAddedEvent($tweet))->toOthers();
 
         return new AddTweetResponse($tweet);
     }

backend/app/Events/TweetAddedEvent.php

@@ -0,0 +1,36 @@
+<?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;
+use App\Entity\Tweet;
+use App\Http\Presenter\Tweet\TweetArrayPresenter;
+use Illuminate\Support\Facades\App;
+
+class TweetAddedEvent implements ShouldBroadcast
+{
+    use Dispatchable, InteractsWithSockets, SerializesModels;
+
+    public $tweet;
+
+    public function __construct(Tweet $tweet)
+    {
+        $this->tweet = App::make(TweetArrayPresenter::class)->present($tweet);
+    }
+
+    public function broadcastAs(): string
+    {
+        return 'tweet.added';
+    }
+
+    public function broadcastOn(): PrivateChannel
+    {
+        return new PrivateChannel('tweets');
+    }
+}

backend/app/Providers/BroadcastServiceProvider.php

@@ -14,7 +14,9 @@ class BroadcastServiceProvider extends ServiceProvider
      */
     public function boot()
     {
-        Broadcast::routes();
+        Broadcast::routes([
+            'middleware' => ['api']
+        ]);
 
         require base_path('routes/channels.php');
     }

backend/composer.json

@@ -17,6 +17,7 @@
         "laravel/framework": "5.8.*",
         "laravel/tinker": "^1.0",
         "pda/pheanstalk": "^4.0",
+        "pusher/pusher-php-server": "^3.4",
         "tymon/jwt-auth": "1.0.*"
     },
     "require-dev": {

backend/composer.lock

@@ -171,7 +171,7 @@
          */
         App\Providers\AppServiceProvider::class,
         App\Providers\AuthServiceProvider::class,
-        // App\Providers\BroadcastServiceProvider::class,
+        App\Providers\BroadcastServiceProvider::class,
         App\Providers\EventServiceProvider::class,
         App\Providers\RouteServiceProvider::class,
 

backend/config/app.php

@@ -14,3 +14,7 @@
 Broadcast::channel('App.User.{id}', function ($user, $id) {
     return (int) $user->id === (int) $id;
 });
+
+Broadcast::channel('tweets', function () {
+    return true;
+});

backend/routes/channels.php

@@ -1 +1,4 @@
 VUE_APP_API_URL=http://localhost:7777/api/v1
+VUE_APP_PUSHER_APP_KEY=
+VUE_APP_PUSHER_APP_CLUSTER=eu
+VUE_APP_PUSHER_APP_AUTH_ENDPOINT=http://localhost:7777/broadcasting/auth

frontend/.env.example

@@ -16,6 +16,7 @@
     "buefy": "^0.7.4",
     "core-js": "^2.6.5",
     "moment": "^2.24.0",
+    "pusher-js": "^4.4.0",
     "vue": "^2.6.6",
     "vue-router": "^3.0.1",
     "vuex": "^3.0.1"

frontend/package.json

@@ -2,9 +2,10 @@ import axios from 'axios/index';
 import Storage from '@/services/Storage';
 import { EventEmitter, TOKEN_EXPIRED_EVENT } from '@/services/EventEmitter';
 import { UNAUTHENTICATED } from '@/api/ErrorCodes';
+import { getSocketId } from '@/services/Pusher';
 
 class Api {
-    constructor(apiUrl, authHeaderName = 'Authorization', authHeaderPrefix = 'Bearer') {
+    constructor(apiUrl, authHeaderName = 'Authorization') {
         this.axios = axios.create({ baseURL: apiUrl });
 
         this.axios
@@ -13,7 +14,11 @@ class Api {
             .use(
                 config => {
                     if (Storage.hasToken()) {
-                        config.headers[authHeaderName] = `${authHeaderPrefix} ${Storage.getToken()}`;
+                        config.headers[authHeaderName] = `${Storage.getTokenType()} ${Storage.getToken()}`;
+                    }
+
+                    if (getSocketId()) {
+                        config.headers['X-Socket-ID'] = getSocketId();
                     }
 
                     return config;
@@ -30,9 +35,7 @@ class Api {
                     const { response } = errorResponse;
 
                     if (!response) {
-                        return Promise.reject({
-                            message: 'Unexpected error!'
-                        });
+                        return Promise.reject(new Error('Unexpected error!'));
                     }
 
                     const error = response.data.errors[0];