WebSocket It's based on TCP A protocol for full duplex communication over a connection , be relative to HTTP For this kind of non durable agreement ,WebSocket Is a persistent network communication protocol .

WebSocket It's based on TCP A protocol for full duplex communication over a connection , be relative to HTTP For this kind of non durable agreement ,WebSocket Is a persistent network communication protocol .

It can not only implement client request server , At the same time, the server can be allowed to actively push data to the client . stay WebSocket API in , The client and server only need to complete a handshake , A persistent connection can be created directly between the two , And two-way data transmission .

Why WebSocket

stay Web In the application architecture , The connection is made by HTTP/1.0 and HTTP/1.1 Handle .HTTP The client side. / In server mode Request a response The protocol used , In this mode , client ( It's usually a browser ) Submit to server HTTP request , The resource that the server responds to the request ( for example HTML page ).

HTTP It's stateless , in other words , It treats each request as unique and independent . Stateless protocols have some advantages , for example , The server does not need to save information about the session , So there is no need to store data . however , It also means that every time HTTP Redundant information about the request is sent in both the request and the response , For example, use Cookie Verify user status .

As the interaction between client and server increases ,HTTP The amount of information required by the protocol to communicate between the client and the server increases rapidly .

Fundamentally speaking ,HTTP still Half duplex The agreement , in other words , At the same time, the flow of information can only be one-way ： Client sends request to server ( A one-way ), Then the server responds to the request ( A one-way ). The communication efficiency of half duplex mode is very low .

meanwhile HTTP There is a flaw in the agreement ： Communication can only be initiated by the client .

This one-way request feature , Doomed if the server has a state change , The client cannot be actively notified .

In order to get the changes of the server in time , We've tried all kinds of ways ：

• polling (polling)： Every once in a while , Just make a request , Find out if the server has any new information . Imprecise , There is a delay , A lot of invalid data exchange .
• Long polling ( long polling)： The client requests information from the server , And remain connected for a set period of time . Until the server responds with a new message , Or connection timeout , This technology is often called “ Hang up GET” or “ Put on hold POST”. Occupy server resources , There is no advantage over polling , No standardization .
• Fluidization technology ： In fluidization technology , Client sends a request , The server sends and maintains a continuous update and remains open ( It can be unlimited or a specified period of time ) Open response . Whenever the server has information that needs to be delivered to the client , It updates the response . The server never sends a completion message HTTP Respond to . Agents and firewalls may cache responses , Resulting in increased delays in information delivery .

The above method provides near real-time communication , But they also involve HTTP Request and respond to the initial bid , It contains many additional and unnecessary header data and delays . Besides , In each case , The client must wait for the request to return , To make subsequent requests , And this significantly increases the delay . At the same time, it also greatly increases the pressure on the server .

What is? WebSocket

and Websocket It's a natural full duplex 、 two-way 、 Single socket connection , It's solved HTTP The protocol is not suitable for real-time communication .2008 Was proposed in ,2011 Became an international standard in .

Websocket The agreement can pass Web Full duplex communication between client and server , It also supports the transmission of binary data and text string .

This protocol consists of the initial handshake and the subsequent basic message framework , It's based on TCP Agreement on the . Compared with HTTP agreement ,Websocket Once the link is established , Two way real-time communication .

Its features include ：

(1) Based on the TCP The agreement above , The implementation of the server side is relatively easy .

(2) And HTTP The protocol has good compatibility . The default port is also 80 and 443, And the handshake phase is used HTTP agreement , So shaking hands is not easy to block , Through a variety of HTTP proxy server .

(3) The data format is lighter , Low performance overhead , Communication efficiency .

(4) You can send text , You can also send binary data .

(5) There is no homology restriction , The client can communicate with any server .

Similar technology

Server-sent Events(SSE)：

https://www.ruanyifeng.com/blog/2017/05/server-sent_events.html

https://www.cnblogs.com/goloving/p/9196066.html

SPDY ( pronounce as “SPeeDY”)： It is no longer maintained , from HTTP/2 replace

https://baike.baidu.com/item/SPDY/3399551#7

WebRTC

https://baike.baidu.com/item/WebRTC/5522744

Communication principle

WebSocket How links are built ?

As I said before ,WebSocket In the handshake phase HTTP agreement ,Websocket Borrowed HTTP Part of the agreement to complete a handshake .(HTTP Three handshakes of , This is only done once )

HTTP Request and response header

WebSocket Request and response header

Link communication simulation

HTTP polling

First of all ajax polling , The principle is very simple , Let the browser send a request every few seconds , Ask the server if there is any new information .

Scene reproduction ：

• client ： La la la , Is there any new information (Request)
• Server side ： No, (Request)
• client ： La la la , Is there any new information (Request)
• Server side ： No, ..(Response)
• client ： La la la , Is there any new information (Request)
• Server side ： How are you , No! ..(Response)
• client ： La la la , Is there any new news (Request)
• Server side ： All right, all right , Here you are ’ Xiling is so handsome ’ .(Response)
• client ： La la la , Is there any new news (Request)
• Server side ：... no .... no .. No,

As can be seen from the above , Polling is actually constantly building HTTP Connect , Then wait for the server to process , It can reflect HTTP Another feature of the agreement , Passivity . meanwhile ,http After each request and response , The server discards all client information , Next time request , Must carry identity information (cookie), Statelessness .

WebSocket

Client pass http( Riding a horse ) Request the server with a letter , But at the same time , With Upgrade:websocket and Connection:Upgrade( Two pipes ), If the server supports WebSocket agreement ( There is an interface between two pipes ), Use Websocket The protocol returns available information ( Throw away the horses ), After that, the transmission of information , Both tubes are used , Unless one party cuts off the pipe artificially . If the server does not support , Client failed to request link , Return error message .

Websocket Appearance , These problems have been solved cleanly .

So the above scenario can be modified as follows .

• client ： La la la , I want to build Websocket agreement , Required services ：chat,Websocket Protocol version ：13(HTTP Request)
• Server side ：ok, confirm , Has been upgraded to Websocket agreement (HTTP Protocols Switched)
• client ： Please push it to me when you have information ..
• Server side ：ok, Sometimes I will tell you .
• client ：balabala Start doodling balabala
• Server side ： Cang * empty bala
• client ： Nosebleed , I wipe ……
• Server side ： Ha ha ha Niu XX Haha haha
• Server side ： Laugh to death, ha ha