Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

HTML5 WebSocket in Essence

HTML5 WebSocket defines a bi-directional, full-duplex communication channel operates through a single TCP connection, this article discusses its fantastic performance, the WebSocket protocol principle and its handshake mechanism, and develop a WebSoc
by

Wayne Ye

on 8 June 2013

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of HTML5 WebSocket in Essence

Wayne's Geek Life http://WayneYe.com


Weibo: @wayneyedotcom Test Introduction HTML5 WebSocket In Essence -- Infinite passion on programming! Brand New protocol - WebSocket

TCP based

Full duplex, bi-directional

Connected by regular HTTP Background Comet (A.K.A Ajax push) hidden iframe

XHR polling

<script> tag long polling

Other "tricky" ways... WebSocket API hidden iframe



XHR polling



<script> tag long polling Embeds a hidden iframe, the page within it keeps receiving chunked HTTP response from server, so it is also called "forever frame". Recursively fire Ajax call to the server to send/receive data. Dynamicallt creates <script> tag to execute JavaScript code or JSONP. WebSocket Protocol draft-ietf-hybi-thewebsocketprotocol-10 Request
GET /demo HTTP/1.1
Host: example.com
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: V2ViU29ja2V0IHJvY2tzIQ==
Sec-WebSocket-Origin: http://example.com
Sec-WebSocket-Protocol: chat, superchat
Sec-WebSocket-Version: 8

Response
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: VAuGgaNDB/reVQpGfDF8KXeZx5o=
Sec-WebSocket-Protocol: chat Handshake JavaScript Sample Code Browser Support Resources WebSocket.org -- A WebSocket Community
http://websocket.org

Wikipedia: Web Socket
http://en.wikipedia.org/wiki/WebSockets

The Web Socket Protocol - IETF
http://tools.ietf.org/html/draft-ietf-hybi-thewebsocketprotocol-10

The WebSocket API
http://www.w3.org/TR/websockets/

Web Applications 1.0 - Web sockets
http://www.whatwg.org/specs/web-apps/current-work/complete/network.html#network

Introducing Web Sockets
http://dev.opera.com/articles/view/introducing-web-sockets/

WebSockets - MDC Docs
https://developer.mozilla.org/en/WebSockets

Stackoverflow - What are good resources for learning HTML 5 WebSockets?
http://stackoverflow.com/questions/4262543/what-are-good-resources-for-learning-html-5-websockets

HTML Labs - WebSocket
http://html5labs.interoperabilitybridges.com/prototypes/websockets/websockets/info

Start using HTML5 WebSocket today
http://net.tutsplus.com/tutorials/javascript-ajax/start-using-html5-websockets-today/

HTML 5 Web Sockets vs. Comet and Ajax
http://www.infoq.com/news/2008/12/websockets-vs-comet-ajax

Internet Socket
http://en.wikipedia.org/wiki/Internet_socket

Real-time web test – does html5 websockets work for you?
http://websocketstest.com/

HTML5 Web Socket in Essence
http://www.codeproject.com/KB/HTML/Web-Socket-in-Essence.aspx Happy WebSocketing^_^

Q&A Open issues Proxy Cache Poison attack

Fixed in draft-ietf-hybi-thewebsocketprotocol-07 Wayne Ye
HP-PSG-CS Tech Lead
Full transcript