RIP: from polling to WebSocket

Http is designed as a one-way communication protocol, where the client initiates a requestand the server responds to a response. This makes the server is very annoyed: I am the boss, I can't even send a message to the younger brother ...

Polling

eldest brother angry, the younger brothers can not be indifferent, in order to get the news of the boss in time, The younger brothers had to run to the boss every other time to ask, there is no new instructions issued. This is the earliest technology to achieve real-time access to server Data polling ( Polling ) .

　　 The client gets data from the server through Ajax and checks for new data updates. This use of polling to implement a pseudo-real-time state is easy, but inefficient, in general, this real-time access to data, the amount of data itself is not very large, and through this repeated request of the way, It is often caused by http Header information more than the data itself, and most of the time the data obtained is a duplication of useless the. ( It is said that the first to implement the Web real-time communication by constantly refreshing the client page ~ I think it should be a customer who will tolerate this experience. )

Comet

　　 " not worth it!" A few of our brothers ran around every day. All you get is a bunch of useless data. "

so we all sat together and thought, Is there any good way to do it without running errands and getting new information in time? Small People brainwave, next time we ran to the eldest brother waiting, waiting for him to come back after the order. This is based on   ajax  Long polling for ( long-polling ) a comet Way. because Ajax The call is asynchronous and we can launch a request until data is passed or timed out ( timeout ) is not returned. After the client finishes processing the information returned by the server, the request is made again and the connection is re-established. This cycle.

AJAX - based long-polling　　

there is another the Forever iframe technique . This child sounds a lot bigger. is actually hiding a iframe tag, and then place this iframe   src  The property is set to a request for a long connection, and the server can continuously enter data to the client. But there is an obvious problem with this approach, and each browser will always show the page loading is not complete, and if the user is obsessive, he will turn off the page in minutes. TAT ...

Forever IFRAME Technology

　　no matter what . Comet first-time technology implementation Real -time communication, and can support a large number of users, The little guys have always been able to get the boss's message accurately. But Comet will not be a solution without side effects, due to the long-term occupancy of the connection, so that the Web loss of stateless high concurrency features , Server bandwidth and resources are consumed heavily.

WebSocket debut

"It's troublesome to run and run," said thehttp -swollen. The whole new deal between us and the boss. ”

This idea blew up the pot in the younger brothers!!! In everyone's awaited, WebSocket The protocol comes up. hahaha haha ~ Let me save you ~ ~ ~ ~

WebSocket protocol is HTML5 Defines a new protocol that implements browser-to-server full-duplex communication (Full-duplex) . Issue websocket connection request via browser, The server then responds and establishes a link to the channel. The small only use Send a message to ask eldest brother: "The head is good ~", the eldest brother returns a letter son: "Comrades have worked hard!" "This handshake ( handshaking ) is complete, WebSocket , we can do real real-time communication.

　　WebSocket allows you to establish a connection to a remote server via JavaScript , enabling two-way communication between the client and the server. There are two methods in WebSocket :

1. Send() sends data to the remote server

2. Close() closes the websocket link

　　WebSocket also defines several listener functions.

1. OnOpen triggers this event when a network connection is established

2. onerror triggers this event when a network error occurs

3. OnClose Trigger This event when WebSocket is closed

4, OnMessage when the websocket received the message from the server to trigger the event, is also the most important communication in a listening event.

WebSocket also defines a ReadyState property that returns the status of WebSocket :

1,connecting (0) WebSocket is trying to establish a connection to the server

2,OPEN (1) websocket and the server has established a connection

3,CLOSING (2) websocket shutting down the connection to the server

4,CLOSED (3) WebSocket has closed the connection to the server

the WebSocket URL begins with ws, and if you need SSL encryption You can use WSS when we call WebSocket Constructs a websocket object (new WebSocket (URL)), it is ready for instant communication.

　　

haha haha ~ eldest brother through WebSocket The Speaker:

　　　　 please eat at night!

Boys, hurry up and move on ~

Summary

ComparedCometTechnologyWebSocketNot only saves theHeaderThe problem (WebSocketOfHeadInformation only a short2bytes). More important is the stability of the communication,CometAfter encountering network problems, it is very difficult to resume communication without refreshing the page, andWebSocketis provided in theOnClosefunction to handle the situation after disconnecting the network, which provides a reliable guarantee for our communication with the server. InGitHubThere is aJSLibraryHttps://github.com/joewalnes/reconnecting-websocket) is handled in this way.WebSocketDisconnected network re-connection.

WebSocketLook upIt's only a matter of time before we realize it., of course, so well- websocket nor is there no question of it,WebSocketFor now, the biggestThe problem is browser support (fortunately, most of the server software has been supported in newer versionsWebSocket),ie until ten to support this protocol, and each browserrecently, when you upgrade your browser, you will have a websocket make a small adjustment. And, imagine you open a page,when thispage Open websocket Connect and execute an internal IP address of the port scan , If the port scan finds an open on the internal network Port, a tunnel may be built through your browser. Do thisvery likelyeventually bypasses the firewall and allows access to internal content. So security., but also websocket a big danger now.