SSE – le Streaming Simple et Efficace, sans WebSocket

View Github Repository Open presentation in a new window

alexvictoor

See all presentation from alexvictoor

SSE – le Streaming Simple et Efficace, sans WebSocket

0 0

devoxxfr-sse

On Github alexvictoor / devoxxfr-sse

SSE

le Streaming Simple et Efficace, sans WebSocket

MYSELF

Alexandre Victoor Architecte à la SGCIB alexvictoor@gmail.com https://github.com/alexvictoor @alex_victoor

websocket ? pourquoi - bi directionnel, jsr356, websocket pas du HTTP et ça ça complique les choses pour la plupart des besoins il y a une solution plus simple - et donc potentiellement plus robuste en prod SSE ou EventSource

long polling

le streaming à l'ancienne

websocket

standardisé avec HTML5 - handshake en HTTP et ensuite protocol au dessus de TCP

Server Sent Event

standardisé aussi avec HTML5 - repose entièrement sur HTTP, la grosse difference avec le long polling c'est que là l'essentiel du travail est fait par le navigateur

request

GET /mystream HTTP/1.1
Host: localhost
Accept: text/event-stream

response

HTTP/1.1 200 OK
Connection: keep-alive
Content-Type: text/event-stream
Transfer-Encoding: chunked
 
 
 
 
 
 
 
 
 

response

HTTP/1.1 200 OK
Connection: keep-alive
Content-Type: text/event-stream
Transfer-Encoding: chunked

data: un premier événement, du txt ou n'importe quoi
 
 
 
 
 
 
 

response

HTTP/1.1 200 OK
Connection: keep-alive
Content-Type: text/event-stream
Transfer-Encoding: chunked

data: un premier événement, du txt ou n'importe quoi

data: un deuxième
data: sur
data: plusieurs
data: lignes
 
 

response

HTTP/1.1 200 OK
Connection: keep-alive
Content-Type: text/event-stream
Transfer-Encoding: chunked

data: un premier événement, du txt ou n'importe quoi

data: un deuxième
data: sur
data: plusieurs
data: lignes

data: {"msg": "un troisieme en json"}

En JS ?

		var source = new EventSource("http://localhost:8081/stream");
source.onmessage = function(event) {
    // console.log(event.data);
};
Une api similaire à ce que l'on en websocket

metadata

id: 123
event: TaskCompleted
data: avec un id (123)
data: et un type (TaskCompleted)

et en JS...

		var source = new EventSource("http://localhost:8081/stream");
source.addEventListener("TaskCompleted", function (event) {
    // console.error(event.data);
});
Une api similaire à ce que l'on en websocket
le navigateur essaye de se reconnecter tout seul

Recovery

id: 123
data: dernier événement reçu

===== coupure =====
 
 
 
 
 
tout est fait dans le navigateur

Recovery

id: 123
data: dernier événement reçu

===== coupure =====

GET /mystream HTTP/1.1
Host: localhost
Accept: text/event-stream
Last-Event-ID: 123
tout est fait dans le navigateur

retry delay

HTTP/1.1 200 OK
Connection: keep-alive
Content-Type: text/event-stream
Transfer-Encoding: chunked

retry: 5000

data: { ... }

Browsers

très bon support -on peut visualiser les événements qui arrivent

... et "browsers"

Ca marche pas - heureusement des polyfills.

Implems en Java

  • Jetty
  • Spring
  • Undertow
  • Jersey
  • RxNetty
  • ...
pas de jsr mais un paquet d'outils

Jersey

		
@GET
@Produces(SseFeature.SERVER_SENT_EVENTS)
public EventOutput getMyStream() {
  EventOutput eventOutput = new EventOutput();
  // ...
  return eventOutput
}


eventOutput.write(event);

Des limitations ?

mono directionnel pas de binaire pas de détection auto de perte de connectio cote serveur pas de surcharge de header cote js

DEMO

un exemple d'utilidation pour finir

WEB logback

un exemple d'utilidation pour finir

QUESTIONS

SSE le Streaming Simple et Efficace, sans WebSocket