websocket
Websocket is just a network communication protocol, just like http, ftp, etc. are all network communication protocols;
compared to the non-persistent protocol such as HTTP, Websocket is a persistent network communication protocol;
The relationship between WebSocket and HTTP
The relationship between WebSocket and HTTP
There are intersections, but not all.
Websocket just borrows a part of the HTTP protocol to complete a handshake. (HTTP three-way handshake, only completed once here)
Http protocol
The first handshake : Host A sends a bit code of syn=1, and randomly generates a data packet with seq number=1234567 to the server. Host B knows by SYN=1, and A requests to establish a connection;
The second handshake : host B needs to confirm the connection information after receiving the request, and sends ack number=(seq+1 of host A), syn=1, ack=1, randomly generating packets of seq=7654321
The third handshake : host A checks whether the ack number is correct after receiving it, that is, the first sent seq number+1, and whether the bit code ack is 1, if it is correct, host A will send ack number=(host B’s seq+1), ack=1, host B confirms the seq value and ack=1 after receiving it, the connection is established successfully.
After completing the three-way handshake, host A and host B start to transmit data.
Long poll and Ajax polling and the principle of WebSocket
1. The principle of Ajax polling.
The scenario is as follows:
Client: La la la, is there any new information (Request)
Server: No (Response)
Client: la la la, is there any new information (Request)
Server: No. . (Response)
Client: La la la, is there any new information (Request)
Server: You are so annoying, no. . (Response)
Client: La la la, is there any new message (Request)
Server: OK, OK, I have it for you. (Response)
Client: La la la, is there a new message (Request)
server:. . . . . No. . . . No. . . No (Response) ---- loop
Code:
var polling = function(url, type, data){
var xhr = new XMLHttpRequest(),
type = type || "GET",
data = data || null;
xhr.onreadystatechange = function(){
if(xhr.readyState == 4) {
receive(xhr.responseText);
xhr.onreadystatechange = null;
}
};
xhr.open(type, url, true);
//IE的ActiveXObject("Microsoft.XMLHTTP")支持GET方法发送数据，
//其它浏览器不支持，已测试验证
xhr.send(type == "GET" ? null : data);
};
var timer = setInterval(function(){
polling();
}, 1000);
2. The principle of long poll.
In fact, the principle of long poll is similar to that of ajax polling. Both use the polling method. However, it adopts the blocking model (always call, if you don’t receive it, don’t hang up), that is,
After the client initiates a connection, if there is no message, it never returns a Response to the client. It doesn't return until there is a message. After returning, the client establishes a connection again, and the cycle continues.
The scenario is as follows:
Client: La la la, if there is any new information, if not, just wait for it to return to me (Request)
Server: Uh. . (Wait until there is news). . Come to you (Response)
client: la la la, if there is any new information, if not, just wait for it to return to me (Request)
Client: La la la la la, is there any new information?
Server: The monthly line is busy, please try again later (503 Server Unavailable)
Client:. . . . Okay, la la la, any new information?
Server: The monthly line is busy, please try again later (503 Server Unavailable) Client:
Code:
var longPoll = function(type, url){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
// 状态为 4，数据传输完毕，重新连接
if(xhr.readyState == 4) {
receive(xhr.responseText);
xhr.onreadystatechange = null;
longPoll(type, url);
}
};
xhr.open(type, url, true);
xhr.send();
}
Then the server was so busy on the sidelines: refrigerators, I want more refrigerators! More. . More. .
It can be seen from the above that in fact, these two methods are constantly establishing HTTP connections and then waiting for the server to process them, which can reflect another characteristic of the HTTP protocol, which is passivity .
What is passivity? In fact, the server cannot actively contact the client, only the client can initiate it.
Defect :
It is easy to see from the above that, in any case, the above two are very resource intensive.
Ajax polling requires fast processing speed and resources on the server. (Speed)
Long poll requires high concurrency, that is, the ability to receive customers at the same time. (The size of the venue)
So both ajax polling and long polling may happen.
3. The principle of WebSocket.
At this time Websocket appeared.
He solved these problems of HTTP.
First of all, passive . When the server completes the protocol upgrade (HTTP->Websocket), the server can actively push information to the client.
So the above scenario can be modified as follows.
Client: La la la, I want to establish a Websocket protocol, required services: chat, Websocket protocol version: 17 (HTTP Request)
Server: ok, confirmed, has been upgraded to Websocket protocol (HTTP Protocols Switched)
Client: trouble you Push me when there is information. .
Server: ok, sometimes I will tell you.
Server: balabalabalabala
server: balabalabalabala
server: Ha ha ha ha ha ha ha ha ha ha ah
service side: killing me ha ha ha ha ha ha ha
But Websocket only needs one HTTP handshake, so the entire communication process is established in one connection/state, which avoids the non-state nature of HTTP. The server will always know your information until you close the request, which is solved. The operator has to repeatedly analyze the HTTP protocol and check the identity info information.
At the same time, the customer actively asks , converts to the server (push) and sends it when there is information (of course, the client still waits for the initiative to send the information..) , when there is no information, it is handed over to the operator (Nginx), no need to occupy its own speed the slow customer service (Handler) a