使用springboot和websocket进行前后端数据实时不间断传输

记录一次springboot+websocket使用

pom导入spring-boot封装的websocket包

	<!-- webSocket 开始-->
	<dependency>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-websocket</artifactId>
	</dependency>
	<!-- webSocket 结束-->

config

package com.skylon.waterstation.datamanage.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;

/**
 * @ Author     ：AZY.
 * @ Date       ：Created in 16:29 2019/7/17
 * @ Description：
 */
@Configuration
public class websocketConfig {
    @Bean
    public ServerEndpointExporter serverEndpointExporter() {
        return new ServerEndpointExporter();
    }
}

处理连接

package com.skylon.waterstation.datamanage.websocket;

import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;

import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import org.springframework.stereotype.Component;

/**
 * @ Author     ：AZY.
 * @ Date       ：Created in 15:05 2019/7/17
 * @ Description：websocket服务端
 */
@ServerEndpoint("/webSocket/{username}")
@Component
public class WebSocketServer  {

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

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

    //接收用户
    private String username="";
    /**
     * 连接建立成功调用的方法*/
    @OnOpen
    public void onOpen(Session session,@PathParam("username") String username) {
        this.session = session;
        webSocketSet.add(this);     //加入set中
        addOnlineCount();           //在线数加1
        System.out.println("有新窗口开始监听:"+username+",当前在线人数为" + getOnlineCount());
        this.username=username;
        try {
            sendMessage("连接成功");
        } catch (IOException e) {
            System.out.println("websocket IO异常");
        }
    }

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

    /**
     * 收到客户端消息后调用的方法
     *
     * @param message 客户端发送过来的消息*/
    @OnMessage
    public void onMessage(String message, Session session) {
        System.out.println("收到来自窗口"+username+"的信息:"+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) {
        System.out.println("发生错误");
        error.printStackTrace();
    }
    /**
     * 实现服务器主动推送
     */
    public void sendMessage(String message) throws IOException {
        this.session.getBasicRemote().sendText(message);
    }


    /**
     * 群发自定义消息
     * */
    public static void sendInfo(String message,@PathParam("username") String username) throws IOException {
        System.out.println("推送消息到窗口"+username+"，推送内容:"+message);
        for (WebSocketServer item : webSocketSet) {
            try {
                //这里可以设定只推送给这个sid的，为null则全部推送
                if(username==null) {
                    item.sendMessage(message);
                }else if(item.username.equals(username)){
                    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--;
    }
}

web页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        var websocket = null;
        var host = document.location.host;
        var username = "admin"; // 获得当前登录人员的userName
        //判断当前浏览器是否支持WebSocket
        if ('WebSocket' in window) {
            console.log("浏览器支持Websocket")
            var url = 'ws://'+host+'/webSocket/'+username
            websocket = new WebSocket(url);
        } else {
            console.log('当前浏览器 Not support websocket')
        }

        //连接发生错误的回调方法
        websocket.onerror = function() {
            console.log("WebSocket连接发生错误")
            setMessageInnerHTML("WebSocket连接发生错误");
        };

        //连接成功建立的回调方法
        websocket.onopen = function() {
            console.log("WebSocket连接成功")
            setMessageInnerHTML("WebSocket连接成功");
        }

        //接收到消息的回调方法
        websocket.onmessage = function(event) {
            console.log("接收到消息的回调方法")
            setMessageInnerHTML("后台推送的消息："+event.data);
            websocket.send("已收到"+event.data+"的消息");
            // websocket.close();
            // alert("webSocket已关闭！")
        }

        //连接关闭的回调方法
        websocket.onclose = function() {
            setMessageInnerHTML("WebSocket连接关闭");
        }

        //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
        window.onbeforeunload = function() {
            closeWebSocket();
        }

        //关闭WebSocket连接
        function closeWebSocket() {
            websocket.close();
        }

        //将消息显示在网页上
        function setMessageInnerHTML(innerHTML) {
            document.getElementById('message').innerHTML = innerHTML + '<br/>';
        }
    </script>
    <style type="text/css">
        .center-in-center{
            position: absolute;
            top: 50%;
            left: 43.2%;
        }
    </style>
</head>
<body>
<div id="message" class="center-in-center">

</div>
</body>
</html>

定时器模拟有新消息要传到页面

package com.skylon.waterstation.datamanage.websocket;

import com.alibaba.fastjson.JSON;
import com.skylon.waterstation.datamanage.Grab.GetJson;
import com.skylon.waterstation.datamanage.Grab.Maoyan;
import org.json.JSONObject;
import org.springframework.context.annotation.Configuration;
import org.springframework.scheduling.annotation.EnableScheduling;
import org.springframework.scheduling.annotation.Scheduled;
import org.springframework.stereotype.Component;

import java.io.IOException;
import java.time.LocalDateTime;
import java.time.format.DateTimeFormatter;

/**
 * @ Author     ：AZY.
 * @ Date       ：Created in 16:43 2019/7/17
 * @ Description：定时发送信息测试
 */
//@Component
@Configuration      //1.主要用于标记配置类，兼备Component的效果。
@EnableScheduling   // 2.开启定时任务
public class SaticScheduleTask {
    //3.添加定时任务
    @Scheduled(cron = "0/5 * * * * ?")
    //或直接指定时间间隔，例如：5秒
    //@Scheduled(fixedRate=5000)
    private void configureTasks() throws IOException {
        DateTimeFormatter formatter = DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss");
        LocalDateTime time = LocalDateTime.now();
        System.out.println("执行静态定时任务时间: " + formatter.format(time));
        WebSocketServer.sendInfo("当前时间: " + formatter.format(time),"admin");
    }