Extending JMS over the Web with HTML5 WebSocket€¦ · • Quick Overview of HTML5 • What is a WebSocket? • Very Quick Review of JMS • Extending JMS over the Web • How to

1! Copyright © 2012 – Kaazing Corporation

Extending JMS over the Web with HTML5 WebSocket


What we are going to cover…

• Quick Overview of HTML5 • What is a WebSocket? • Very Quick Review of JMS • Extending JMS over the Web • How to Become Famous, Gain Wealth, Have 1M+ FB Friends and be an Overall AwesomePerson™


First of all…

Overview of HTML5


•  Focused on Web Applications

•  Web apps are rapidly becoming first class apps, on par with desktop and native apps

•  Collection of Technologies

•  Not just an upgrade to HTML4

What is “HTML5”?


Why HTML5?

•  Users are Demanding more from Apps •  UI/UX Requirements are more sophisticated •  API Explosion •  Browser Enhancements •  The Web is No Longer Just About Documents but the

Existing Infrastructure Reflects this Legacy

•  HTML5 is the next Phase of the Web •  “HTML5” is a Programmatic Foundation for Apps •  Collection of Technologies


HTML5 Feature Areas


Connectivity Features

•  Cross Document Messaging •  XMLHttpRequest Level 2 •  Server-Sent Events •  WebSocket •  CORS


New Technology

What is a WebSocket?


Legacy Web Stack

•  Designed to serve static documents •  HTTP •  Half duplex communication

•  High latency •  Bandwidth intensive

•  HTTP header traffic approx. 800 to 2000 bytes overhead per request/response

•  Complex architecture •  Not changed since the 90’s •  Plug-ins •  Polling / long polling •  Legacy application servers

•  Expensive to scale applications Half duplex Full duplex

10! Copyright © 2012 – Kaazing Corporation 4/20/12 10

Protocol mismatches… Inefficient…

Scalability Issues…

Latency Issues…

Middleware for the Middleware…


Scalability

Growth

Complexity

Simple stuff scales… Complexity doesn’t

Greco’s Law!Scalability = Growth / Complexity


•  Designed for document transfer •  Resource addressing •  Request / Response interaction •  Caching

•  Bidirectional, but half-duplex •  Traffic flows in only one direction at a time

•  Stateless •  Header (metadata) info resent for each request

HTTP Characteristics


WebSocket

•  New W3C API and IETF Protocol for low-latency, real-time, bi-directional connections

•  RFC 6455 – Dec 2011 •  Easily add event-based data to web applications •  Avoids polling •  Avoids HTTP meta-data overhead


WebSocket

•  Includes W3C API and IETF Protocol (RFC 6455) •  Event-driven JavaScript API •  Full-duplex communication protocol

•  Integrates HTTP addressing •  ws://yourcompany.com:80/tcp-for-the-web •  wss://anothercompany.com/marketdata_svc

•  Traverses firewalls, proxies, routers •  Leverages Cross-Origin Resource Sharing (CORS)

•  http://www.w3.org/TR/access-control/

•  Allows unlimited connections per Origin


Living Web Stack

•  Designed for full-duplex high performance transactional Web •  HTTP & HTML5 WebSocket •  Full duplex communication

•  Lower latency •  Reduced bandwidth •  Simplified architecture •  Massive scalability

Half duplex Full duplex


WebSocket Handshake


WebSocket Frames

•  Frames have a few header bytes •  Data may be text or binary •  Frames from client to server are masked

(XORed w/ random value) to avoid confusing proxies


Stuff we should know already

Oh yeah… JMS


Java Messaging Service

•  Message Oriented Middleware •  Part of Java EE •  JMS 1.0 2001, JMS 1.1 2002, JMS 2.0 2013

(projected) •  Asynchronous Messaging vs RPC •  Loosely coupled vs Tightly coupled •  Pub/Sub, Topics, Queues •  Transactions, Reliable


Basic JMS

conn = createConnection(); sess = conn.createSession(); topic = jndiContext.lookup(topic); pub = sess.createProducer(topic);

pub.send(“hey frank”);

conn = createConnection(); sess = conn.createSession(); topic = jndiContext.lookup(topic); sub = sess.createConsumer(topic); sub.setMessageListener(this); … public void onMessage(Message m) { String s = m.getText(); … do stuff… }



msg broker


The Cool Part of Frank’s talk

Extending JMS over

the Web


WebSocket

TCP

JMS XMPP AMQP B2B FTP VNC mktdata etc

Browser and Native Applications

WebSocket Server

Internet

WebSocket Server

Protocol Layering


Back-end server

Browser

WebSocket

JMS Over WebSocket


Back-end server

Browser

WebSocket

JMS Over WebSocket

JMS

Back-end server

Browser

WebSocket


J2EE Applica+on Server

Why JMS over WebSocket?

Message Broker (JMS Provider)

JMS Web Container

SOAP over HTTP Web

Service

JSP

Firewall

Typical Current JMS Architecture

HTTP

JMS Over WebSocket

Firewall

EJB Container

EJB

WEB

New WebSocket-based Architecture


Server Support – JMS or WS

•  Kaazing WebSocket Gateway •  ActiveMQ •  Apache mod_pywebsocket •  Jetty •  phpwebsockets •  web-socket-ruby •  Yaws (Erlang) •  Node.js •  And more…


Web Applications Now Change

Now we have reliable, secure real-time communications.

Not just broadcast (simple push), but bidirectional

communications for mobile and the desktop.

Examples: •  Financial Services •  Ecommerce, Retail •  Multi-player Gaming

•  Telecom •  Embedded Devices •  IPtv, cars, entertainment,

collaboration, et al…


Copyright © 2010, Kaazing Corporation,. All rights reserved.

Kaazing Internals

WebSocket Gateway

•  async IO •  we don’t hold on to objects •  minimize latency •  minimal threading/GC •  staged event-driven arch •  JAAS, SSO, Kerberos, etc…

JMS ws

JMS

JMS

JMS

JMS

JMS


Virtual Private Connection

Client and Server are now proxied over the web with no code changes


Net

Msg Broker

Pricing Feeds

News/Alerts

Trade Exec

Reports

Mobile Browser/Native Client

Desktop Java/.NET

Browser Javascript/Flash/Java/Silverlight

Kaazing Gateway Cluster + Load Balancer

JMS, AMQP,

etc

Authentication Authorization

Other TCP/UDP protocols

Trading Services Architecture


Possibilities…

•  Financial and trading apps •  Online gaming and live auctions •  BigData analytics •  Performance and monitoring dashboards •  RFID and GPS Tracking •  Sports and news broadcasting applications •  Supply chain and inventory management •  Transportation logistics •  Smart meters, embedded •  Next generation web application of your

choice!


Financial Apps

http://demo.kaazing.com/portfolio

http://demo.kaazing.com/forex


Gaming

http://code.google.com/p/quake2-gwt-port


Data Acquisition

http://bergmans.com/downloads.html

LabSocket Extend LabVIEW applications to the browser