1、 首先通过 idea 创建一个 Springboot 项目，具体操作步骤如下：
点击 next
点击 next
按照上图操作
点击 finish 完成项目
2、 创建好的项目的目录结构
3、 创建如下的目录结构
4、 先定义一个常量类备用，代码如下：
5、 创建配置类
6、 定义 POJO 类
接收客户端发过来的消息注意，项目采用了 lombok 和 fastjson，需要在 pom 文件中加载相关依赖
<dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId> <optional>true</optional> </dependency> <dependency> <groupId>com.alibaba</groupId> <artifactId>fastjson</artifactId> <version>1.2.54</version> </dependency>7、 定义 service 接口和 service 实现类
8、 创建控制类，用于接收和响应消息
10、 现在编写测试程序，先下载相关的 js 库支持，如下图所示：
11、 编写测试页面，代码如下：
<!DOCTYPE html> <html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>WebScoket测试</title> <script src="./test/jquery.min.js"></script> <script src="./test/sockjs.min.js"></script> <script src="./test/stomp.min.js"></script> </head> <body onload="disconnect()"> <div> <div> <button id="connect" onclick="connect();" disabled="">连接</button> <button id="disconnect" onclick="disconnect();">断开连接</button> </div> <div id="conversationDiv" style="visibility: visible;"> <label>输入你的名字</label><input type="text" id="name"> <button id="sendName" onclick="sendName();">发送</button> <p id="response"></p> </div> </div> <script type="text/javascript"> var stompClient = null; function setConnected(connected) { document.getElementById('connect').disabled = connected; document.getElementById('disconnect').disabled = !connected; document.getElementById('conversationDiv').style.visibility = connected ? 'visible' : 'hidden'; $('#response').html(); } function connect() { // websocket的连接地址，此值等于WebSocketMessageBrokerConfigurer中registry.addEndpoint("/websocket-simple").withSockJS()配置的地址 var socket = new SockJS('http://localhost:8080/gs-guide-websocket'); stompClient = Stomp.over(socket); stompClient.connect({}, function(frame) { setConnected(true); console.log('Connected: ' + frame); // 客户端订阅消息的目的地址：此值BroadcastCtl中被@SendTo("/topic/getResponse")注解的里配置的值 stompClient.subscribe('/user/' + 123 + '/msg', function(respnose){ showResponse(JSON.parse(respnose.body).content); }); }); } function disconnect() { if (stompClient != null) { stompClient.disconnect(); } setConnected(false); console.log("Disconnected"); } function sendName() { var name = $('#name').val(); // 客户端消息发送的目的：服务端使用BroadcastCtl中@MessageMapping("/receive")注解的方法来处理发送过来的消息 stompClient.send("/app/receive", {}, JSON.stringify({ 'id': 123, 'name': name })); } function showResponse(message) { var response = $("#response"); response.html(message + "\r\n" + response.html()); } </script> </body></html>12、 启动 java 程序，页面用浏览器打开，出现如下效果，证明搭建成功。
13、 项目下载
欢迎来到这里！
我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。
注册 关于