Server Sent Events, et côté client?

05 juin 2014

Tags : EventSource, javascript, Server-Sent-Events, SSE

Aujourd'hui, je vais vous parler de Server Sent Events côté client javascript.

Nous allons reprendre le serveur qui envoyait l'heure toutes les secondes codé ici.

L'utilisation d'un flux Server Sent Event se fait par l'intermédiaire de l'objet "EventSource" qui prend comme paramètre dans le constructeur l'url du flux. Cet objet possède une fonction "addEventListener" qui prend en paramètres le type de listener (message pour la réception de nouvelles données) ainsi que la callback.

Si vous êtes comme moi et que vous utilisez angular.js un peu partout, vous savez comment il peut s'avérer complexe de s'intégrer dans son dual binding, mais la méthode $scope.$apply est là pour ça!

Voici donc le résultat final :


Et voilà, c'est pas bien compliqué de faire du temps réel :)

Petit précision, EventSource n'est pas supporté par IE, mais il existe un contournement : github.com/Yaffle/EventSource

Commentaires

Server Sent Events réactifs avec SimpleWeb4j

04 juin 2014

Tags : EventSource, java8, reactive, Server-Sent-Events, SimpleWeb4j, SSE

Nous avons vu hier un exemple simple de Server Sent Events avec SimpleWeb4j, passons maintenant à plus complexe, un exemple dit "réactif", ce n'est pas le flux qui demande la valeur suivante, mais bien un "service" extérieure qui déclenche l'envoi à tous les flux ouverts.

Pour l'exemple, nous allons créer trois générateurs d'événements, avec chacun un délai aléatoire entre les événements.

Nous allons donc tout d'abord créer une classe "Event", cette classe contient un nom, une valeur et l'heure de création. La valeur est créée de manière aléatoire.

Nous allons ensuite créer un générateur, qui est un Runnable infini, et envoi des événements aux handlers SimpleWeb4j.

Un handler SimpleWeb4j est une classe fournie par SimpleWeb4j qui contient une méthode "next" permettant d'envoyer les événements. Nous stockerons ces handlers dans un ConcurrentHashSet pour pouvoir tous les adresser (et pas seulement le dernier flux créé.

Une fois tous ces composants créés, il suffit de déclarer la route, voici donc le résultat final :


J'espère vous avoir montré l'intérêt de SimpleWeb4j sur ce cas beaucoup moins simple que le précédent.

Si le sujet vous intéresse, vous pouvez regarder ma présentation donnée au Breizhcamp sur parleys :

Commentaires

Server Sent Events avec SimpleWeb4j

03 juin 2014

Tags : EventSource, java8, Server-Sent-Events, SimpleWeb4j, SSE

Je vous ai montré hier comment faire du SSE avec Jetty. Nous allons maintenant voir comment faire avec SimpleWeb4j.

L'exemple avec jetty était une horloge déclenchée toutes les secondes à partir de l'accès à l'url, voyons donc comment coder cela avec SimpleWeb4j : Simple, non?


Dans la vrai vie, on souhaite sans doute pouvoir déclencher simplement l'envoie d'un événement sans être dépendant d'un délai quelconque. Ce sera l'objet de l'article de demain :)

Commentaires

Server Sent Events avec Jetty

02 juin 2014

Tags : EventSource, java8, Jetty, Server-Sent-Events, SSE

Je vais aujourd'hui vous présenter comment faire du Server-Sent-Events (EventSource) avec Jetty.

C'est quoi

Si vous avez déjà lu w3c, passez au chapitre suivant :)

La technologie Server Sent Events (ou EventSource du nom de l'API javascripts) est une technologie permettant de faire du push du serveur vers le client en gardant une connexion ouverte.

Un des gros avantages selon moi de cette technologie est sa simplicité, c'est du texte sur HTTP. Chaque événement est préfixé de "data: ", et on met deux retours à la ligne pour séparer les événements (je simplifie un peu).


Comment je fait coté serveur avec Jetty

Le plus simple est encore de vous montrer le code :)


Demain, je vous montrerai que c'est quand même beaucoup plus simple d'utiliser SimpleWeb4j pour le faire :)

Commentaires