Voor het odisee MyCompass project dat we recent hebben afgewerkt, hebben we een real-time chat gemaakt. We hebben hiervoor gebruik gemaakt van Laravel, React en Laravel echo server. 

Als gebruiker kan je rechtstreeks chatten met je coach en in de wereld van vandaag moeten zo’n dingen synchroon kunnen verlopen: als je coach beschikbaar is, wil je daar rechtstreeks mee kunnen chatten zonder vertragingen. Deze gesprekken zijn vertrouwelijk, dus moeten we er natuurlijk ook voor zorgen dat dit op een veilige en betrouwbare manier gebeurt.

Daarom hebben we verschillende lagen van security ingebouwd.

In schemavorm ziet dit er zo uit:

De gebruiker drukt op verzenden en stuurt een POST request met de inhoud van het bericht naar de API. De API verwerkt dit bericht, slaat het op in de database en zet in een queue (wachtrij) een message met deze inhoud:

{"user-id": "42", "sender": "9", "content": "new-message"}. 

Als de queue dan verwerkt wordt door supervisor (proces dat altijd draaiende wordt gehouden), wordt er een bericht gestuurd naar de NodeJS server.
Deze stuurt dan op zijn beurt een pushbericht over een websocket naar de browser van enkel deze ene gebruiker (42). Wanneer dat aangekomen is, vraagt de browser van die gebruiker aan de API om "new-message" berichten op te halen in het gesprek met user 9.

Omdat er enkel wordt doorgestuurd dat er een nieuw bericht is, en de inhoud van dat bericht zelf apart moet opgehaald worden, blijft dit allemaal secure. De socket krijgt dus alleen maar informatie over nieuwe messages en de inhoud daarvan blijft achter de gewone API zitten.

Door gebruik te maken van reeds bestaande packages is dit eenvoudig te implementeren. We hebben voor het NodeJS stuk alleszins geen eigen code moeten schrijven maar volledig op het reeds bestaande pakket kunnen doorbouwen. Voor het gedeelte in Laravel hebben we een custom broadcast service en een custom notification class geschreven.

Aan de React kant van de applicatie kunnen we gebruik maken van een al bestaande socket.io implementatie, dus ook daarvoor hebben we kunnen steunen op een reeds bestaande code.

Meer weten over het project?

Lees je graag meer over hoe we deze case tot een succesvol platform hebben gemaakt?

Author: Joris Vercammen
Developer
Joris Vercammen

More insights

Beveiliging van Laravel 101

In deze blogpost gaan we dieper in op een aantal veelvoorkomende Laravel beveiligingsfouten.

Auteur: Robbe Reygel
PHP developer
laravel

Test Driven Development - toepassing op een project

TDD, of voluit Test Driven Development, is een aanpak van ontwikkeling waarbij we vertrekken van het schrijven van tests. 

Auteur: Sarah Jehin
PHP developer
Sarah Jehin
development

De OSLO-standaard: hoe gestandaardiseerde gegevensuitwisseling ons verder brengt

De OSLO-standaard is een term die je misschien wel eens hebt horen vallen in de context van gegevensuitwisseling en digitale transformatie, maar wat houdt het precies in en wat zijn de voordelen ervan?

Auteur: Benjamin Verhaegen
PHP Developer
benjamin_verhaegen
shaking_hands_black_white

De toekomst van web applicaties: wat kunnen we verwachten?

In de afgelopen jaren hebben web applicaties een enorme evolutie doorgemaakt. Maar wat heeft de toekomst voor ons in petto? Je ontdekt het allemaal in deze blog.

Author: Tom Van den Eynden
Web Architect | Coordinator
Tom Van den Eynden
computerscherm met code

Het verschil tussen gegevensbeheer en gegevensverwerking in een digitale economie

Gegevens zijn cruciaal voor bedrijven en het begrijpen van de verschillen tussen gegevensbeheer en gegevensverwerking kan verwarrend zijn. In dit artikel zullen we deze verschillen in de digitale economie nader bekijken om hun doelen en toepassingen beter te begrijpen.

Author: Tom Van den Eynden
Web Architect | Coordinator
Tom Van den Eynden
gegevensverwerking

Adressen register & GEOpunt API

Zelf al eens voor de keuze gestaan of je Google maps, openstreetmaps, of een andere GIS provider zou moeten gebruiken voor adres suggesties? Mocht je enkel Belgische adressen nodig hebben, lees dan zeker verder!

Author: Noah Gillard
PHP / Laravel Developer
Noah Gillard AI generated Face
Logo vlaamse overheid