jsf meets websockets

34
WebSocket meets JSF 2.0 Matthias Weßendorf - Oracle

Upload: mwessendorf

Post on 10-May-2015

8.039 views

Category:

Technology


1 download

TRANSCRIPT

Page 1: Jsf meets websockets

WebSocket meets JSF 2.0

Matthias Weßendorf - Oracle

Page 2: Jsf meets websockets

Matthias Weßendorf• Oracle

• Apache Software Foundation– Member

– PMC Chair (Apache MyFaces)

• Speaker

• Author

• matthiaswessendorf.wordpress.com

• @mwessendorf

Page 3: Jsf meets websockets

Agenda• Real Time (Web)

– Introduction– Why not Bayeux

• JavaServer Faces 2.0– Highlights

• WebSocket– Client API– (Java) Server APIs

• Mixing JSF and WebSocket– Concepts and Demos

Page 4: Jsf meets websockets

Agenda• Real Time (Web)

– Introduction– Why not Bayeux

• JavaServer Faces 2.0– Highlights

• WebSocket– Client API– (Java) Server APIs

• Mixing JSF and WebSocket– Concepts and Demos

Page 5: Jsf meets websockets

Real Time (Web)

Page 6: Jsf meets websockets

Real Time (Web)• collaborative tooling:

Push the data...!

Page 7: Jsf meets websockets

Real Time (Web)• Every application has a hook...

– collaborative tooling • sharing documents• chat

– streaming data ( football/soccer, ...)

– trading systems ( auctions)

– live reporting

– monitoring ( server console)

– What is YOUR use-case ?

Page 8: Jsf meets websockets

What the Bayeux ???• Not a real internet standard (IETF / W3C)

• Some (Java) Servers:

– Jetty

– Tomcat

– Glassfish / Grizzly

– Weblogic (HTTP Publish-Subscribe Server)

• JavaScript Client libraries:

– Dojo

– jQuery

• Issues

– No unified API (like via JCP)

– ALL impls have different APIs (packages,...)

Page 9: Jsf meets websockets

Agenda• Real Time (Web)

– Introduction– Why not Bayeux

• JavaServer Faces 2.0– Highlights

• WebSocket– Client API– (Java) Server APIs

• Mixing JSF and WebSocket– Concepts and Demos

Page 10: Jsf meets websockets

JSF 2.0 – Special Feature• What's new ?

– Ajax integration

– Facelets is the Default VIEW

– Bookmarkable Pages(View Params)

– Partial State Saving

– ProjectStage (like Wicket / Rails)

– ExceptionHandler

– ...

Page 11: Jsf meets websockets

ProjectStage

Page 12: Jsf meets websockets

JSF 2.0 – Special Feature• What's better ?

• Facelets is KING !!!

– Templating

– Composite components

• Improved scoping

– Flash

– ViewScope

– „MyCustomScope“

• XML-less

Page 13: Jsf meets websockets

JSF 2.0 – Special Feature• less is more...

• @nnotations for managed beans

– javax.faces.beans.*

– (optional API)

• Simple navigation (w/o XML)

– <h:command(Link|Button) />

– New <h:button/>, <h:link />

• More @nnotations for less XML

– @FacesComponent, etc

Page 14: Jsf meets websockets

JSF 2.0 – Special Feature

Page 15: Jsf meets websockets

Pro Tip on JSF2 ...

• Do NOT use the @nnotations from:

– javax.faces.beans.*

• Go with JSR-299/330

– @Named(„fooBean“)

– @RequestScoped

• Even works with Spring...

http://github.com/matzew/spring-cdi-bridge

Page 16: Jsf meets websockets

Agenda• Real Time (Web)

– Introduction– Why not Bayeux

• JavaServer Faces 2.0– Highlights

• WebSocket– Client API– (Java) Server APIs

• Mixing JSF and WebSocket– Concepts and Demos

Page 17: Jsf meets websockets

WebSocket...

... is a bi-directional AND full-duplex communication STANDARD

for next-generation web applications

(„TCP for the web“)

Page 18: Jsf meets websockets

… and HTML5 APIs

Page 19: Jsf meets websockets

WebSocket Standard

• Client API (WC3)– (simple) JavaScript API

• Network Protocol (ITEF)– Still under development...:– draft-hixie-thewebsocketprotocol-75

– ...

– draft-ietf-hybi-thewebsocketprotocol-03

– http://blog.chromium.org/2010/06/websocket-protocol-updated.html

Page 20: Jsf meets websockets

