HTML5 - WebSockets                          T-111.5502 Seminar on Media Technology                                     Har...
Web communications                           before WebSockets                     •    HTTP protocol is based on request-...
Polling       • Client issues new HTTP       requests with some interval       • Server must respond even if no       new ...
Long polling       • Server holds requests until an       event occurs (data becomes       available, timeout, ...)       ...
HTTP Streaming       • Uses HTTP/1.1 persistent       connection feature       • Server sends new data as       partial re...
WebSocket                     •    Real-time, full-duplex communication                     •    Builds on top of HTTP    ...
http://html5.org/tools/web-apps-tracker   7Tuesday, October 25, 11
WebSocket handshake                Client requests connection upgrade                          GET /chat HTTP/1.1         ...
WebSocket API                                9Tuesday, October 25, 11
WebSocket Security                     • Old protocol versions (hixie-75, hixie-76 /                          hybi-00) sus...
WebSockets in use                     •     Unified way to real-time full-duplex communication                          - h...
References                     •    Loreto, et al., Bidirectional HTTP, Oct 2009                     •    Huang; Lin-Shung...
Demo                          http://localhost:8888/                                    13Tuesday, October 25, 11
Upcoming SlideShare
Loading in …5
×

HTML5 WebSockets

2,787 views
2,634 views

Published on

Introduction to WebSockets.

Seminar on Media Technology, Fall 2011

Published in: Technology
0 Comments
6 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,787
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
93
Comments
0
Likes
6
Embeds 0
No embeds

No notes for slide

HTML5 WebSockets

  1. 1. HTML5 - WebSockets T-111.5502 Seminar on Media Technology Harri Hämäläinen harri hamalainen aalto fiTuesday, October 25, 11
  2. 2. Web communications before WebSockets • HTTP protocol is based on request-response paradigm - In HTTP/0.9 and HTTP/1.0 the connection is closed after the response is received - In HTTP/1.1 the persistent connection was introduced which allows client to make multiple requests over the same underlying TCP session • Web 2.0 needed real-time communication i.e. low latency, full- duplex connections - Games, instant messaging, collaboration platforms • Various “solutions” used - AJAX, Comets, hackshacks... 2Tuesday, October 25, 11
  3. 3. Polling • Client issues new HTTP requests with some interval • Server must respond even if no new data is available Client Server Data available HTTP Request - Header overhead HTTP Response • Defining the interval requires Data available Data available heuristics • Latency issues - Server must wait new requests even if new data is already available 3Tuesday, October 25, 11
  4. 4. Long polling • Server holds requests until an event occurs (data becomes available, timeout, ...) Server • Client issues new requests Client HTTP Request Data available immediately when old ones are HTTP Response responded Timeout • Each request still needs HTTP headers resent Data available Data available 4Tuesday, October 25, 11
  5. 5. HTTP Streaming • Uses HTTP/1.1 persistent connection feature • Server sends new data as partial responds Server Client • Several intermediaries might Data available cause problems for real-time communication as traffic is Data available traditional HTTP Data available - proxies, caches, gateways • Still timeouts and need for new connections 5Tuesday, October 25, 11
  6. 6. WebSocket • Real-time, full-duplex communication • Builds on top of HTTP - Can share ports with basic HTTP(s) - HTTP session is Upgraded to WebSocket • URL Scheme uses ws:// and wss:// analogous to http:// and https:// • Messages are either UTF-8 text or binary data, no theoretical maximum for message length • Only small overhead for text messages (frames) after handshake: - 0x00 for frame start, 0xFF for frame end (compared to traditional HTTP handshake ~ 1K bytes) 6Tuesday, October 25, 11
  7. 7. http://html5.org/tools/web-apps-tracker 7Tuesday, October 25, 11
  8. 8. WebSocket handshake Client requests connection upgrade 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 Server responds HTTP/1.1 101 Switching Protocols Upgrade: websocket Connection: Upgrade Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo= Sec-WebSocket-Protocol: chat 8Tuesday, October 25, 11
  9. 9. WebSocket API 9Tuesday, October 25, 11
  10. 10. WebSocket Security • Old protocol versions (hixie-75, hixie-76 / hybi-00) susceptible for cache poisoning attacks due to transparent proxies [a] • Protocol allows origin policies a: Huang; Lin-Shung, et al., Talking Yourself for Fun and Profit 10Tuesday, October 25, 11
  11. 11. WebSockets in use • Unified way to real-time full-duplex communication - http://socket.io • P2P communication - http://browsersocket.org - Morris-Pearse, Michael.; A Secure P2P Server in the Web Browser • Online games, visualization - Chen, B. (2011). A Framework for Browser-based Multiplayer Online Games using WebGL and WebSocket. Architecture - Wessels, A., Purvis, M., Jackson, J., & Rahman, S. (Shawon). (2011). Remote Data Visualization through WebSockets 11Tuesday, October 25, 11
  12. 12. References • Loreto, et al., Bidirectional HTTP, Oct 2009 • Huang; Lin-Shung, et al., Talking Yourself for Fun and Profit • Hickson; Ian,The WebSocket API, http://dev.w3.org/html5/ websockets/ • HTML 5 Revision Tracker, http://html5.org/tools/web-apps-tracker • Morris-Pearse, Michael.; A Secure P2P Server in the Web Browser • Chen, B. (2011). A Framework for Browser-based Multiplayer Online Games using WebGL and WebSocket. Architecture • Wessels, A., Purvis, M., Jackson, J., & Rahman, S. (Shawon). (2011). Remote Data Visualization through WebSockets 12Tuesday, October 25, 11
  13. 13. Demo http://localhost:8888/ 13Tuesday, October 25, 11

×