WebSocket is a protocol that HTML5 began to provide for full duplete communication on a single TCP connection.
In the WebSocket API, the browser and the server only need to do a handshake, and then a fast channel is formed between the browser and the server. Between the two, data can be transmitted directly to each other.
When you get a Web Socket connection, you can send data to the server via send() and receive the data returned by the server through the onmessage event.
The following API is used to create a WebSocket object.
var Socket = new WebSocket(url, [protocal] );
The first parameter in the code above, url, specifies the URL of the connection. The second parameter, protocol, is optional and specifies an acceptable sub-protocol.
The following are the properties of the WebSocket object. Let's say we created the Socket object using the code above:
The read-only property readyState represents the connection state and can be the following value:
The read-only property bufferedAmount() has been put into the queue waiting to be transferred, but the number of UTF-8 text bytes has not yet been emitted.
The following are related events for the WebSocket object. Let's say we created the Socket object using the code above:
|Event||The event handler||Describe|
|open||Socket.onopen||Triggered when the connection is established|
|message||Socket.onmessage||Triggered when the client receives service-side data|
|error||Socket.onerror||Triggered when an error occurs in the communication|
|close||Socket.onclose||Triggered when the connection is closed|
Here's how the WebSocket object is related. Let's say we created the Socket object using the code above:
Use a connection to send data
Close the connection
The WebSocket protocol is essentially a TCP-based protocol.
In order to establish a WebSocket connection, the client browser first initiates an HTTP request to the server, which, in different from the usual HTTP request, contains additional header information, where the additional header information "Upgrade: WebSocket" indicates that this is an HTTP request for protocol upgrade, and the server side parses this additional header information and then generates the answer information to be returned to the client, client, and server-side WebSocket The connection is established, and both parties can freely pass information through the connection channel, and the connection persists until the client or server side actively shuts down the connection.
Most browsers currently support the WebSocket() interface, and you can try examples in the following browsers: Chrome, Mozilla, Opera, and Safari.
w3cschool_websocket.html contents of the file
Before we can execute the above program, we need to create a service that supports WebSocket. Download from pywebsocket mod_pywebsocket or use the git command to download:
git clone https://github.com/google/pywebsocket.git
mod_pywebsocket require python environment supportmod_pywebsocket is a Web Socket extension of Apache HTTP, and the installation steps are as follows:
Unzim the downloaded file.
Go to the pywebsocket directory.
To execute a command:
$ python setup.py build $ sudo python setup.py install
View the documentation description:
$ pydoc mod_pywebsocket
Turn on the service
The following commands are executed in the pywebsocket/mod_pywebsocket directory:
$ sudo python standalone.py -p 9998 -w ../example/
The above command opens a service with port number 9998 and uses -w to set up the directory where the handler echo_wsh.py is located.
Now we can open the file we created earlier w3cschool_websocket.html Chrome. If your browser supports WebSocket(), click "Run WebSocket" and you'll see a pop-up window at each step of the entire process, a gif demo of the process:
When we stop the service, the "Connection is closed..." pops up.