WebSocket is a protocol that enables full-duplex communication between client and server. Compared to the traditional HTTP request-response model, WebSocket allows bidirectional real-time data transmission over a single connection.
- Real-time: WebSocket supports real-time communication, allowing the server to actively push data to the client without the client sending a request. This makes WebSocket suitable for scenarios such as real-time chat, real-time collaboration, and real-time data updates, where real-time performance is crucial.
- Two-way communication: WebSocket provides the capability of two-way communication, and the client and server can send and receive data at the same time. Compared with HTTP, WebSocket no longer needs to initiate multiple requests to obtain updated data, thereby reducing network overhead and latency.
- Persistent connections: WebSocket connections are maintained for a long time, unlike the short-lived connections in HTTP request-response mode. This means that after a WebSocket connection is established, communication between the client and server can be maintained without the need to frequently re-establish the connection.
- Based on event-driven architecture: WebSocket uses an event-driven architecture to handle data transmission. By listening to events and callback functions, front-end engineers can write corresponding logic to handle received data or changes in connection status.
- Cross-domain support: WebSocket supports cross-domain communication. Since the establishment of WebSocket connections is negotiated over HTTP, the server can be configured to allow WebSocket connections to span different domain names.
- Security: The WebSocket protocol itself does not provide encryption, but TLS/SSL can be used on top of the WebSocket connection to implement encrypted communication, namely WebSocket Secure (WSS). Using WSS can ensure the secure transmission of data.
Here is a simple WebSocket code example that uses JavaScript to communicate with a WebSocket server in the browser:
// 创建WebSocket连接
let socket = new WebSocket("ws://localhost:8080");
// 连接建立时触发
socket.onopen = function() {
console.log("WebSocket连接已建立");
// 发送消息给服务器
socket.send("Hello, server!");
};
// 接收到消息时触发
socket.onmessage = function(event) {
console.log("接收到消息：" + event.data);
// 关闭WebSocket连接
socket.close();
};
// 连接关闭时触发
socket.onclose = function(event) {
console.log("WebSocket连接已关闭");
};
In this example, by using the WebSocket API in JavaScript, a WebSocket object is created and connected to the specified WebSocket server address.
When the connection is established, socket.onopenthe function will be triggered, and you can perform some initialization operations here, such as sending an initial message to the server.
When a message sent by the server is received, socket.onmessagethe function is triggered, where you can process the received message and perform corresponding operations as needed.
The difference between polling and polling
WebSocket and polling (Polling) are two different communication mechanisms. They have some differences in terms of real-time performance, efficiency, and resource consumption.
-
Real-time: WebSocket provides real-time two-way communication capabilities, allowing the server to actively push data to the client without requiring the client to continuously initiate requests. In contrast, polling uses the client to periodically send requests to obtain the latest data, so the response delay is high and true real-time communication cannot be achieved.
-
Efficiency: WebSocket uses a long connection to maintain communication after the connection is established, while polling requires establishing a new connection for each request. This results in WebSocket being more efficient than polling because it reduces request and connection establishment overhead, reducing network traffic.
-
Resource consumption: Polling requires sending requests frequently, even when no new data is available, consuming network bandwidth and server resources. WebSocket uses long connections and only needs to send data when there is new data, reducing unnecessary resource consumption.
-
Server push: WebSocket allows the server to actively push data to the client, while polling can only obtain data when the client actively initiates a request. This makes WebSocket more suitable for real-time communication scenarios, such as chat applications, real-time collaboration and real-time data updates.
Overall, WebSocket has lower latency, higher efficiency, and less resource consumption than polling, and is especially suitable for application scenarios that require real-time communication and active data push by the server. However, if the browser or server does not support WebSocket, polling is still a viable option.