WebSocket ProtocolGET / HTTP/1.1.

Upgrade: WebSocket.

Connection: Upgrade.

Host: echo.websockets.org.

...

HTTP/1.1 101 Web Socket Protocol Handshake.

Upgrade: WebSocket.

Connection: Upgrade.

Sec­WebSocket­Location: ws://echo.websockets.org/.

Server: Kaazing Gateway.

....

Page 21: Jsf meets websockets

WebSocket vs COMET...

Page 22: Jsf meets websockets

WebSocket Client APIws = new WebSocket("ws://echo.websockets.org:80");

ws.onmessage = function(event)

{

  doSomeFancyDhtml(event.data);

};

ws.onopen = function(event)

{...};

ws.onclose = function(event)

{...};

ws.onerror = function(event)

{...};

ws.send('Howdy, Partner!');

ws.close();

Page 23: Jsf meets websockets

WebSocket - Support• Browser:

– Firefox 4 (in beta status)

– Chrome / Chromium

– (mobile) Safari

– Opera

• Server

– Node.js

– Kaazing Gateway

– Jetty 7 and 8

– Glassfish 3.1

– Resin

– ...

Page 24: Jsf meets websockets

WebSocket – Jetty

public class JettyWebSocketServlet extends WebSocketServlet

{

private final Set<WebSocket> clients = ...           new CopyOnWriteArraySet();

  protected WebSocket doWebSocketConnect(HttpServletRequest request, String protocol)

  {

    return new MyWebSocket();

  }

...

}

Page 25: Jsf meets websockets

WebSocket – Resinpublic class ResinWebSocketServlet extends GenericServlet

{public void service(ServletRequest req, ServletResponse res)

    throws IOException, ServletException

  {

    WebSocketServletRequest wsReq = (WebSocketServletRequest) req;

 WebSocketListener handler = new CustomHandler();

    wsReq.startWebSocket(handler);

  }

}

Page 26: Jsf meets websockets

WebSocket – Glassfish 3.1import java.io.IOException;

import com.sun.grizzly.websockets.*;

public class EchoWebSocketApp extends WebSocketApplication

{

  public void onMessage(WebSocket socket, DataFrame data) throws IOException

  {

    socket.send(data.getTextPayload());

  }

}

Page 27: Jsf meets websockets

WebSocket – Glassfish 3.1public class BackEndWrapper extends WebSocketApplication

{

  @Inject Service myService;

  public void onMessage(WebSocket socket, DataFrame data) throws IOException

  {

    ServiceWebSocket sws =               (ServiceWebSocket) socket;

    myService.doInvokeTheBackend(sws.getFooBar());

    ....

  }

  ...

}

Page 28: Jsf meets websockets

WebSocket – Java EE

WebSocket Supportin

JavaEE 7 ?

Page 29: Jsf meets websockets

Agenda• Real Time (Web)

– Introduction– Why not Bayeux

• JavaServer Faces 2.0– Highlights

• WebSocket– Client API– (Java) Server APIs

• Mixing JSF and WebSocket– Concepts and Demos

Page 30: Jsf meets websockets

WebSocket meets JSF• JSF integration points:

– Streaming data to the client

• JSF Components– existing ones– custom ones

– Communication from the browser:

• JSF actions 'talk' to (active) system– „Invoke Application“ Phase

Page 31: Jsf meets websockets

JSF's Action methods• Set up the WebSocket connection:

– global (framework level)

– Custom tag (page level)

• Use JSF lifecycle to issue regular HTTP POST

– 'invoke application interaction'• do regular work• Notify the WS 'channel'

• Client-Side callback gets the server-side payload

Page 32: Jsf meets websockets

WebSocket „components“• Write WebSocket aware components:

– Let the component set up the connection

– leverage WS's onmessage() callback

– Make custom JSF/WS models

• What to do with existing components/pages?

– 1) remove the „refresh“ button :-)

– 2) let the framework notify the 'channel'

– 3) use JSF's Ajax API to rerender the comp.

Page 33: Jsf meets websockets

Thoughts...• Client's send() is outside of HTTP

• current systems are HTTP based:

– JAX-RS

– JavaServer Faces

– Apache Wicket, etc

• Atmosphere Framework works with all of them, but

• what about something like this ?

<h:commandButton value=“Send stuff“ action=“#{bean.doStuff}“>

<f:ajax .... />

</h:commandButton>

Page 34: Jsf meets websockets

Thank you!

@mwessendorf

BLOG:matthiaswessendorf.wordpress.com