Your SlideShare is downloading. ×
0
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
WebSockets: The Real-Time Web, Delivered
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

WebSockets: The Real-Time Web, Delivered

3,805

Published on

A technical overview of the WebSockets protocol draft-09 and background on how we got to where we are today.

A technical overview of the WebSockets protocol draft-09 and background on how we got to where we are today.

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

No Downloads
Views
Total Views
3,805
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
43
Comments
0
Likes
2
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. WebSockets The Real-Time Web, Delivered July 23, 2011 Brian McKelvey Co-Founder - Worlize Inc. twitter - @theturtle32 www.worlize.comMonday, July 25, 11
  • 2. Whiteboard Demo • Get FireFox 7 Alpha • http://www.mozilla.com/firefox/channel/Monday, July 25, 11
  • 3. The Problem • No officially supported way to do real-time communications in the browser.Monday, July 25, 11
  • 4. Hacks, Hacks, Hacks • Polling • Long-polling • IFrame Streaming • HTMLFile (MSIE) • XHR-Multipart (Firefox)Monday, July 25, 11
  • 5. Diagram from http://publib.boulder.ibm.com/infocenter/wasinfo/v6r1/index.jsp?topic=/com.ibm.websphere.ajax.devguide.help/docs/PureAjax_pubsub_clients.htmlMonday, July 25, 11
  • 6. Diagram from http://publib.boulder.ibm.com/infocenter/wasinfo/v6r1/index.jsp?topic=/com.ibm.websphere.ajax.devguide.help/docs/PureAjax_pubsub_clients.htmlMonday, July 25, 11
  • 7. The Solution: WebSockets • Maintains a persistent bi-directional communications channel • Eliminates the need for hacksMonday, July 25, 11
  • 8. Why not TCP Sockets? • API Simplicity • TCP is a stream-oriented protocol • We want a message-oriented protocol • Security • Scan a Local Network • DDOS AttackMonday, July 25, 11
  • 9. WebSocket Drafts • Started at WhatWG • WhatWG Draft-75 (old browsers) • WhatWG Draft-76 (Chrome, Safari) • Moved to IETF • HyBi - HyperText Bi-directional Working Group • Draft-00 (Same as WhatWG Draft-76) • Draft-07 (FireFox 6 beta) • Draft-09 (FireFox 7 alpha)Monday, July 25, 11
  • 10. The Details: Handshake • Built on HTTP • Traverse existing proxies/intermediaries • Co-exist on same port with HTTP/HTTPS serverMonday, July 25, 11
  • 11. The Details: Handshake Client Request GET /chat HTTP/1.1 Connection: Upgrade Upgrade: websocket Sec-WebSocket-Version: 8 Sec-WebSocket-Key: reaiKXo+d4Hkqt45PNTlNg== Sec-WebSocket-Origin: http://piglet.worlize.com:8080 Sec-WebSocket-Protocol: superchat, boringchat Sec-WebSocket-Extensions: deflate-streamMonday, July 25, 11
  • 12. The Details: Handshake Server Response HTTP/1.1 101 Switching Protocols Connection: Upgrade Upgrade: websocket Sec-WebSocket-Accept: Iy0M3juCftp2uqk8/9fVWt4VfoI= Sec-WebSocket-Protocol: superchat Sec-WebSocket-Extensions: deflate-streamMonday, July 25, 11
  • 13. The Details: Handshake • Security • Cross-Origin handling via Sec-WebSocket-Origin • Sec-WebSocket-Key Validation • Prevent cross-protocol attacks • Fail early if a dumb intermediary provides a cached response. • Sec- headers prevent XHR from being used to contact a WebSocket serverMonday, July 25, 11
  • 14. The Details: Masking • Most contentious issue in the HyBi Working Group. • All client-to-server messages are masked. • Why is this necessary? • Prevent cache-poisoning attacks • Prevent talking to overly permissive servers • Concern over this issue caused some browser vendors to pull support for WebSockets draft-76.Monday, July 25, 11
  • 15. The Details: Masking • How does it work? • Randomly generated four-byte mask key per frame • Applied using XOR to frame payload • Reduces compression efficiency for client-to-server messagesMonday, July 25, 11
  • 16. The Details: Framing • Simple framing protocol facilitates message oriented API • 2 to 10 bytes for frame header • Contains flags, opcode, and payload length • Payload length is a variable length field.Monday, July 25, 11
  • 17. The Details: Framing • Data frame types: • Control frame types: • Binary Message • Ping • UTF-8 Text Message • Pong • Continuation • Close (fragmentation)Monday, July 25, 11
  • 18. The Details: Framing • Fragmentation • Allows control frames in the middle of a long message • In coordination with a future extension can facilitate multiplexing.Monday, July 25, 11
  • 19. Basic Frame Header Frames less than 126 bytes 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 R R R F M S S S I OPCODE S 7-BIT LENGTH V V V N K 1 2 3 Byte 1 Byte 2Monday, July 25, 11
  • 20. Medium Frame Header >= 126 bytes && < 65535 bytes 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 R R R F M S S S Static Value "126" Indicating I OPCODE S V V V 16-bit length N K 1 2 3 Byte 1 Byte 2 16-BIT LENGTH (BIG-ENDIAN UNSIGNED SHORT) Byte 3 Byte 4Monday, July 25, 11
  • 21. Long Frame Header > 65535 bytes 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 R R R F M S S S Static Value "127" Indicating I OPCODE S V V V 63-bit length N K 1 2 3 Byte 1 Byte 2 0 63-BIT LENGTH (BIG-ENDIAN UNSIGNED) 63-BIT LENGTH (Continued) 63-BIT LENGTH (Continued) 63-BIT LENGTH (Continued)Monday, July 25, 11
  • 22. Server Implementations • Node.JS: WebSocket-Node • https://github.com/Worlize/WebSocket-Node • ANSI C: libwebsockets • http://git.warmcat.com/cgi-bin/cgit/libwebsockets/ • Java: Jetty • http://webtide.intalio.com/2011/04/getting-started-with-websockets/Monday, July 25, 11
  • 23. Client Implementations • Node.JS: WebSocket-Node • https://github.com/Worlize/WebSocket-Node • ActionScript 3: AS3WebSocket • https://github.com/Worlize/AS3WebSocket • ANSI C: libwebsockets • http://git.warmcat.com/cgi-bin/cgit/libwebsockets/Monday, July 25, 11
  • 24. Demo Shared Whiteboard Example • Available in the ‘examples’ folder of: https://github.com/Worlize/WebSocket-Node Requires FireFox 7 Alpha!Monday, July 25, 11

×