spring boot 集成webSocket 实现消息推送

1.webSocket  的maven依赖

<dependency>
   <groupId>org.springframework.boot</groupId>
   <artifactId>spring-boot-starter-websocket</artifactId>
</dependency>

2.  使用@ServerEndpoint创立websocket endpoint

  首先要注入ServerEndpointExporter,这个bean会自动注册使用了@ServerEndpoint注解声明的Websocket endpoint。要注意,如果使用独立的servlet容器,而不是直接使用springboot的内置容器,就不要注入ServerEndpointExporter,因为它将由容器自己提供和管理

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


}

3. 接下来就是写websocket的具体实现类

@ServerEndpoint(value = "/webSocket")
@Component
public class WebSocketServer {
    private static final Logger log = LoggerFactory.getLogger(WebSocketServer.class);

    //静态变量,用来记录当前在线连接数。应该把它设计成线程安全的。
    private static int onlineCount = 0;
    //concurrent包的线程安全Set,用来存放每个客户端对应的MyWebSocket对象。
    private static CopyOnWriteArraySet<WebSocketServer> webSocketSet = new CopyOnWriteArraySet<WebSocketServer>();

    //与某个客户端的连接会话,需要通过它来给客户端发送数据
    private Session session;

    /**
     * 连接建立成功调用的方法
     */
    @OnOpen
    public void onOpen(Session session) {
        this.session = session;
        webSocketSet.add(this);     //加入set中
        addOnlineCount();           //在线数加1
        log.info("有新连接加入!当前在线人数为" + getOnlineCount());
        try {
            sendMessage("连接成功");
        } catch (IOException e) {
            log.error("websocket IO异常");
        }
    }
    // //连接打开时执行
    // @OnOpen
    // public void onOpen(@PathParam("user") String user, Session session) {
    //    currentUser = user;
    //    System.out.println("Connected ... " + session.getId());
    // }

    /**
     * 连接关闭调用的方法
     */
    @OnClose
    public void onClose() {
        webSocketSet.remove(this);  //从set中删除
        subOnlineCount();           //在线数减1
        log.info("有一连接关闭!当前在线人数为" + getOnlineCount());
    }

    /**
     * 收到客户端消息后调用的方法
     *
     * @param message 客户端发送过来的消息
     */
    @OnMessage
    public void onMessage(String message, Session session) {
        log.info("来自客户端的消息:" + message);

//        //群发消息
//        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("发生错误");
        error.printStackTrace();
    }


    public void sendMessage(String message) throws IOException {
        this.session.getBasicRemote().sendText(message);
    }


    /**
     * 群发自定义消息
     */
    public static void sendInfo(String message) throws IOException {
        log.info(message);
        for (WebSocketServer item : webSocketSet) {
            try {
                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--;
    }
}

4.写一个控制器触发推送。(根据不同业务逻辑实现推送)

@RequestMapping("sendMessage")
@ResponseBody
public Object sendMessage(String name) throws IOException {
    WebSocketServer.sendInfo(name);
     return "ok";
}

5.前端代码(建立连接后就可接收到服务器推送的消息)

<body>

<button οnclick="a()">连接</button>
<button οnclick="b()">断开</button>
<script type="text/javascript" src="js/jquery-3.2.1.js" ></script>
<script type="text/javascript">
   var socket;
   function a() {
      if(typeof(WebSocket) == "undefined") {
         console.log("您的浏览器不支持WebSocket");
      }else {
         console.log("您的浏览器支持WebSocket");
         socket = new WebSocket("ws://localhost:8081/websocket");
         //打开事件
         socket.onopen = function () {
            console.log("Socket 已打开");
            socket.send("这是来自客户端的消息" + location.href + new Date());
         };
         //获得消息事件
         socket.onmessage = function (msg) {
            console.log("消息来了");
            console.log(msg.data);
            alert(msg.data);
            //发现消息进入    调后台获取
//          getCallingList();
         };
         //关闭事件
         socket.onclose = function () {
            console.log("Socket已关闭");
         };
         //发生了错误事件
         socket.onerror = function () {
            alert("Socket发生了错误");
         }
//       $(window).onunload(function () {
//          socket.close();
//       });

      }
   }

   function b() {
      socket.close();
   }
</script>
</body>

6.简易实现效果

 

请求控制器触发消息推送

 

接收到推送(推送是群发推送,所有在连的都能接收到)

7.总结

demo 实现还是很简单的,只要注意不要添加不需要的依赖、配置或声明。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值