1、websocket在springboot中的一種實(shí)現(xiàn)
十年的金華網(wǎng)站建設(shè)經(jīng)驗(yàn),針對(duì)設(shè)計(jì)、前端、開(kāi)發(fā)、售后、文案、推廣等六對(duì)一服務(wù),響應(yīng)快,48小時(shí)及時(shí)工作處理。成都全網(wǎng)營(yíng)銷的優(yōu)勢(shì)是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同,自動(dòng)調(diào)整金華建站的顯示方式,使網(wǎng)站能夠適用不同顯示終端,在瀏覽器中調(diào)整網(wǎng)站的寬度,無(wú)論在任何一種瀏覽器上瀏覽網(wǎng)站,都能展現(xiàn)優(yōu)雅布局與設(shè)計(jì),從而大程度地提升瀏覽體驗(yàn)。成都創(chuàng)新互聯(lián)從事“金華網(wǎng)站設(shè)計(jì)”,“金華網(wǎng)站推廣”以來(lái),每個(gè)客戶項(xiàng)目都認(rèn)真落實(shí)執(zhí)行。
在java后臺(tái)中,websocket是作為一種服務(wù)端配置,其配置如下
@Configuration public class WebSocketConfig { @Bean(name="serverEndpointExporter") public ServerEndpointExporter getServerEndpointExporterBean(){ return new ServerEndpointExporter(); } }
加入上面的配置之后就可以編輯自己的websocket實(shí)現(xiàn)類了,如下
@Component @ServerEndpoint(value = "/messageSocket/{userId}") public class MessageWebSocket { private static final Logger logger = LoggerFactory.getLogger(MessageWebSocket.class); /** * 靜態(tài)變量,用來(lái)記錄當(dāng)前在線連接數(shù)。應(yīng)該把它設(shè)計(jì)成線程安全的。 */ private static int onlineCount = 0; /** * key: userId value: sessionIds */ private static ConcurrentHashMap<Integer, ConcurrentLinkedQueue<String>> userSessionMap = new ConcurrentHashMap<>(); /** * concurrent包的線程安全Map,用來(lái)存放每個(gè)客戶端對(duì)應(yīng)的MyWebSocket對(duì)象。 */ private static ConcurrentHashMap<String, MessageWebSocket> websocketMap = new ConcurrentHashMap<>(); /** * key: sessionId value: userId */ private static ConcurrentHashMap<String, Integer> sessionUserMap = new ConcurrentHashMap<>(); /** * 當(dāng)前連接會(huì)話,需要通過(guò)它來(lái)給客戶端發(fā)送數(shù)據(jù) */ private Session session; /** * 連接建立成功調(diào)用的方法 * */ @OnOpen public void onOpen(Session session, @PathParam("userId") Integer userId) { System.out.println(applicationContext); try { this.session = session; String sessionId = session.getId(); //建立userId和sessionId的關(guān)系 if(userSessionMap.containsKey(userId)) { userSessionMap.get(userId).add(sessionId); }else{ ConcurrentLinkedQueue<String> queue = new ConcurrentLinkedQueue<>(); queue.add(sessionId); userSessionMap.put(userId, queue); } sessionUserMap.put(sessionId, userId); //建立sessionId和websocket引用的關(guān)系 if(!websocketMap.containsKey(sessionId)){ websocketMap.put(sessionId, this); addOnlineCount(); //在線數(shù)加1 } }catch (Exception e){ logger.error("連接失敗"); String es = ExceptionUtils.getFullStackTrace(e); logger.error(es); } } /** * 連接關(guān)閉調(diào)用的方法 */ @OnClose public void onClose() { String sessionId = this.session.getId(); //移除userId和sessionId的關(guān)系 Integer userId = sessionUserMap.get(sessionId); sessionUserMap.remove(sessionId); if(userId != null) { ConcurrentLinkedQueue<String> sessionIds = userSessionMap.get(userId); if(sessionIds != null) { sessionIds.remove(sessionId); if (sessionIds.size() == 0) { userSessionMap.remove(userId); } } } //移除sessionId和websocket的關(guān)系 if (websocketMap.containsKey(sessionId)) { websocketMap.remove(sessionId); subOnlineCount(); //在線數(shù)減1 } } /** * 收到客戶端消息后調(diào)用的方法 * * @param messageStr 客戶端發(fā)送過(guò)來(lái)的消息 **/ @OnMessage public void onMessage(String messageStr, Session session, @PathParam("userId") Integer userId) throws IOException { } /** * * @param session * @param error 當(dāng)連接發(fā)生錯(cuò)誤時(shí)的回調(diào) */ @OnError public void onError(Session session, Throwable error) { String es = ExceptionUtils.getFullStackTrace(error); logger.error(es); } /** * 實(shí)現(xiàn)服務(wù)器主動(dòng)推送 */ public void sendMessage(String message, Integer toUserId) throws IOException { if(toUserId != null && !StringUtil.isEmpty(message.trim())){ ConcurrentLinkedQueue<String> sessionIds = userSessionMap.get(toUserId); if(sessionIds != null) { for (String sessionId : sessionIds) { MessageWebSocket socket = websocketMap.get(sessionId); socket.session.getBasicRemote().sendText(message); } } }else{ logger.error("未找到接收用戶連接,該用戶未連接或已斷開(kāi)"); } } public void sendMessage(String message, Session session) throws IOException { session.getBasicRemote().sendText(message); } /** *獲取在線人數(shù) */ public static synchronized int getOnlineCount() { return onlineCount; } /** *在線人數(shù)加一 */ public static synchronized void addOnlineCount() { MessageWebSocket.onlineCount++; } /** *在線人數(shù)減一 */ public static synchronized void subOnlineCount() { MessageWebSocket.onlineCount--; } }
到此后臺(tái)服務(wù)端的工作已經(jīng)做好了,前端如何作為客戶端進(jìn)行連接呢,請(qǐng)繼續(xù)往下看。。
為了實(shí)現(xiàn)斷開(kāi)自動(dòng)重連,我們使用的reconnecting-websocket.js
組件
//websocket連接實(shí)例 let websocket = null; //初始話websocket實(shí)例 function initWebSocket(userId) { // ws地址 -->這里是你的請(qǐng)求路徑 let host = urlConfig.wsUrl + 'messageSocket/' + userId; if ('WebSocket' in window) { websocket = new ReconnectingWebSocket(host); // 連接錯(cuò)誤 websocket.onerror = function () { } // 連接成功 websocket.onopen = function () { } // 收到消息的回調(diào),e.data為收到的信息 websocket.onmessage = function (e) { } // 連接關(guān)閉的回調(diào) websocket.onclose = function () { } //監(jiān)聽(tīng)窗口關(guān)閉事件,當(dāng)窗口關(guān)閉時(shí),主動(dòng)去關(guān)閉websocket連接,防止連接還沒(méi)斷開(kāi)就關(guān)閉窗口,server端會(huì)拋異常。 window.onbeforeunload = function () { closeWebSocket(); } } else { alert('當(dāng)前瀏覽器不支持websocket') return; } } //關(guān)閉WebSocket連接 function closeWebSocket() { websocket.close(); } //發(fā)送消息 function sendMessage(message){ websocket.send(message); }
至此一個(gè)簡(jiǎn)易的完整的websocket已經(jīng)完成了,具體功能可以依此為基本進(jìn)行擴(kuò)展。
總結(jié)
以上所述是小編給大家介紹的websocket在springboot+vue中的使用教程,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)歡迎給大家留言,小編會(huì)及時(shí)回復(fù)大家的!
文章標(biāo)題:websocket在springboot+vue中的使用教程
URL標(biāo)題:http://muchs.cn/article40/ijsoho.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供定制網(wǎng)站、網(wǎng)站營(yíng)銷、全網(wǎng)營(yíng)銷推廣、網(wǎng)站導(dǎo)航、網(wǎng)站排名、做網(wǎng)站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
網(wǎng)頁(yè)設(shè)計(jì)公司知識(shí)