Spring Boot整合WebSocket

最新推荐文章于 2024-04-29 20:54:10 发布

虫小宝

最新推荐文章于 2024-04-29 20:54:10 发布

阅读量697

点赞数 12

文章标签： spring boot websocket

本文链接：https://blog.csdn.net/weixin_44627014/article/details/135744241

版权

Spring Boot整合WebSocket

大家好，我是免费搭建查券返利机器人赚佣金就用微赚淘客系统3.0的小编，也是冬天不穿秋裤，天冷也要风度的程序猿！今天，让我们一同探讨如何在Spring Boot项目中整合WebSocket，这是一项用于实现实时双向通信的技术，为我们的应用程序增添动态和交互性。

1. 什么是WebSocket？

在我们深入研究整合过程之前，让我们先来了解一下WebSocket。

WebSocket： 是一种在单个TCP连接上进行全双工通信的协议。它通过在客户端和服务器之间保持持久连接，实现了服务器可以主动向客户端推送信息的功能。WebSocket通常用于实现实时性要求较高的应用，如在线聊天、实时通知等。

2. 创建Spring Boot项目

首先，我们需要创建一个Spring Boot项目。你可以使用Spring Initializer（https://start.spring.io/）进行项目的初始化，选择相应的依赖，包括Spring Web等。

3. 引入WebSocket依赖

在项目的pom.xml文件中，添加Spring WebSocket的依赖：

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>

4. 创建WebSocket配置

创建一个WebSocket配置类，配置WebSocket的相关信息：

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {

    @Override
    public void configureMessageBroker(MessageBrokerRegistry config) {
        config.enableSimpleBroker("/topic");
        config.setApplicationDestinationPrefixes("/app");
    }

    @Override
    public void registerStompEndpoints(StompEndpointRegistry registry) {
        registry.addEndpoint("/ws").withSockJS();
    }
}

5. 创建WebSocket消息处理器

编写一个处理WebSocket消息的处理器：

@Controller
public class WebSocketController {

    @MessageMapping("/hello")
    @SendTo("/topic/greetings")
    public Greeting greeting(HelloMessage message) {
        return new Greeting("Hello, " + message.getName() + "!");
    }
}

6. 创建消息模型

定义用于传递消息的数据模型：

@Data
public class HelloMessage {
    private String name;
}

@Data
public class Greeting {
    private String content;

    public Greeting(String content) {
        this.content = content;
    }
}

7. 创建前端页面

编写一个简单的HTML页面，用于发送和接收WebSocket消息：

<!DOCTYPE html>
<html>
<head>
    <title>WebSocket Example</title>
    <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
    <script src="https://cdn.jsdelivr.net/sockjs/1.5.1/sockjs.min.js"></script>
    <script src="https://cdn.jsdelivr.net/stomp.js/2.3.3/stomp.min.js"></script>
</head>
<body>
    <form id="form">
        <input type="text" id="name" placeholder="Your Name">
        <button type="button" onclick="sendMessage()">Send</button>
    </form>
    <div id="response"></div>

    <script>
        var stompClient = null;

        function connect() {
            var socket = new SockJS('/ws');
            stompClient = Stomp.over(socket);
            stompClient.connect({}, function (frame) {
                console.log('Connected: ' + frame);
                stompClient.subscribe('/topic/greetings', function (greeting) {
                    showGreeting(JSON.parse(greeting.body).content);
                });
            });
        }

        function sendMessage() {
            var name = document.getElementById('name').value;
            stompClient.send("/app/hello", {}, JSON.stringify({ 'name': name }));
        }

        function showGreeting(message) {
            var response = document.getElementById('response');
            var p = document.createElement('p');
            p.style.wordWrap = 'break-word';
            p.appendChild(document.createTextNode(message));
            response.appendChild(p);
        }

        connect();
    </script>
</body>
</html>

8. 运行和测试

完成上述步骤后，你可以运行Spring Boot应用程序，访问前端页面，输入姓名并点击发送按钮，即可在页面上看到实时的WebSocket消息。

结语

通过以上简单的步骤，我们成功地将Spring Boot与WebSocket整合在一起，为我们的应用程序提供了实时双向通信的功能。希望这篇文章对你在项目中使用WebSocket时有所帮助。

虫小宝

关注

12
点赞
踩
13

收藏

觉得还不错? 一键收藏
0
评论
Spring Boot整合WebSocket

在我们深入研究整合过程之前，让我们先来了解一下WebSocket。是一种在单个TCP连接上进行全双工通信的协议。它通过在客户端和服务器之间保持持久连接，实现了服务器可以主动向客户端推送信息的功能。WebSocket通常用于实现实时性要求较高的应用，如在线聊天、实时通知等。通过以上简单的步骤，我们成功地将Spring Boot与WebSocket整合在一起，为我们的应用程序提供了实时双向通信的功能。希望这篇文章对你在项目中使用WebSocket时有所帮助。
复制链接

扫一扫