Your SlideShare is downloading. ×
  • Like
Getting Started with WebSockets and Server-Sent Events
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Getting Started with WebSockets and Server-Sent Events

  • 7,007 views
Published

 

Published in Technology , News & Politics
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
7,007
On SlideShare
0
From Embeds
0
Number of Embeds
16

Actions

Shares
Downloads
92
Comments
0
Likes
8

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Getting Started with WebSocket and Server-Sent Event in Java Arun Gupta Director, Developer Advocacy, Red Hat blog.arungupta.me, @arungupta 1Copyright © 2013, Oracle and/or its affiliates. All rights reserved. Insert Picture Here
  • 2. Program Agenda  WebSocket Primer  Getting Started with WebSocket  Server-Sent Event Primer  Getting Started with Server-Sent Event  Resources 2 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 3. Interactive Web Sites HTTP is half-duplex HTTP is verbose Hacks for Server Push ● Polling ● Long Polling ● Comet/Ajax Complex, Inefficient, Wasteful 3 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 4. WebSocket to the Rescue TCP based, bi-directional, full-duplex messaging Originally proposed as part of HTML5 IETF-defined Protocol: RFC 6455 ● Handshake ● Data Transfer W3C defined JavaScript API Candidate Recommendation 4 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 5. Establish a connection Handshake Request Client Server Handshake Response 5 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 6. Handshake Request GET /chat HTTP/1.1 Host: server.example.com Upgrade: websocket Connection: Upgrade Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ== Origin: http://example.com Sec-WebSocket-Protocol: chat, superchat Sec-WebSocket-Version: 13 6 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 7. Handshake Response HTTP/1.1 101 Switching Protocols Upgrade: websocket Connection: Upgrade Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo= Sec-WebSocket-Protocol: chat 7 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 8. Establishing a Connection Handshake Request Client Server Handshake Response Connected ! 8 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 9. WebSocket Lifecycle Connected ! open Peer (client) open message message message message error message close Disconnected 9 Copyright © 2013, Oracle and/or its affiliates. All rights reserved. Peer (server)
  • 10. WebSocket API www.w3.org/TR/websockets/ 10 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 11. Browser Support 11 Copyright © 2013, Oracle and/or its affiliates. All rights reserved. http://caniuse.com/websockets
  • 12. 12 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 13. Java API for WebSocket Features API for WebSocket Server/Client Endpoints ● Annotated (@ServerEndpoint, @ClientEndpoint) ● Programmatic (Endpoint) ● WebSocket opening handshake negotiation Lifecycle callback handlers Packaging with Java EE applications 13 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 14. Annotated Endpoint import javax.websocket.*; @ServerEndpoint("/hello") public class HelloBean { @OnMessage public String sayHello(String name) { return “Hello “ + name; } } 14 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 15. Annotations Annotation Level Purpose @ServerEndpoint class Turns a POJO into a WebSocket Endpoint @ClientEndpoint class POJO wants to act as client @OnMessage @PathParam method Intercepts WebSocket Message events method Flags a matched path segment of a URI-template parameter @OnOpen Intercepts WebSocket Open events @OnClose method Intercepts WebSocket Close events @OnError 15 method method Intercepts errors during a conversation Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 16. @ServerEndpoint Attributes value decoders list of message decoder classnames encoders list of message encoder classnames subprotocols 16 Relative URI or URI template e.g. “/hello” or “/chat/{subscriber-level}” list of the names of the supported subprotocols Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 17. Custom Payloads @ServerEndpoint( value="/hello", encoders={MyMessage.class}, decoders={MyMessage.class} ) public class MyEndpoint { . . . } 17 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 18. Custom Payloads – Text public class MyMessage implements Decoder.Text<MyMessage>, Encoder.Text<MyMessage> { private JsonObject jsonObject; public MyMessage decode(String s) { jsonObject = Json.createReader(new StringReader(s)).readObject(); return this; } public boolean willDecode(String string) { return true; // Only if can process the payload } public String encode(MyMessage myMessage) { return myMessage.jsonObject.toString(); } } 18 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 19. Custom Payloads – Binary public class MyMessage implements Decoder.Binary<MyMessage>, Encoder.Binary<MyMessage> { public MyMessage decode(byte[] bytes) { . . . return this; } public boolean willDecode(byte[] bytes) { . . . return true; // Only if can process the payload } public byte[] encode(MyMessage myMessage) { . . . } } 19 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 20. Which methods can be @OnMessage ? Exactly one of the following ● Text: String, Java primitive or equivalent class, String and boolean, Reader, any type for which there is a decoder ● Binary: byte[], ByteBuffer, byte[] and boolean, ByteBuffer and boolean, InptuStream, any type for which there is a decoder ● Pong messages: PongMessage An optional Session parameter 0..n String parameters annotated with @PathParam Return type: String, byte[], ByteBuffer, Java primitive or class equivalent or any type for which there is a encoder 20 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 21. Sample Messages void m(String s); void m(Float f, @PathParam(“id”)int id); Product m(Reader reader, Session s); void m(byte[] b); or void m(ByteBuffer b); Book m(int i, Session s, @PathParam(“isbn”)String isbn, @PathParam(“store”)String store); 21 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 22. Chat Server @ServerEndpoint("/chat") public class ChatBean { static Set<Session> peers = Collections.synchronizedSet(…); @OnOpen public void onOpen(Session peer) { peers.add(peer); } @OnClose public void onClose(Session peer) { peers.remove(peer); } . . . 22 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 23. Chat Server . . . @OnMessage public void message(String message, Session client) { for (Session peer : peers) { peer.getBasicRemote().sendObject(message); } } } 23 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 24. https://blogs.oracle.com/arungupta/entry/collaborative_whiteboard_using_websocket_in 24Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 25. WebSocket Client @ClientEndpoint public class HelloClient { @OnMessage public void message(String message, Session session) { // process message from server } } WebSocketContainer c = ContainerProvider.getWebSocketContainer(); c.connectToServer(HelloClient.class, “hello”); 25 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 26. Programmatic Endpoint public class MyEndpoint extends Endpoint { @Override public void onOpen(Session session) { session.addMessageHandler(new MessageHandler.Text() { public void onMessage(String name) { try { session.getBasicRemote().sendText(“Hello “ + name); } catch (IOException ex) { } } }); } } 26 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 27. How to view WebSocket messages ? Capture traffic on loopback 27 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 28. How to view WebSocket messages ? chrome://net-internals -> Sockets -> View live sockets 28 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 29. Server-Sent Events Part of HTML5 Specification Server-push notifications Cross-browser JavaScript API: EventSource Message callbacks MIME type: text/eventstream 29 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 30. EventSource API dev.w3.org/html5/eventsource/ 30 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 31. Server-Sent Events Example Client-side var url = ‘webresources/items/events’; var source = new EventSource(url); source.onmessage = function (event) { console.log(event.data); } source.addEventListener(“size”, function(event) { console.log(event.name + ‘ ‘ + event.data); } 31 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 32. Server-Sent Events Example private final SseBroadcaster BROADCASTER = new SseBroadcaster(); @GET @Path("events”) @Produces(SseFeature.SERVER_SENT_EVENTS) public EventOutput fruitEvents() { final EventOutput eventOutput = new EventOutput(); BROADCASTER.add(eventOutput); return eventOutput; } 32 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 33. Server-Sent Events Example @POST @Consumes(MediaType.APPLICATION_FORM_URLENCODED) public void addFruit(@FormParam("fruit")String fruit) { FRUITS.add(fruit); // Broadcasting an un-named event with the name of the newly added item in data BROADCASTER.broadcast(new OutboundEvent.Builder().data(String.class, fruit).build()); // Broadcasting a named "add" event with the current size of the items collection in data BROADCASTER.broadcast(new OutboundEvent.Builder().name("size").data(Integer.class, FRUITS.size()).build()); } 33 Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 34. WebSocket and Server-Sent Event Competing technologies ? WebSocket Over a custom protocol Over simple HTTP Full Duplex, Bi-directional Server-Push Only, Client->Server is out-of-band (higher latency) Native support in most browsers Can be poly-filled to backport Not straight forward protocol 34 Server-Sent Event Simpler protocol Copyright © 2013, Oracle and/or its affiliates. All rights reserved.
  • 35. WebSocket and Server-Sent Event Competing technologies ? WebSocket Pre-defined message handlers Arbitrary events Application-specific Built-in support for re-connection and event id Require server and/or proxy configurations No server or proxy changes required ArrayBuffer and Blob 35 Server-Sent Event No support for binary types Copyright © 2013, Oracle and/or its affiliates. All rights reserved.