WebSocket使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在WebSocket API中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。
模拟实战场景:后端通过websocket向前端推送告警信息,前端向后端发送一些信息。
后端websocket相关代码:
其中websocket包下是websockt相关的配置代码,job下是定时任务,负责推送告警消息
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.WebSocketHandler;
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 {
@Override
public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
registry.addHandler(myHandler(), "/websocket").setAllowedOrigins("*");
}
@Bean
public WebSocketHandler myHandler() {
return new MyWebSocketHandler();
}
}
WebSocketConfig类,监听了/websocket路径下的所有域的请求,实际开发中请设置
AllowedOrigins为内部前端页面的域名
import org.springframework.web.socket.CloseStatus;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;
import java.util.HashSet;
import java.util.Set;
public class MyWebSocketHandler extends TextWebSocketHandler {
public static Set<WebSocketSession> sessions = new HashSet<>();
@Override
public void afterConnectionEstablished(WebSocketSession session) throws Exception {
sessions.add(session);
session.sendMessage(new TextMessage("客户端连接成功"));
}
@Override
protected void handleTextMessage(WebSocketSession session, TextMessage message)
throws Exception {
System.out.println("收到消息: " + message.getPayload());
session.sendMessage(new TextMessage("后端已经收到: " + message.getPayload()));
}
@Override
public void handleTransportError(WebSocketSession session, Throwable exception) throws Exception {
sessions.remove(session);
}
@Override
public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
sessions.remove(session);
}
}
MyWebSocketHandler类,继承了AbstractWebSocketHandler
主要重写了建立连接后进行的操作,收到前端消息后进行的操作;传输错误后或连接关闭后,session池将session移除。
import org.springframework.stereotype.Service;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import java.io.IOException;
@Service
public class WebscoketService {
public void sendAllMessages(String text) throws IOException {
for (WebSocketSession session : MyWebSocketHandler.sessions) {
session.sendMessage(new TextMessage(text));
}
}
}
service层,将session池里的所有连接推送消息。
import com.hn.managmentsystem.websocket.WebscoketService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.scheduling.annotation.Scheduled;
import org.springframework.stereotype.Component;
import java.io.IOException;
@Component
public class AlarmPushJob {
@Autowired
private WebscoketService webscoketService;
@Scheduled(cron = "*/5 * * * * ?")
private void pushAlarm() throws IOException {
System.out.println("开始执行");
webscoketService.sendAllMessages("告警推送");
}
}
推送定时作业
前端页面代码:
<html>
<script type="text/javascript">
if ("WebSocket" in window) {
var ws = new WebSocket("ws://localhost:18080/websocket");
ws.onopen = function () {
};
ws.onmessage = function (evt) {
document.getElementById('messageDiv').innerHTML += evt.data + "</br>";
};
ws.onclose = function () {
console.log("close connect");
};
} else {
alert("您的浏览器不支持 WebSocket!");
}
function send() {
ws.send(document.getElementById("message").value);
}
</script>
</head>
<body>
<a href="#" onclick="send();">发送消息</a>: <input id="message"/>
<div id="messageDiv"></div>
</body>
</html>
实际效果: