什么是WebSocket，如何使用WebSocket？

bollat

于 2024-10-05 02:58:02 发布

阅读量286

点赞数 8

文章标签： websocket 网络协议网络前端 javascript node.js

本文链接：https://blog.csdn.net/bollat/article/details/142709948

版权

WebSocket 是一种网络协议，用于在客户端和服务器之间建立持久的双向通信通道。它提供了一种在单个 TCP 连接上进行全双工通信的方式，使得数据可以在客户端和服务器之间实时地流动。

WebSocket 的主要特点：

双向通信：与传统的 HTTP 请求/响应模式不同，WebSocket 允许客户端和服务器双方同时发送和接收消息，从而实现实时交互。
持久连接：WebSocket 连接在建立后会保持打开状态，直到客户端或服务器主动关闭。这减少了频繁建立和关闭连接的开销。
低延迟：由于连接是持久的，数据可以快速传输，降低了延迟，适合需要快速响应的应用场景。
节省带宽：WebSocket 使用的协议头信息相较于传统的 HTTP 请求更小，因此可以节省带宽，尤其是在频繁通信的情况下。
跨域支持：WebSocket 可以通过跨域请求进行通信，这对于不同域之间的数据交换非常重要。

WebSocket 的工作流程：

建立连接：
- 客户端发起一个 HTTP 请求到服务器，升级协议为 WebSocket。这个请求被称为“握手”请求。
- 服务器通过返回一个包含 101 状态码的响应来确认连接建立。
数据传输：
- 一旦连接建立，客户端和服务器就可以在该连接上发送和接收数据。
- 数据以帧的形式传输，支持文本和二进制格式。
关闭连接：
- 任一方可以随时发起关闭连接的请求，关闭连接时会进行相应的协议处理。

WebSocket 的基本用法：

客户端示例：

// 创建 WebSocket 连接
const socket = new WebSocket('ws://localhost:3000');

// 连接成功时
socket.onopen = function(event) {
    console.log('连接已建立');
    // 发送消息
    socket.send('Hello, Server!');
};

// 接收消息
socket.onmessage = function(event) {
    console.log('收到消息:', event.data);
};

// 连接关闭时
socket.onclose = function(event) {
    console.log('连接已关闭');
};

// 连接错误时
socket.onerror = function(error) {
    console.error('WebSocket 错误:', error);
};

服务器端示例（Node.js）：

使用 ws 库：

const WebSocket = require('ws');

// 创建 WebSocket 服务器
const wss = new WebSocket.Server({ port: 3000 });

wss.on('connection', function(socket) {
    console.log('客户端已连接');

    // 接收消息
    socket.on('message', function(message) {
        console.log('收到消息:', message);
        // 发送消息回客户端
        socket.send('Hello, Client!');
    });

    // 连接关闭时
    socket.on('close', function() {
        console.log('客户端已断开连接');
    });
});