Html 5 Websockets

Geschreven door: op woensdag 19 september 2018

Leestijd:

Het web is vooral gebouwd rondom zogeheten http requests en responses. De client stuurt een request naar de server en de server stuurt weer een response terug. Met het introduceren van Ajax calls werd dit concept al wat dynamischer, maar nog steeds hing het proces voornamelijk af van een client die data naar de server stuurt. De server kan deze interactie nooit starten.

Nu bestaat er al een tijdje het concept van Long Polling, wat lijkt op een langdurige connectie met de server. Maar wat er eigenlijk gebeurd is dat de client een http request verstuurd naar de server met een vraag om nieuwe informatie. Als de server geen nieuwe informatie beschikbaar heeft, zal deze niet een lege response terugsturen, zoals bij een normale request/response, maar de server houdt de verbinding open totdat er wel nieuwe informatie beschikbaar is. Hierdoor lijkt het net of er een direct connectie is met de server en dat de server de connectie initieert.

Maar dit is niet optimaal. Long polling kost veel CPU, geheugen en bandwith. Daarnaast is er het probleem met schaalbaarheid. Als er maar enkele requests van de client binnenkomen die de server open moet houden dan gaat dit prima. Zodra de applicatie gaat groeien en dit er duizenden per uur worden dan gaat Long Polling wel voor problemen zorgen. Wat kan er nu wel voor zorgen dat er interactieve communicatie mogelijk is tussen client en server?

In 2010 werd er een nieuwe technologie geïntroduceerd: de Websockets. Een websocket is een interactieve verbinding tussen de client en de server waarbinnen beide partijen een request kan versturen en dit niet alleen maar bij de client ligt. Een websocket wordt geïnitieerd door een http request te upgraden naar een websocket met een zogeheten handshake. Hierdoor wordt de connectie omgezet naar een websocket. Hieronder een voorbeeld van een handshake request van de client en het bijbehorende antwoord van de server.

Als je websockets gaat gebruiken zijn er wel een aantal punten waar je op moet letten. De eerste is proxys, hier is wat extra aandacht nodig. Dit heeft te maken met het feit dat een websocket request geen headers bevat. De proxy probeert de header van het websocket request te lezen, kan dit niet en blokkeert dan het request. Er is wel een oplossing voor dit probleem, het gebruik van TLS/SSL. Hierdoor kan de proxy de headers van het reqeust niet lezen aangezien ze encrypted zouden zijn en laat de proxy het request wel door.

Daarnaast moet je rekening houden met het feit dat door een fout binnen de client of de server de connectie toch verloren kan gaan. Hierdoor moet er logica worde ingebouwd die hier rekening mee houdt en de websocket opnieuw opstart.

Als laatste moet er rekening gehouden worden met browser support, het kan zijn dat wat oudere browsers geen ondersteuning bieden voor websockets. Hier moet dan een fallback strategie worden gekozen, zoals het gebruik van long polling.


Andere blogartikelen

  • SQL: Geclusterde en niet-geclusterde index

    Geschreven door: op zondag 30 juni 2019

    Het kan soms voorkomen dat het veel tijd kost voordat een bepaalde query resultaten teruggeeft. Dit kan liggen aan een scala aan problemen, zoals het gebruik van veel joins. Wat de query kan helpen ve ...

    Bekijk het artikel »
  • Hoe werkt OAuth 2.0

    Geschreven door: op zondag 30 juni 2019

    In de huidige samenleving is iedereen bijna altijd online, zo ook de applicaties waarvan de mensen gebruik maken. Als je jouw applicatie niet goed afschermt, kan dit allemaal veiligheidsrisico’s met z ...

    Bekijk het artikel »
  • OAuth 2.0: JWT token en claims

    Geschreven door: op zondag 30 juni 2019

    In mijn vorige blog heb ik uitgelegd hoe OAuth 2.0 ervoor kan zorgen dat derde partijen op een veilige manier gebruik kunnen maken van jouw applicatie met behulp van tokens. In deze blog gaan we wat m ...

    Bekijk het artikel »
Bel 072 5345 888
Onze Middelen en Technologieën
microsoft silver partner
Adobe partner
fd-gazellen-2018.jpg
Google analytics
partners-logo.jpg
Op de hoogte blijven?

Meld u aan voor de gratis nieuwsbrief om op de hoogte te blijven van onze activiteiten