详解WebSocket

目录

1.WebSocket是什么?

2.WebSocket的通信过程

3.WebSocket的报文结构

4.JAVA中的WebSocket


1.WebSocket是什么?

在传统的BS体系中,请求响应一直是单向的,服务器一直扮演的"被动"的角色,浏览器发起请求去访问服务器,服务器才会返回响应。这种单向的模式让实时通信、消息推送一类的场景,实现起来成本巨大。

HTML5里面提出了WebSocket标准,目的就是让服务器具有"主动"的能力,能由服务器向浏览器主动推送东西。WebSocket 是一种基于 TCP 协议的应用层协议,它允许客户端和服务器之间建立持久连接,实现实时通信和推送功能,其和HTTP属于并列的关系:

2.WebSocket的通信过程

WebSocket的通信分为两个阶段:

  • 握手阶段

  • 数据交换阶段

握手阶段:

  • 客户端通过 HTTP 请求发起握手请求,请求头包含一些特殊的字段,如pgrade: websocket和 Connection: Upgrade,以及其他的 WebSocket 相关字段。

  • 服务器响应握手:服务器收到客户端的 WebSocket 握手请求后,进行协议升级,将 HTTP 连接升级为 WebSocket 连接。服务器返回一个 WebSocket 握手响应,响应头中包含特殊字段,如 Upgrade: websocketConnection: Upgrade,以及其他的 WebSocket 相关字段。

  • 连接建立:一旦客户端收到服务器的 WebSocket 握手响应,WebSocket 连接就建立成功,现在客户端和服务器都可以发送和接收 WebSocket 消息了。

数据交换阶段:

  • 双向数据交换:WebSocket 连接建立后,客户端和服务器可以通过 WebSocket 会话进行双向的数据交换。任何一方都可以随时发送消息给对方,而不需要事先发出请求。这使得客户端和服务器能够实时交流和传输数据。

  • 数据帧:WebSocket 使用数据帧(Frame)来传输数据。数据帧是 WebSocket 数据的最小传输单元。数据帧可以被分割成多个片段来传输更大的数据。数据帧中包含了有效载荷(Payload)和一些控制信息,例如标识消息类型、是否为最后一个片段等。

  • 心跳检测:WebSocket 连接建立后,客户端和服务器可以通过发送心跳数据帧来维持连接。心跳检测可以确保连接的持久性,如果在一段时间内没有收到心跳响应,可以判断连接已断开。

3.WebSocket的报文结构

websocket的报文=结束标志位 + 操作码 + 帧长度 + 掩码

  • 第一位"FIN":相当于 HTTP/2 里的"END_STREAM",表示数据发送完毕。一个消息可以拆成多个帧,接收方看到"FIN"后,就可以把前面的帧拼起来,组成完整的消息。

  • "FIN"后面的三个位是保留位,目前没有任何意义,但必须是 0。

  • "Opcode",操作码:其实就是帧类型,比如 1 表示帧内容是纯文本,2 表示帧内容是二进制数据,8 是关闭连接,9 和 10 分别是连接保活的 PING 和 PONG。

  • 掩码标志位"MASK":表示帧内容是否使用异或操作(xor)做简单的加密。目前的 WebSocket 标准规定,客户端发送数据必须使用掩码,而服务器发送则必须不使用掩码。

  • "Payload len":表示帧内容的长度。它是另一种变长编码,最少 7 位,最多是 7+64 位,也就是额外增加 8 个字节,所以一个 WebSocket 帧最大是 2^64。

  • "Masking-key":掩码密钥,它是由上面的标志位"MASK"决定的,如果使用掩码就是 4 个字节的随机数,否则就不存在。

4.JAVA中的WebSocket

WebSocket作为一个HTML5标准,也就是前端提出的标准,后端服务器需要支持这种标准,也就是能准确解析WebSocket的数据包,按照约定的标准来办事儿,才能使用WebSocket。

