[网络协议]使用websocket监控后台数据

应甲方要求，我们要在页面按频次刷新后台目标数据，当然是首选websocket了，由后台向前端推送数据。前端修改刷新频次时，向后端发送数据。类似RabbitMQ管理后台自动刷新。

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

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

代码已简化，默认每秒刷新一次，有客户端接入时，开始推送数据。

@ServerEndpoint("/websocket/monitor")
@Component
public class MyServerEndPoint {
    @OnOpen
    public void onOpen(Session session) {
        sessionMap.put(session.getId(), session);
        sessionMapSleep.put(session.getId(), 1);
        executorService.submit(() -> {
            while (null != sessionMap.get(session.getId())) {
                try {
                    session.getBasicRemote().sendText("monitor: " + DateHelper.getTime() + "; random=" + ThreadLocalRandom.current().nextInt(1000));
                    TimeUnit.SECONDS.sleep(sessionMapSleep.get(session.getId()));
                } catch (Exception e) {
                    logger.log(Level.ALL, "websocket monitor send error", e);
                }
            }
        });
    }
}

最后来个涂鸦的html，刷新频次没有使用下拉，也没有使用raddio，鬼使神差的用了checkbox。

页面比较简单，贴一下部分关键代码，保留了小黑checkbox反向选择的代码。

<script>
    var socket = new WebSocket("ws://localhost:8787/websocket/monitor");
    socket.onmessage = function (event) {
        $("#msg").append(event.data + '<br/>');
    };
    
    $(function(){
        $("input[name='refresh']").each(function (i){
            $(this).click(function (){
                if(this.checked){
                    //反向选择
                    $("input[name='refresh'][value!="+this.value+"]").each(function(){
                        $(this).prop("checked",false);
                    })
                    //alert(this.value)
                    socket.send(this.value)
                }
            })
        });
    });
</script>