SpringBoot通过WebSocket建立实时通信

最新推荐文章于 2024-06-13 10:32:31 发布

丢失的猫咪

最新推荐文章于 2024-06-13 10:32:31 发布

阅读量853

点赞数

分类专栏： SpringBoot WebSocket 文章标签： Spring Boot WebSocket 网络通信

本文链接：https://blog.csdn.net/zhou6282610/article/details/89705624

版权

SpringBoot 同时被 2 个专栏收录

12 篇文章 0 订阅

订阅专栏

WebSocket

1 篇文章 0 订阅

订阅专栏

POM引入依赖

<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功能

@EnableWebSocket //开启WebSocket
@SpringBootApplication
public class WebSocketApplication {

    public static void main(String[] args) {
        SpringApplication.run(WebSocketApplication.class, args);
    }
       
    
    @Bean //注入Spring容器的bean
    public ServerEndpointExporter serverEndpointExporter() {
        return new ServerEndpointExporter();
    }
}

使用bootstrap创建一个简单的页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>chat room websocket</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <script src="./js/jquery-3.4.0.min.js" ></script>
</head>
<body class="container" style="width: 60%">
<div class="form-group" ></br>
    <h5>聊天室</h5>
    <textarea id="message_content"  class="form-control"  readonly="readonly" cols="50" rows="10"></textarea>
</div>
<div class="form-group" >
    <label for="in_user_name">用户姓名 &nbsp;</label>
    <input id="in_user_name" value="" class="form-control" /></br>
    <button id="user_join" class="btn btn-success" >加入聊天室</button>
    <button id="user_exit" class="btn btn-warning" >离开聊天室</button>
</div>
<div class="form-group" >
    <label for="in_room_msg" >群发消息 &nbsp;</label>
    <input id="in_room_msg" value="" class="form-control" /></br>
    <button id="user_send_all" class="btn btn-info" >发送消息</button>
</div>
</body>
<script type="text/javascript">
    $(document).ready(function(){
        var urlPrefix ='ws://localhost:8080/chat-room/';
        var ws = null;
        $('#user_join').click(function(){
            var username = $('#in_user_name').val();
            var url = urlPrefix + username;
            ws = new WebSocket(url);
            ws.onopen = function () {
                console.log("建立 websocket 连接...");
            };
            ws.onmessage = function(event){
                //服务端发送的消息
                $('#message_content').append(event.data+'\n');
            };
            ws.onclose = function(){
                $('#message_content').append('用户['+username+'] 已经离开聊天室!\n');
                console.log("关闭 websocket 连接...");
            }
        });
        //客户端发送消息到服务器
        $('#user_send_all').click(function(){
            var msg = $('#in_room_msg').val();
            if(ws){
                ws.send(msg);
            }
        });
        // 退出聊天室
        $('#user_exit').click(function(){
            if(ws){
                ws.close();
            }
        });
    })
</script>
</html>

Websocket 使用 ws 或 wss 的统一资源标志符，类似于 HTTPS，其中 wss 表示在 TLS 之上的 Websocket。例如：

ws://example.com/wsapi
wss://secure.example.com/

Websocket 使用和 HTTP 相同的 TCP 端口，可以绕过大多数防火墙的限制。默认情况下，Websocket 协议使用 80 端口；运行在 TLS 之上时，默认使用 443 端口。

WebSocket连接实现代码

创建一个工具类，进行消息管理，使用 ConcurrentHashMap 提升高并发时效率。

public static final Map<String, Session> ONLINE_USER_SESSIONS = new ConcurrentHashMap<>();

public static void sendMessage(Session session, String message) {
    if (session == null) {
        return;
    }

	final RemoteEndpoint.Basic basic = session.getBasicRemote();
	if (basic == null) {
		return;
	}
	try {
		basic.sendText(message);
	} catch (IOException e) {
		log.error("sendMessage IOException ", e);
	}
}

public static void sendMessageAll(String message) {
	ONLINE_USER_SESSIONS.forEach((sessionId, session) -> sendMessage(session, message));
}

实现代码

@Slf4j
@RestController
@ServerEndpoint("/chat-room/{username}")
public class ChatRoomServerEndpoint {

	@OnOpen // 用户建立连接时触发。
	public void openSession(@PathParam("username") String username, Session session) {
		ONLINE_USER_SESSIONS.put(username, session);
		String message = "欢迎用户[" + username + "] 来到聊天室！";
		log.info("用户登录：{}", message);
		sendMessageAll(message);
	}

	@OnMessage // 监听发送消息的事件
	public void onMessage(@PathParam("username") String username, String message) {
		log.info("用户[{}]发送消息：{}", username, message);
		sendMessageAll("用户[" + username + "] : " + message);
	}

	@OnClose // 监听用户断开连接事件
	public void onClose(@PathParam("username") String username, Session session) {
		// 当前的Session 移除
		ONLINE_USER_SESSIONS.remove(username);
		// 并且通知其他人当前用户已经离开聊天室了
		sendMessageAll("用户[" + username + "] 已经离开聊天室了！");
		try {
			session.close();
		} catch (IOException e) {
			log.error("onClose error{}", e);
		}
	}

	@OnError //监听错误事件
	public void onError(Session session, Throwable throwable) {
		try {
			session.close();
		} catch (IOException e) {
			log.error("onError excepiton,{}", e);
		}
		log.info("Throwable msg ,{}", throwable.getMessage());
	}
}

相关说明

事件	事件处理程序	描述
open	Sokcket onopen	连接建立时触发
message	Sokcket onopen	客户端接收服务端数据时触发
error	Sokcket onerror	通讯发生错误时触发
close	Sokcket onclose	链接关闭时触发

接收类上需要添加 @ServerEndpoint("url") 代表监听此地址的 WebSocket 信息

优点

较少的控制开销。在连接创建后，服务器和客户端之间交换数据时，用于协议控制的数据包头部相对较小。在不包含扩展的情况下，对于服务器到客户端的内容，此头部大小只有 2 至 10 字节（和数据包长度有关）；对于客户端到服务器的内容，此头部还需要加上额外的 4 字节的掩码。相对于 HTTP 请求每次都要携带完整的头部，此项开销显著减少了。
更强的实时性。由于协议是全双工的，所以服务器可以随时主动给客户端下发数据。相对于 HTTP 请求需要等待客户端发起请求服务端才能响应，延迟明显更少；即使是和 Comet 等类似的长轮询比较，其也能在短时间内更多次地传递数据。
保持连接状态。与 HTTP 不同的是，Websocket 需要先创建连接，这就使得其成为一种有状态的协议，之后通信时可以省略部分状态信息，而 HTTP 请求可能需要在每个请求都携带状态信息（如身份认证等）。
更好的二进制支持。Websocket 定义了二进制帧，相对 HTTP，可以更轻松地处理二进制内容。可以支持扩展。Websocket 定义了扩展，用户可以扩展协议、实现部分自定义的子协议。如部分浏览器支持压缩等。
更好的压缩效果。相对于 HTTP 压缩，Websocket 在适当的扩展支持下，可以沿用之前内容的上下文，在传递类似的数据时，可以显著地提高压缩率。

WebSocket 在握手之后便直接基于 TCP 进行消息通信，但 WebSocket 只是 TCP 上面非常轻的一层，它仅仅将 TCP 的字节流转换成消息流（文本或二进制），至于怎么解析这些消息的内容完全依赖于应用本身。

丢失的猫咪

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
SpringBoot通过WebSocket建立实时通信

POM引入依赖<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId></dependency><dependency> &...
复制链接

扫一扫