SpringBoot 集成 WebSocket，實現后臺向前端推送信息

<dependency>??
???????????<groupId>org.springframework.bootgroupId>??
???????????<artifactId>spring-boot-starter-websocketartifactId>??
dependency>

@Configuration
public?class?WebSocketConfig?{
????@Bean
????public?ServerEndpointExporter?serverEndpointExporter()?{
????????return?new?ServerEndpointExporter();
????}
}

/**
?* @ ServerEndpoint 注解是一個類層次的注解，它的功能主要是將目前的類定義成一個websocket服務器端,
?* 注解的值將被用于監(jiān)聽用戶連接的終端訪問URL地址,客戶端可以通過這個URL來連接到WebSocket服務器端
?*/
@Component
@Slf4j
@Service
@ServerEndpoint("/api/websocket/{sid}")
public?class?WebSocketServer?{
????//靜態(tài)變量，用來記錄當前在線連接數。應該把它設計成線程安全的。
????private?static?int?onlineCount =?0;
????//concurrent包的線程安全Set，用來存放每個客戶端對應的MyWebSocket對象。
????private?static?CopyOnWriteArraySet webSocketSet =?new?CopyOnWriteArraySet();

????//與某個客戶端的連接會話，需要通過它來給客戶端發(fā)送數據
????private?Session session;

????//接收sid
????private?String sid =?"";

????/**
?????* 連接建立成功調用的方法
?????*/
????@OnOpen
????public?void?onOpen(Session session, @PathParam("sid")?String sid)?{
????????this.session = session;
????????webSocketSet.add(this);?//加入set中
????????this.sid = sid;
????????addOnlineCount();?//在線數加1
????????try?{
????????????sendMessage("conn_success");
????????????log.info("有新窗口開始監(jiān)聽:"?+ sid +?",當前在線人數為:"?+ getOnlineCount());
????????}?catch?(IOException e) {
????????????log.error("websocket IO Exception");
????????}
????}

????/**
?????* 連接關閉調用的方法
?????*/
????@OnClose
????public?void?onClose()?{
????????webSocketSet.remove(this);?//從set中刪除
????????subOnlineCount();?//在線數減1
????????//斷開連接情況下，更新主板占用情況為釋放
????????log.info("釋放的sid為："+sid);
????????//這里寫你 釋放的時候，要處理的業(yè)務
????????log.info("有一連接關閉！當前在線人數為"?+ getOnlineCount());

????}

????/**
?????* 收到客戶端消息后調用的方法
?????* @ Param message 客戶端發(fā)送過來的消息
?????*/
????@OnMessage
????public?void?onMessage(String message, Session session)?{
????????log.info("收到來自窗口"?+ sid +?"的信息:"?+ message);
????????//群發(fā)消息
????????for?(WebSocketServer item : webSocketSet) {
????????????try?{
????????????????item.sendMessage(message);
????????????}?catch?(IOException e) {
????????????????e.printStackTrace();
????????????}
????????}
????}

????/**
?????* @ Param session
?????* @ Param error
?????*/
????@OnError
????public?void?onError(Session session, Throwable error)?{
????????log.error("發(fā)生錯誤");
????????error.printStackTrace();
????}

????/**
?????* 實現服務器主動推送
?????*/
????public?void?sendMessage(String message)?throws?IOException?{
????????this.session.getBasicRemote().sendText(message);
????}

????/**
?????* 群發(fā)自定義消息
?????*/
????public?static?void?sendInfo(String message, @PathParam("sid")?String sid)?throws?IOException?{
????????log.info("推送消息到窗口"?+ sid +?"，推送內容:"?+ message);

????????for?(WebSocketServer item : webSocketSet) {
????????????try?{
????????????????//這里可以設定只推送給這個sid的，為null則全部推送
????????????????if?(sid ==?null) {
// item.sendMessage(message);
????????????????}?else?if?(item.sid.equals(sid)) {
????????????????????item.sendMessage(message);
????????????????}
????????????}?catch?(IOException e) {
????????????????continue;
????????????}
????????}
????}

????public?static?synchronized?int?getOnlineCount()?{
????????return?onlineCount;
????}

????public?static?synchronized?void?addOnlineCount()?{
????????WebSocketServer.onlineCount++;
????}

????public?static?synchronized?void?subOnlineCount()?{
????????WebSocketServer.onlineCount--;
????}

????public?static?CopyOnWriteArraySet?getWebSocketSet()?{
????????return?webSocketSet;
????}
}

@Controller("web_Scoket_system")
@RequestMapping("/api/socket")
public?class?SystemController {
????//頁面請求
????@GetMapping("/index/{userId}")
????public?ModelAndView socket(@PathVariable?String?userId) {
????????ModelAndView mav =?new?ModelAndView("/socket1");
????????mav.addObject("userId", userId);
????????return?mav;
????}

????//推送數據接口
????@ResponseBody
????@RequestMapping("/socket/push/{cid}")
????public?Map pushToWeb(@PathVariable?String?cid,?String?message) {
????????Map<String,Object> result =?new?HashMap<>();
????????try?{
????????????WebSocketServer.sendInfo(message, cid);
????????????result.put("code", cid);
????????????result.put("msg", message);
????????}?catch?(IOException e) {
????????????e.printStackTrace();
????????}
????????return?result;
????}
}

<html>

<head>
<meta?charset="utf-8">
<title>Java后端WebSocket的Tomcat實現title>
<script?type="text/javascript"?src="js/jquery.min.js">script>
head>

<body>
<div?id="main"?style="width: 1200px;height:800px;">div>
Welcome<br/><input?id="text"?type="text"?/>
<button?onclick="send()">發(fā)送消息button>
<hr/>
<button?onclick="closeWebSocket()">關閉WebSocket連接button>
<hr/>
<div?id="message">div>
body>
<script?type="text/javascript">
var?websocket =?null;
//判斷當前瀏覽器是否支持WebSocket
if('WebSocket'?in?window) {
//改成你的地址
websocket =?new?WebSocket("ws://192.168.100.196:8082/api/websocket/100");
}?else?{
alert('當前瀏覽器 Not support websocket')
}

//連接發(fā)生錯誤的回調方法
websocket.onerror =?function()?{
setMessageInnerHTML("WebSocket連接發(fā)生錯誤");
};

//連接成功建立的回調方法
websocket.onopen =?function()?{
setMessageInnerHTML("WebSocket連接成功");
}
var?U01data, Uidata, Usdata
//接收到消息的回調方法
websocket.onmessage =?function(event)?{
console.log(event);
setMessageInnerHTML(event);
setechart()
}

//連接關閉的回調方法
websocket.onclose =?function()?{
setMessageInnerHTML("WebSocket連接關閉");
}

//監(jiān)聽窗口關閉事件，當窗口關閉時，主動去關閉websocket連接，防止連接還沒斷開就關閉窗口，server端會拋異常。
window.onbeforeunload =?function()?{
closeWebSocket();
}

//將消息顯示在網頁上
function?setMessageInnerHTML(innerHTML)?{
document.getElementById('message').innerHTML += innerHTML +?'
';
}

//關閉WebSocket連接
function?closeWebSocket()?{
websocket.close();
}

//發(fā)送消息
function?send()?{
var?message =?document.getElementById('text').value;
websocket.send('{"msg":"'?+ message +?'"}');
setMessageInnerHTML(message +?"
");
}
script>

html>