Laravel, Vue.js Redis, socket.io realtime chat

0

Cześć wszystkim, to mój pierwszy post na forum więc na wstępie chciałem się przywitać :)
Od kilku dni próbuję poradzić sobie z czatem realtime w Laravel i Vue. Widziałem już podobne wątki na forum jednak nie rozwiązują one mojego problemu w żaden sposób. Używam Redis, socket.io i laravel-echo-server. Całe zaplecze zarówno po stronie serwera jak i klienta mam gotowe jednak nie mogę w żaden sposób uruchomić odbierania wiadomości w czasie rzeczywistym.

To może od początku. Mam utworzony Event który wygląda tak:

/**
     * @var ChatConversationMessage $message
     */
    public $message;
 
    /**
     * @param ChatConversationMessage $message
     */
    public function __construct(ChatConversationMessage $message)
    {
        $this->message = $message;
    }
 
    /**
     * @return string
     */
    public function broadcastAs(): string
    {
        return 'message.sent';
    }
 
    /**
     * @return PrivateChannel
     */
    public function broadcastOn(): PrivateChannel
    {
        return new PrivateChannel('private-chat-room-' . $this->message->conversation_id);
    }
 
    /**
     * @return array
     */
    public function broadcastWith(): array
    {
        return [
            'message_id' => $this->message->id,
            'message' => $this->message->message
        ];
    }

następnie, w serwisie, po zapisie wiadomości do bazy wywołuję Event

broadcast(new MessageEvent($item))->toOthers();
// gdzie $item to wysłana wiadomość

i to by było tyle po stronie serwera, teraz po stronie klienta mam plik laravel-echo-server.json wygenerowany, wygląda tak:

{
    "authHost": "http://localhost",
    "authEndpoint": "/api/broadcasting/auth",
    "clients": [
        {
            "appId": "66c7f1cb42ed2a12",
            "key": "9c4ea5dc3ce0b7ffba029b01cefcd5c7"
        }
    ],
    "database": "redis",
    "databaseConfig": {
        "redis": {
            "port": "6379",
            "host": "127.0.0.1",
            "db": "0",
            "password": ""
        }
    },
    "devMode": true,
    "host": "127.0.0.1",
    "port": "6001",
    "protocol": "http",
    "socketio": {},
    "secureOptions": 67108864,
    "sslCertPath": "",
    "sslKeyPath": "",
    "sslCertChainPath": "",
    "sslPassphrase": "",
    "subscribers": {
        "http": true,
        "redis": true
    },
  "apiOriginAllow":{
    "allowCors" : true,
    "allowOrigin" : "http://127.0.0.1:8000/api/",
    "allowMethods" : "GET, POST",
    "allowHeaders" : "Origin, Content-Type, X-Auth-Token, X-Requested-With, Accept, Authorization, X-CSRF-TOKEN, X-Socket-Id"
  }
}

konfiguracja

import Echo from 'laravel-echo'
 
window.io = require('socket.io-client')
 
const echo = new Echo ({
  broadcaster: 'socket.io',
  host: window.location.hostname + ':6001',
  auth: {
    headers: {
      Authorization: "Bearer " + localStorage.getItem('token')
    }
  }
})
 
export default ({Vue}) => {
  Vue.prototype.$echo = echo
}

i teraz już w sumie ostatnia część, podczas wysyłania wiadomości

submit() {
     this.$axios.post('chat/conversations/messages/create', this.data)
     .then((data) => {
       if (data.data.success === 1) {
         this.data.message = '';
         this.$emit('success')
          
         this.$echo.private('private-chat-room-'+this.$route.params.id)
           .listen('.message.sent', (e) => {
             console.log(e);
           })
 
       }
     })
 
   }

czy ktoś mógłby mi wskazać drogę? :D może czegoś brakuje lub coś do poprawy?

dodam jeszcze że pomiędzy serwerem a klientem komunikuję się przez api, nie jest to jedna aplikacja. Lara działa na porcie localhost:8000 a vue localhost:8080

redis po stronie serwera mam skonfigurowane. Redis i laravel-echo-server uruchomione

0

Na czym konkretnie polega problem? Z tego co widzę nasłuchujesz dopiero po wysłaniu aplikacji. Ale jednocześnie używasz metody toOthers żeby propagować event, więc pójdzie do wszystkich oprócz nadawcy - testujesz na 2 instancjach klienta?

0

Problem polega na tym że kiedy wyślę to z konta jednego użytkownika to odbiorca nie otrzymuje wiadomości w czasie rzeczywistym.
Testuję to zalogowany na konto użytkownika A i wysyłam do użytkownika B na którego konto jestem zalogowany w karcie prywatnej.

0

@ssquad: Ok, w takim razie mógłbyś udostępnić kod na GH? Niestety z tym co podałeś ciężko namierzyć babola.

1 użytkowników online, w tym zalogowanych: 0, gości: 1