2. HTTP Issue
Depends on Request / Response architecture
• Only client can send Requests
• Server can only Respond to Requests
• Can’t send another Request before Response
Too much traffic overhead & header on every
Request / Response
HTTP is Good For Docs Not Apps
6. Long Polling技術
An attempt to offer realtime server interaction, using a
persistent or long-lasting HTTP connection between the
server and the client.
The browser makes an Ajax-style request to the server, which
is kept open until the server has new data to send to the
browser, which is sent to the browser in a complete response.
The browser initiates a new long polling request in order to
obtain subsequent events.
Specific technologies:
7. WebSockets - Sockets on the Web
● Part of HTML5
● W3C API and IETF Protocol (RFC 6455 )
● Full-duplex, bidirectional communication
● Unsecured (TCP) and secured (SSL) modes
● Traverses firewalls, proxies and routers
● Text (UTF-8) and binary data
● Ping/Pong messages for keep-alive
● Share ports 80 and 443 with HTTP/HTTPS
8. WebSocket
A WebSocket is a standard bidirectional TCP socket between
the client and the server.
The socket starts out as a HTTP connection and then
"Upgrades" to a TCP socket after a HTTP handshake.
After the handshake, either side can send data with full
duplex mode
WebSocket Client WebSocket Server
10. WebSocket Connection Process
The client requesting a webSocket connection, sends an HTTP request to
the server on port 80.
That HTTP request is a perfectly legal HTTP request, but it has a header
included on it Upgrade: websocket.
If the server supports the webSocket protocol, then it responds with a
legal HTTP response with a 101 status code that includes a
header Connection: Upgrade.
At that point, both sides then switch protocols to the webSocket protocol
and all future communication on that socket is done using the data format
for the webSocket frame.
Any other incoming HTTP requests that do not contain
the upgrade request header are treated as normal HTTP requests
16. WebSocket frame
0 1 2 3
0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1 2 3 4 5 6 7 8 9 0 1
F
I
N
R
S
V
1
R
S
V
2
R
S
V
3
opcode(4)
M
A
S
K
payload len(7) extended payload len(16/64)
extended payload len continued(16/64)
masking key(0/32)
masking key continued payload ...
18. socket.io
socket.io : Cross browser way to do JavaScript-based real time
communication is
socket.io uses WebSockets if the client supports it, and falls
back on other things if it’s not, and even has AJAX polling and
multi-part streaming
19. Sending and receiving events
Socket.IO allows you to emit and receive custom events.
Besides connect, message and disconnect, you can emit
custom events
Socket.IO allows you to emit and receive custom events. Besides connect, message and disconnect, you can emit custom events:
26. 使用setTimeout() 可以避免錯亂!
Using setTimeout() doesn’t guarantee execution on a fixed
interval per se. But, it does guarantee that the previous
interval has completed before the next interval is called
a=1 a=2a=0 a=1 a=2
Time
27. Read More
• Socket.IO : http://socket.io
• RFC 6455 - The WebSocket Protocol - IETF Tools