首先 pom.xml
<carent> <roupId> org.springframework.boot </groupId> <ratifactid> Spring-Boot-Starter-Parent </artifactid> <version> 1.5.8.release </เวอร์ชัน> </parent> rtifactId> </การพึ่งพา> <การพึ่งพา> <roupId> javax.websocket </groupId> <ratifactId> javax.websocket-api </artifactid> <version> 1.0 </เวอร์ชัน> <pope> ให้ </scope> ID> <ArtIfactId> Spring-Websocket </artifactId> </serdency> <การพึ่งพา> <roupId> org.springframework.boot </groupId> <ratifactid> Spring-Boot-Starter-Web </artifactid> GroupID> <ArtIfactId> Spring-Boot-Starter-Tomcat </artifactId> </eclusision> </การยกเว้น> </การพึ่งพาอาศัย> <การพึ่งพาอาศัย> <roupId> org.springframework.boot </groupid>
接收消息后的处理类 GameHandler:
นำเข้า java.net.uri; นำเข้า org.springframework.web.socket.binaryMessage; นำเข้า org.springframework.web.socket.closestatus; นำเข้า org.springframework.web.socket.pongmessage; org.springframework.web.socket.websocketsession; นำเข้า org.springframework.web.socket.handler.abstractwebsockethandler; Gamehandler ระดับสาธารณะขยายบทคัดย่อ เซสชัน, ข้อความข้อความข้อความ) โยนข้อยกเว้น {session.sendMessage (TextMessage ใหม่ (message.asbytes ())); } / ** * 处理二进制类的信息 * * เซสชัน @param * @param message * @throws Exception * / @Override Void HandleBinaryMessage (Sessions Session, BinaryMessage Message) โยนข้อยกเว้น {Session.SendMessage (BinaryMessage ใหม่ } / ** * ping-pong * * @param เซสชัน * @param ข้อความ * @throws Exception * / @Override Void HandlepongMessage (WebSocketSession เซสชัน, ข้อความ pongmessage) โยนข้อยกเว้น {} / ** * 传出错误的处理 * * @param session * @param } / ** * 连接关闭的处理 * * @param เซสชัน * สถานะ @param * @throws Exception * / @Override โมฆะสาธารณะ public AfterConnectionClosed (SessionSession Session, สถานะใกล้เคียง) โยนข้อยกเว้น {} / ** * 连接建立后的处理 * * @param เซสชัน @Param握手信息拦截器 WebSocketHandshakeInterceptor:
นำเข้า java.util.map; นำเข้า javax.servlet.http.cookie; นำเข้า org.springframework.http.server.serverhttprequest; นำเข้า org.springframework.http.server.serverhttpresponse; org.springframework.http.server.servletserverhttprequest; นำเข้า org.springframework.web.socket.websockethandler; นำเข้า org.springframework.web.socket.server. ก่อนหน้านี้ (คำขอ serverhttprequest, serverhttpresponse shr1, websockethandler wsh, แผนที่ <สตริง, วัตถุ> แอตทริบิวต์) โยนข้อยกเว้น {// 此处可以做一些权限认证的事情或者其他ส่งคืนจริง; } @Override โมฆะสาธารณะ Afterhandshake (ServerhttpRequest Shr, Serverhttpresponse Shr1, WebSockethandler WSH, Excptn Excptn) {}}使用 WebSocket 的配置类 WebSocketConfig:
นำเข้า org.springframework.context.annotation.bean; นำเข้า org.springframework.context.annotation.configuration; นำเข้า org.springframework.web.servlet.config.annotation.webmvcconfigureradapter; org.springframework.web.socket.config.annotation.enablewebsocket นำเข้า org.springframework.web.socket.config.annotation.websocketconfigurer; Class WebSocketConfig ขยาย WebMVCCONFigurerAdapter ใช้ WebSocketConfigurer {@Override โมฆะสาธารณะ registerWebSockethandlers (WebSockethandlerRegistry Registry) {// 允许连接的域, 只能以 http 或 https 开头 string [] "http: // localhost: 1213"}; registry.addhandler (gamehandler (), "/game"). addinterceptors (handshakeInterceptor ()). setallowedorigins (lewayorigins); } @Bean Public GameHandler GameHandler () {ส่งคืน GameHandler ใหม่ (); } @Bean สาธารณะ WebSocketHandshakeInterceptor HandshakeInterceptor () {ส่งคืน WebSocketHandshakeInterceptor () ใหม่ (); -启动类 Launcher:
@SpringBootaplicplicationPublic คลาส Launcher {public Static Void Main (String [] params) {SpringApplication.run (Launcher.class, params);}}配置文件หลัก/ทรัพยากร/แอปพลิเคชัน. properties:
Server.port = 1213Server.Session-Timeout = 1800Server.UnderTow.io-Threads = 4Server.UnderTow.Worker-Threads = 20Server.UnderTow.Buffer-Size = 1024Server
前端的测试页面หลัก/ทรัพยากร/คงที่/index.html
<! doctype html> <html lang = "zh-cn"> <head> <meta charset = "utf-8"> <meta http-equiv = "x-ua content =" edge = edge "> href = "https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel = "ภายนอก nofollow" rel = "stylesheet"> <!-<ลิงค์ href = "https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel = "external nofollow" rel = "stylesheet">-> <script src = "https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"> </script> <script src = "https://cdn.bootcss.com/jquery-scrollto/2.1.2/jquery.scrollto.min.min.min.min.min.min.min. src = "https://cdnjs.cloudflare.com/ajax/libs/pako/1.0.6/pako.min.js"> </script> <!-[ถ้า LT คือ 9]> <สคริปต์ src = "https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"> </script> <script src = "https://cdn.bootcss.com/respond.js/1.4.2.2/respond.min.min.min.min.min.min. #Message {ความสูง: 600px; Overflow-y: อัตโนมัติ; } </style> </head> <body> <div> <h1> หน้าทดสอบ WebSocket </h1> <hr/> <div> <div> <label for = "wsaddr"> ที่อยู่ websocket: </label> <div> <span id = "basic-ws"> ws: //127.0.0.1: 1213/</ Aria-Describedby = "Basic-ws" placeholder = "game" data-container = "body" data-placement = "top" data-content = "链接地址不能为空, 请填写"> </div> </div> <button type = "ปุ่ม" id = "btnconnect" onclick = "เชื่อมต่อ () id = "btnclose" disabled = "ปิดใช้งาน" onclick = "closeWebsocket ();"> <span aria-hidden = "true"> </span> 断开 </button> <button type = "ปุ่ม" id = "btnsend" disabled = "disabled" style = "margin-left: 50px;" onclick = "send ();"> <span aria-hidden = "true"> </span> 发送消息 </button> </div> <br/> <textarea id = "inmsg" rows = "5" placeholder = "在这里输入需要发送的信息 ... "> </textarea> <hr/> <div id = "ข้อความ" src = "https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"> </script> <script type = "text/javascript"> ฟังก์ชั่น zip (str) {var binarystring = pako.gzip (str กลับ BTOA (binarystring); } ฟังก์ชั่น unzip (b64data) {var strdata = atob (b64data); var chardata = strdata.split ('') แผนที่ (ฟังก์ชั่น (x) {return x.charcodeat (0);}); var bindata = ใหม่ uint8array (chardata); ข้อมูล var = pako.inflate (bindata); strdata = string.fromCharcode.Apply (null, ใหม่ UINT16ARRAY (ข้อมูล)); กลับ strdata; } var webSocket = null; var wsbaseurl = null; var wsurl = null; ฟังก์ชั่น init () {wsbaseurl = "ws: //" + window.location.host + "/"; $ ("#basic-ws") ข้อความ (wsbaseurl); $ (function () {$ ('[data-toggle = "popover"]'). popover ();}); กลับเท็จ; } // 关闭 webSocket 连接ฟังก์ชั่น closewebsocket () {ถ้า (websocket) {websocket.close (); } return false; } // 将消息显示在网页上ฟังก์ชั่น setMessageInnerHtml (WHO, msg) {var message = null; if (who === 1) {message = '<div role = "Alert"> 本地:' + msg + '</div>'; } else {message = '<div role = "Alert"> 服务器:' + msg + '</div>'; } document.getElementById ('ข้อความ'). innerhtml = (document.getElementById ('ข้อความ'). InnerHtml + ข้อความ); $ ("#message"). Scrollto ('100%'); กลับเท็จ; } // 发送消息ฟังก์ชั่นส่ง () {ถ้า (webSocket) {var message = $ ("#inmsg"). val (); websocket.send (zip (ข้อความ)); SetMessageInnerHtml (1, ข้อความ); } return false; } function connect () {var url = $ ("#basic-ws-addr"). val (); if (url.length <= 0) {$ ('#basic-ws-addr'). popover ('show'); settimeout (function () {$ ('#basic-ws-addr'). popover ('ซ่อน');}, 3000); } else {WSURL = WSBASEURL + URL; if ('webSocket' ในหน้าต่าง) {webSocket = ใหม่ webSocket (wsurl); // 连接发生错误的回调方法 webSocket.onerror = function () {setMessageInnerHtml (0, "WebSocket 连接发生错误 ->" + WSURL); $ ("#btnconnect"). Removeattr ("ปิดใช้งาน"); $ ("#btnclose"). attr ("ปิดใช้งาน", "ปิดใช้งาน"); $ ("#btnsend"). attr ("ปิดใช้งาน", "ปิดใช้งาน"); - // 连接成功建立的回调方法 webSocket.onopen = function () {setMessageInnerHtml (0, "WebSocket 连接成功 ->" + WSURL); $ ("#btnconnect"). attr ("ปิดใช้งาน", "ปิดใช้งาน"); $ ("#btnclose"). Removeattr ("ปิดใช้งาน"); $ ("#btnsend"). Removeattr ("ปิดใช้งาน"); - // 接收到消息的回调方法 webSocket.onMessage = function (เหตุการณ์) {setMessageInnerHtml (0, unzip (event.data)); - // 连接关闭的回调方法 webSocket.onclose = function () {setMessageInnerHtml (0, "WebSocket 连接关闭 ->" + WSURL); $ ("#btnconnect"). Removeattr ("ปิดใช้งาน"); $ ("#btnclose"). attr ("ปิดใช้งาน", "ปิดใช้งาน"); $ ("#btnsend"). attr ("ปิดใช้งาน", "ปิดใช้งาน"); - // 监听窗口关闭事件, 当窗口关闭时, 主动去关闭 WebSocket 连接, 防止连接还没断开就关闭窗口,, Server 端会抛异常。 window.onbeforeunload = function () {closewebsocket (); - } else {Alert ('ไม่สนับสนุน WebSocket'); }} return false; } window.onload = init (); </script> </body> </html>到此就可以使用 WebSocket 进行前后端的通信了, 如果大家还有不明白的或者有更好的方法, 可以在下方的留言区讨论。