Java 的 Servlet 3.1 规范中包含了对 WebSocket 的支持,也就是说支持Servlet 3.1的Web Server就支持WebSocket。实际开发中常用的tomcat、netty都支持websocket。

这里给出Spring Boot中使用WebSocket的demo。其底层是用的TomCat支持的WebSocket标准。

依赖:

<dependency>

<groupId>org.springframework.boot</groupId>

<artifactId>spring-boot-starter-web</artifactId>

</dependency>

<dependency>

<groupId>org.springframework.boot</groupId>

<artifactId>spring-boot-starter-websocket</artifactId>

</dependency>

websocket处理器:

每一个 WebSocket 连接对应一个 WebSocketSession。当客户端通过 WebSocket 建立连接时,服务器会为每个连接创建一个 WebSocketSession 对象,用于表示该连接的会话信息。

处理器用于处理WebSocketSession。

java 复制代码
import org.springframework.stereotype.Component;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.WebSocketMessage;
import org.springframework.web.socket.WebSocketSession;

@Component
public class MyWebSocketHandler implements WebSocketHandler {

    @Override
    public void afterConnectionEstablished(WebSocketSession session) throws Exception {
        System.out.println("WebSocket 连接建立:" + session.getId());
    }

    @Override
    public void handleMessage(WebSocketSession session, WebSocketMessage<?> message) throws Exception {
        String payload = message.getPayload().toString();
        System.out.println("接收到消息:" + payload);
        session.sendMessage(new TextMessage("服务器收到消息:" + payload));
    }

    @Override
    public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception {
        System.err.println("WebSocket 传输错误:" + session.getId());
    }

    @Override
    public void afterConnectionClosed(WebSocketSession session, CloseStatus closeStatus) throws Exception {
        System.out.println("WebSocket 连接关闭:" + session.getId());
    }

    @Override
    public boolean supportsPartialMessages() {
        return false;
    }
}

配置、注册websocket处理器:

java 复制代码
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;

@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {

    @Autowired
    private MyWebSocketHandler webSocketHandler;

    @Override
    public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
        registry.addHandler(webSocketHandler, "/ws").setAllowedOrigins("*");
    }
}

前端代码示例:

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <title>WebSocket Test</title>
</head>
<body>
    <button onclick="sendMessage()">发送消息</button>
    <div id="messageBox"></div>

    <script>
        const ws = new WebSocket('ws://localhost:8080/ws');

        ws.onopen = function(event) {
            console.log('WebSocket 已连接');
        };

        ws.onmessage = function(event) {
            document.getElementById('messageBox').innerHTML += '<p>' + event.data + '</p>';
        };

        ws.onclose = function(event) {
            console.log('WebSocket 已关闭');
        };

        function sendMessage() {
            const message = prompt('请输入要发送的消息:');
            ws.send(message);
        }
    </script>
</body>
</html>
相关推荐
雷神乐乐2 分钟前
Maven学习——创建Maven的Java和Web工程,并运行在Tomcat上
java·maven
码农派大星。6 分钟前
Spring Boot 配置文件
java·spring boot·后端
顾北川_野13 分钟前
Android 手机设备的OEM-unlock解锁 和 adb push文件
android·java
江深竹静,一苇以航15 分钟前
springboot3项目整合Mybatis-plus启动项目报错:Invalid bean definition with name ‘xxxMapper‘
java·spring boot
weixin_4426434231 分钟前
推荐FileLink数据跨网摆渡系统 — 安全、高效的数据传输解决方案
服务器·网络·安全·filelink数据摆渡系统
confiself31 分钟前
大模型系列——LLAMA-O1 复刻代码解读
java·开发语言
Wlq041536 分钟前
J2EE平台
java·java-ee
XiaoLeisj43 分钟前
【JavaEE初阶 — 多线程】Thread类的方法&线程生命周期
java·开发语言·java-ee
阑梦清川1 小时前
JavaEE初阶---网络原理(五)---HTTP协议
网络·http·java-ee
半桶水专家1 小时前
用go实现创建WebSocket服务器
服务器·websocket·golang