springboot整合使用websocket
1.整合依赖
<!--webSocket-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
2.websocket配置类:
package com.jzyz.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;
@Configuration
public class WebSocketConfig {
@Bean
public ServerEndpointExporter serverEndpointExporter() {
return new ServerEndpointExporter();
}
}
3.websocket操作类
package com.jzyz.websocket;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Component;
import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import java.util.concurrent.ConcurrentHashMap;
import java.util.concurrent.CopyOnWriteArraySet;
@Component
@ServerEndpoint("/websocket/{userId}")
public class WebSocketServer {
private Logger logger = LoggerFactory.getLogger(this.getClass());
private Session session;
private String userId;
private static CopyOnWriteArraySet<WebSocketServer> webSockets = new CopyOnWriteArraySet<>();
private static ConcurrentHashMap<String, Session> sessionPool = new ConcurrentHashMap<String, Session>();
@OnOpen
public void onOpen(Session session, @PathParam(value = "userId") String userId) {
try {
this.session = session;
this.userId = userId;
webSockets.add(this);
sessionPool.put(userId, session);
logger.info("【websocket消息】有新的连接,总数为:" + webSockets.size());
} catch (Exception e) {
}
}
@OnClose
public void onClose() {
try {
webSockets.remove(this);
sessionPool.remove(this.userId);
logger.info("【websocket消息】连接断开,总数为:" + webSockets.size());
} catch (Exception e) {
}
}
@OnMessage
public void onMessage(String message) {
logger.info("【websocket消息】收到客户端消息:" + message);
}
@OnError
public void onError(Session session, Throwable error) {
logger.error("用户错误,原因:" + error.getMessage());
error.printStackTrace();
}
public void sendAllMessage(String message) {
logger.info("【websocket消息】广播消息:" + message);
for (WebSocketServer webSocket : webSockets) {
try {
if (webSocket.session.isOpen()) {
webSocket.session.getAsyncRemote().sendText(message);
}
} catch (Exception e) {
e.printStackTrace();
}
}
}
public void sendOneMessage(String userId, String message) {
Session session = sessionPool.get(userId);
if (session != null && session.isOpen()) {
try {
logger.info("【websocket消息】 单点消息:" + message);
session.getAsyncRemote().sendText(message);
} catch (Exception e) {
e.printStackTrace();
}
}
}
public void sendMoreMessage(String[] userIds, String message) {
for (String userId : userIds) {
Session session = sessionPool.get(userId);
if (session != null && session.isOpen()) {
try {
logger.info("【websocket消息】 单点消息:" + message);
session.getAsyncRemote().sendText(message);
} catch (Exception e) {
e.printStackTrace();
}
}
}
}
}
4.前端测试代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>websocket通讯</title>
</head>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script>
let socket;
function openSocket() {
const socketUrl = "ws://localhost:9090/websocket/10";
console.log(socketUrl);
if (socket != null) {
socket.close();
socket = null;
}
socket = new WebSocket(socketUrl);
socket.onopen = function () {
console.log("websocket已打开");
};
socket.onmessage = function (msg) {
console.log(msg.data);
$('#showContent').text(msg.data);
};
socket.onclose = function () {
console.log("websocket已关闭");
};
socket.onerror = function () {
console.log("websocket发生了错误");
}
}
function sendMessage() {
socket.send('contentText":"' + $("#contentText").val());
console.log('contentText":"' + $("#contentText").val());
}
</script>
<body>
<p>【socket开启者的ID信息】:
<div><input id="userId" name="userId" type="text" value="10"></div>
<p>【客户端向服务器发送的内容】:
<div>
<input id="contentText" name="contentText" type="text" value="hello websocket">
</div>
<p>【操作】:
<button><a onclick="openSocket()">开启socket</a></button>
</p>
<p>【操作】:
<button><a onclick="sendMessage()">发送消息</a></button>
</p>
<p>显示结果:</p>
<span id="showContent"></span>
</body>
</html>