1, 添加配置类
- import org.springframework.context.annotation.Bean;
- import org.springframework.context.annotation.Configuration;
- import org.springframework.web.socket.server.standard.ServerEndpointExporter;
- @Configuration
- public class WebSocketConfig {
- /**
- * 注入 ServerEndpointExporter,
- * 这个 bean 会自动注册使用了 @ServerEndpoint 注解声明的 Websocket endpoint
- */
- @Bean
- public ServerEndpointExporter serverEndpointExporter() {
- return new ServerEndpointExporter();
- }
- }
2, 添加 WebSocket 类
- import org.slf4j.Logger;
- import org.slf4j.LoggerFactory;
- import org.springframework.stereotype.Component;
- import javax.websocket.OnClose;
- import javax.websocket.OnMessage;
- import javax.websocket.OnOpen;
- import javax.websocket.Session;
- import javax.websocket.server.PathParam;
- import javax.websocket.server.ServerEndpoint;
- import java.util.HashMap;
- import java.util.Map;
- import java.util.concurrent.CopyOnWriteArraySet;
- @Component
- @ServerEndpoint("/websocket/{shopId}")
- public class WebSocket {
- private static Logger logger = LoggerFactory.getLogger(WebSocket.class);
- private Session session;
- private static CopyOnWriteArraySet<WebSocket> webSockets = new CopyOnWriteArraySet<>();
- private static Map<String, Session> sessionPool = new HashMap<>();
- @OnOpen
- public void onOpen(Session session, @PathParam(value = "shopId") String shopId) {
- this.session = session;
- webSockets.add(this);
- sessionPool.put(shopId, session);
- logger.info("有新的连接, 总数为:{}", webSockets.size());
- }
- @OnClose
- public void onClose() {
- webSockets.remove(this);
- logger.info("连接断开, 总数为:{}", webSockets.size());
- }
- @OnMessage
- public void onMessage(String message) {
- logger.info("收到客户端消息:{}", message);
- }
- // 此为广播消息
- public void sendAllMessage(String message) {
- for (WebSocket webSocket : webSockets) {
- System.out.println("[websocket 消息] 广播消息:" + message);
- try {
- webSocket.session.getAsyncRemote().sendText(message);
- } catch (Exception e) {
- logger.error("", e);
- }
- }
- }
- // 此为单点消息
- public void sendOneMessage(String shopId, String message) {
- Session session = sessionPool.get(shopId);
- if (session != null) {
- try {
- session.getAsyncRemote().sendText(message);
- } catch (Exception e) {
- logger.error("", e);
- }
- }
- }
- }
3, 添加测试类
- import com.sgcc.gtfsamservice.componet.WebSocket;
- import org.springframework.beans.factory.annotation.Autowired;
- import org.springframework.Web.bind.annotation.RequestMapping;
- import org.springframework.Web.bind.annotation.RestController;
- @RestController
- @RequestMapping("api")
- public class TestController {
- @Autowired
- private WebSocket webSocket;
- @RequestMapping("/sendAllWebSocket")
- public String test() {
- webSocket.sendAllMessage("hello");
- return "多发!";
- }
- @RequestMapping("/sendOneWebSocket")
- public String sendOneWebSocket() {
- webSocket.sendOneMessage("channel001", "hello!");
- return "单发";
- }
- }
4, 前端 vue
- export default {
- name: 'relationship',
- data () {
- return {
- }
- },
- created () { // 页面创建生命周期函数
- this.initWebSocket()
- },
- destroyed: function () { // 离开页面生命周期函数
- this.websocketclose()
- },
- methods: {
- initWebSocket: function () {
- // ws 等同 http,wss 等同 https, 其中 ip 为后端应用主机, port 为后端启动所占用的端口
- this.websock = new WebSocket('ws://ip:port/websocket/channel001')
- this.websock.onopen = this.websocketonopen
- this.websock.onerror = this.websocketonerror
- this.websock.onmessage = this.websocketonmessage
- this.websock.onclose = this.websocketclose
- },
- websocketonopen: function () {
- console.log('WebSocket 连接成功')
- },
- websocketonerror: function (e) {
- console.log('WebSocket 连接发生错误')
- },
- websocketonmessage: function (e) {
- var da = JSON.parse(e.data)
- console.log(da)
- this.message = da
- },
- websocketclose: function (e) {
- console.log('connection closed (' + e.code + ')')
- },
来源: http://www.bubuko.com/infodetail-3002525.html