@rich_cullen_75

Top 10 Real-Life WebSocket Use Cases & Experiences

Rich Cullen @rich_cullen_75 kaazing.org/blog kaazing.org

@rich_cullen_75

Top 10 Real-Life WebSocket Use Cases

•  A few quick demos

•  WebSocket technology background and design goals

•  More demos

•  Taking this to the next level – Connected Devices

•  Production and deployment concerns

•  Q&A

@YourTwitterHandle @rich_cullen_75

@rich_cullen_75

The Legacy Web

Browser

Half Duplex

Full duplex

Back-end server

Web

Web Tier Middleware

Legacy Web

@rich_cullen_75

The Shortcomings of HTTP •  Designed for transfer and retrieval of static documents

•  Extremely verbose

•  Stateless – context metadata needs to be provided, adding bloat

•  Half duplex

•  Client initiated Request/Response model

•  Only options for simulating “real-time” are essentially elegant hacks

•  Polling

•  Long Polling

•  AJAX

•  Comet

@rich_cullen_75

HTML5 WebSocket: TCP for the Web

Full duplex

•  Standard Protocol (IETF): RFC-6455

•  Standard API (W3C): JavaScript

•  Single socket, full-duplex

•  Low overhead: <1% HTTP

•  Low latency: low milliseconds

•  TLS/SSL support

@rich_cullen_75

The Benefits of WebSocket •  Designed as a web transport for higher level business protocols

•  Extremely compact and efficient on the wire

•  Only web transport to allow bi-directional communication over same TCP

connection

•  Full duplex - Provides low latency delivery of text and binary application data in

both directions

•  NOT a replacement for all HTTP “transactional” Request/Response communication

(e.g. make use of caching semantics of HTTP)

@rich_cullen_75

Interaction Patterns – The Web Before

HTTP is great for some applications…

Request/Response

Client-to-Server WS HTTP

✓ ✓

@rich_cullen_75

Interaction Patterns – The Web Now

Request/Response

Publish/Subscribe

Broadcast-only

Client-to-Server

Server-to-Client

…but extremely limited and restrictive!

WS HTTP

✓ ✓

WS HTTP

✓ ✗

WS HTTP

✓ ✗

WS HTTP

✓ ✗

WS HTTP

✓ ✗

WS HTTP

✓ ✗

@rich_cullen_75

The Event-Driven Web

Browser

Half Duplex

Full duplex

Back-end server

Web

Web Tier Middleware

Legacy Web

Event-Driven Web

Back-end server WebSocket Server

Web

WebSocket Full duplex

@rich_cullen_75

How Can I Use?

@rich_cullen_75

How Can I Use?

@rich_cullen_75

The WebSocket Handshake

@rich_cullen_75

Protocol Layering

TCP

Your application

XMPP IMAP/SMTP/POP3

@rich_cullen_75

Protocol Layering

TCP

Your application

XMPP IMAP/SMTP/POP3 HTTP

@rich_cullen_75

Protocol Layering

TCP

Your application

XMPP IMAP/SMTP/POP3 HTTP

WebSocket

@rich_cullen_75

WebSocket Clients and Server

@rich_cullen_75

Enterprise Messaging Extended to the Web

@YourTwitterHandle @rich_cullen_75

@rich_cullen_75

Auditing Demo Architecture

@rich_cullen_75

The Next Level

Bridging the Gap Between Hardware and Software

Connected Devices

@rich_cullen_75

Raspberry Pi

Image source: http://www.oracle.com/technetwork/articles/java/raspberrypi-1704896.html

Image source: http://www.oracle.com/technetwork/articles/java/raspberrypi-1704896.html

@rich_cullen_75

Demo Setup

@rich_cullen_75

Controlling the Light Remotely

Using Pub-Sub Over the Web

@rich_cullen_75

Light Switch: Range Extended to the Web

@YourTwitterHandle @rich_cullen_75

@rich_cullen_75

Web Remote Controlled Car Architecture

@rich_cullen_75

Telemetry Data Distributed to the Web Over Satellite Network

KWG  

Message Broker

JMS WS

JMS WS

@rich_cullen_75

Telemetry Data Distributed to the Web Over Satellite Network

KWG  

Message Broker

JMS WS

JMS WS

@rich_cullen_75

About the Quadcopter: DJI Phantom 2

@rich_cullen_75

The Sensor Stack

@rich_cullen_75

Arduino: GPS, thermometer, humidity, compass, accelerometer + Go Pro

@rich_cullen_75

Satellite Terminal: InmarSat – Geostationary Satellites

@rich_cullen_75

Satellite Terminal: InmarSat – Geostationary Satellites

Warning: Microwave radiation���Minimum safe distance: 0.6 metres

@rich_cullen_75

Telemetry Data Distributed to the Web Over Satellite Network

KWG  

Message Broker

JMS WS

JMS WS

Java App

@rich_cullen_75

KWG  

Message Broker

JMS WS

JMS WS

Java App

Telemetry Data Distributed to the Web Over Satellite Network

@YourTwitterHandle @rich_cullen_75

@rich_cullen_75

End-to-end latency: under 1 second

@YourTwitterHandle @rich_cullen_75

@rich_cullen_75

Connected Car Architecture •  ELM-327 microcontroller for translating OBD-II interface at car ECU port •  Bluetooth connectivity from ELM-327 to MacBook Pro •  USB GPS module on MacBook Pro •  jSSC (Java Simple Serial Connector) for Bluetooth and USB access •  GoPro camera mounted to windshield for video capture •  Java KAAZING Gateway client connected to Gateway for sending diagnostic data

inbound •  JavaScript KAAZING Gateway client in browser receiving data for the real-time

dashboard •  Google Maps in the top half of the dashboard •  Custom SVG in the bottom half of the dashboard

@rich_cullen_75

It’s More Than “Just” the Web

@rich_cullen_75

Connected Devices

@rich_cullen_75

Communicating with WebSocket

WS

WS

WS WS

WS

WS

WS

WS WS

@rich_cullen_75

Communicating with Proprietary Protocols over WebSocket

AMQP/WS

MQTT/WS

JMS/WS

STOMP/WS

XMPP/WS

@rich_cullen_75

Production Concerns

Clients disconnect

Network intermediaries

Locked down firewalls

Millions of users

High availability

Disaster recovery

Device battery life

Integration with existing

security infrastructure

@rich_cullen_75

DO IT! JUST…

Give WebSocket a try

@YourTwitterHandle #DVXFR14{session hashtag} @rich_cullen_75

Questions: https://wall-simple.sli.do/#/event/cmnxxfl0/section/15992/questions

@rich_cullen_75

Thanks for your time Learn more: •  WebSocket info and echo service: http://www.websocket.org/

•  KAAZING: http://kaazing.org/

•  KAAZING on GitHub: https://github.com/kaazing

•  Tutorials: http://tutorial.kaazing.com/

•  Apache ActiveMQ: http://activemq.apache.org/

•  RabbitMQ: https://www.rabbitmq.com/

•  Node.js: https://nodejs.org/

•  MongoDB: https://www.mongodb.org/