【websocket】springboot使用websocket实现消息推送

首先我们引用Spring-boot所带的websocket依赖:

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

然后编写前端代码和后台处理后台触发的事件:

<script>
    var websocket = null;
    if('WebSocket' in window){
        websocket = new WebSocket('ws://localhost:80/websocket');
    }else{
        alert("该浏览器不支持WebSocket");
    }

    websocket.onopen = function (event) {
        console.log("建立连接");
    }

    websocket.onclose = function (event) {
        console.log("断开连接");
    }

    websocket.onmessage = function (event) {
        console.log("收到消息" + event.data);
        //弹框
        $('#myModal').modal('show');
        //播放音乐
        document.getElementById('notice').play();
    }

    websocket.onerror = function (event) {
        alert("websocket通信发生错误");
    }

    window.onbeforeunload = function (event) {
        websocket.close();
    }
</script>

后台进行websocket配置:

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

然后编写websocket类,接收ws协议的请求:ws://localhost/websocket，并通过对应方法进行连接,同时编写sendMessage()方法，向前台发送消息，当后台需要时就调用该方法

@Component
@ServerEndpoint("/websocket")
@Slf4j
public class WebSocket {
    private Session session;

    private static CopyOnWriteArraySet<WebSocket> webSockets = new CopyOnWriteArraySet<>();

    @OnOpen
    public void onOpen(Session session) {
        this.session = session;
        webSockets.add(this);
        log.info("【websocket消息】有新的连接, 总数:{}", webSockets.size());
    }


    @OnClose
    public void onClose() {
        webSockets.remove(this);
        log.info("【websocket消息】连接断开, 总数:{}", webSockets.size());
    }

    @OnMessage
    public void onMessage(String message) {
        log.info("【websocket消息】收到客户端发来的消息:{}", message);
    }

    public void sendMessage(String message){
        for (WebSocket webSocket: webSockets) {
            log.info("【websocket消息】广播消息, message={}", message);
            try {
                webSocket.session.getBasicRemote().sendText(message);
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
    }
}

当我们需要提交订单想向前台发送消息时，我们可以调用sendMessage()方法

@Autowired
private WebSocket webSocket;

//发送websocket消息
webSocket.sendMessage("您有新的订单啦!!!");

前台效果如下:

后台消息

【websocket】springboot使用websocket实现消息推送

猜你喜欢