Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Hao-kang Den @_hden
Socket.io under the hood
Agenda
● Why socket.io?
● What’s socket.io? What’s websocket?
● Socket.io in detail
HTTP
serverclient
(1) request
(2) response
WTF?
X
Bi-directional Communication
serverclient
(1) signal
(2) acknowledgement
(3) signal
(4) acknowledgement
Why don’t we use websocket?
● Standardized by
○ RFC 6455
○ W3C
● IE9 says NO
Why socket.io?
+ native iOS & Android
Socket.io Communication Layers
API
packet
communication (ws, jsonp, etc.)
API
# client
socket.emit(‘foo’, param1, param2, ...)
socket.on ‘bar’, (param1, param2, ...) ->
console.log(‘yay got a bar!...
Packet
socket.emit(‘foo’, param1, param2, ...)
# socket.io v0.9.x
packet = {
type: ‘event’
id: ‘unique packet id’
name: ‘f...
Communication Layer
# socket.io v0.9.x
packet = {
type: ‘event’
id: 1
name: ‘foo’
args: [param1, param2, ...]
}
# socket.i...
Further Reading
● http://davidwalsh.name/websocket
● test/spec https://github.com/LearnBoost/socket.io/blob/master/test/so...
Socket.io under the hood
Socket.io under the hood
Upcoming SlideShare
Loading in …5
×

Socket.io under the hood

1,412 views

Published on

Socket.io communication in detail

Published in: Technology, Education
  • Be the first to comment

Socket.io under the hood

  1. 1. Hao-kang Den @_hden Socket.io under the hood
  2. 2. Agenda ● Why socket.io? ● What’s socket.io? What’s websocket? ● Socket.io in detail
  3. 3. HTTP serverclient (1) request (2) response WTF? X
  4. 4. Bi-directional Communication serverclient (1) signal (2) acknowledgement (3) signal (4) acknowledgement
  5. 5. Why don’t we use websocket? ● Standardized by ○ RFC 6455 ○ W3C ● IE9 says NO
  6. 6. Why socket.io? + native iOS & Android
  7. 7. Socket.io Communication Layers API packet communication (ws, jsonp, etc.)
  8. 8. API # client socket.emit(‘foo’, param1, param2, ...) socket.on ‘bar’, (param1, param2, ...) -> console.log(‘yay got a bar!’) # server socket.on ‘foo’, (param1, param2, ...) -> console.log(‘yay got a foo!’) socket.emit(‘bar’, param1, param2, ...)
  9. 9. Packet socket.emit(‘foo’, param1, param2, ...) # socket.io v0.9.x packet = { type: ‘event’ id: ‘unique packet id’ name: ‘foo’ args: [param1, param2, ...] } # socket.io v1.0.x packet = { type: ‘event’ id: ‘unique packet id’ name: ‘foo’ data: [param1, param2, ...] } https://github.com/LearnBoost/socket.io-protocol
  10. 10. Communication Layer # socket.io v0.9.x packet = { type: ‘event’ id: 1 name: ‘foo’ args: [param1, param2, ...] } # socket.io v0.9.x 5:1::{“name”:”foo”,”args”:[param1, param2, ...]} https://github.com/LearnBoost/socket.io-spec
  11. 11. Further Reading ● http://davidwalsh.name/websocket ● test/spec https://github.com/LearnBoost/socket.io/blob/master/test/socket.io.js ● code https://github.com/LearnBoost/socket.io/blob/master/lib/socket.js read!

×