UDP配合socketIO实现消息的推送（二）

最新推荐文章于 2023-10-27 14:18:24 发布

神雕大侠mu

最新推荐文章于 2023-10-27 14:18:24 发布

阅读量1.2k

点赞数

分类专栏： java 文章标签： java socket websocket

本文链接：https://blog.csdn.net/m0_37635053/article/details/106752066

版权

java 专栏收录该内容

106 篇文章 4 订阅

订阅专栏

UDP配合socketIO实现消息的推送（二）

前文讲了UDP接收文件，现在结合前面的UDP，把接收的文件通过socketIO推送给前端，实现实时显示数据。
这里讲socketIO的使用步骤：
①导包

<dependency>
    <groupId>com.corundumstudio.socketio</groupId>
    <artifactId>netty-socketio</artifactId>
    <version>1.7.7</version>
</dependency>

②配置yml

# host在本地测试可以设置为localhost或者本机IP，在Linux服务器跑可换成服务器IP
socketio.host=localhost
socketio.port=9099
# 设置最大每帧处理数据的长度，防止他人利用大数据来攻击服务器
socketio.maxFramePayloadLength=1048576
# 设置http交互最大内容长度
socketio.maxHttpContentLength=1048576
# socket连接数大小（如只监听一个端口boss线程组为1即可）
socketio.bossCount=1
socketio.workCount=100
socketio.allowCustomRequests=true
# 协议升级超时时间（毫秒），默认10秒。HTTP握手升级为ws协议超时时间
socketio.upgradeTimeout=1000000
# Ping消息超时时间（毫秒），默认60秒，这个时间间隔内没有接收到心跳消息就会发送超时事件
socketio.pingTimeout=6000000
# Ping消息间隔（毫秒），默认25秒。客户端向服务器发送一条心跳消息间隔
socketio.pingInterval=25000

③写个配置类

/**
 * Socket.io不是Websocket，它只是将Websocket和轮询 （Polling）机制以及其它的实时通信方式封装成了通用的接口，
 * 并且在服务端实现了这些实时机制的相应代码。也就是说，Websocket仅仅是 Socket.io实现实时通信的一个子集。
 * 因此Websocket客户端连接不上Socket.io服务端，当然Socket.io客户端也连接不上Websocket服务端。
 */
@Configuration
@Slf4j
public class SocketIOConfig {
    @Value("${socketio.host}")
    private String host;
    @Value("${socketio.port}")
    private Integer port;
    @Value("${socketio.bossCount}")
    private int bossCount;
    @Value("${socketio.workCount}")
    private int workCount;
    @Value("${socketio.allowCustomRequests}")
    private boolean allowCustomRequests;
    @Value("${socketio.upgradeTimeout}")
    private int upgradeTimeout;
    @Value("${socketio.pingTimeout}")
    private int pingTimeout;
    @Value("${socketio.pingInterval}")
    private int pingInterval;
    /**
     * 以下配置在上面的application.properties中已经注明
     * @return
     */
    @Bean
    public SocketIOServer socketIOServer() {
        SocketConfig socketConfig = new SocketConfig();
        socketConfig.setTcpNoDelay(true);
        socketConfig.setSoLinger(0);
        com.corundumstudio.socketio.Configuration config = new com.corundumstudio.socketio.Configuration();
        config.setSocketConfig(socketConfig);
        config.setHostname(host);
        config.setPort(port);
        config.setBossThreads(bossCount);
        config.setWorkerThreads(workCount);
        config.setAllowCustomRequests(allowCustomRequests);
        config.setUpgradeTimeout(upgradeTimeout);
        config.setPingTimeout(pingTimeout);
        config.setPingInterval(pingInterval);
        log.info("=============socket.io配置加载，ip:{},端口：{}====================",host,port);
        return new SocketIOServer(config);
    }
}

④ 写接口和实现类

------------------接口----------------------------------

public interface ISocketIOService {
    //推送的事件
    public static final String PUSH_EVENT = "push_event";
    // 启动服务
    void start() throws Exception;
    // 停止服务
    void stop();
    // 推送信息
    void pushMessageToUser(PushMessage pushMessage);
    /**
     * 推送信息给指定客户端
     *
     * @param userId:     客户端唯一标识
     * @param msgContent: 消息内容
     */
    void pushMessageToUser(String userId, String msgContent);
}

---------------------------实现类------------------------------------

package com.sinux.cete.socket.socketio.service.impl;

import cn.hutool.core.date.DateUtil;
import com.corundumstudio.socketio.SocketIOClient;
import com.corundumstudio.socketio.SocketIOServer;
import com.sinux.cete.socket.socketio.entity.PushMessage;
import com.sinux.cete.socket.socketio.service.ISocketIOService;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.util.CollectionUtils;

import javax.annotation.PostConstruct;
import javax.annotation.PreDestroy;
import java.util.List;
import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;

/**
 * 1.socketIOServer.addConnectListener：监听客户端连接
 * 2. socketIOServer.addDisconnectListener：监听客户端断开连接
 * 3. socketIOServer.addEventListener：监听客户端传输的消息
 * 4. client.sendEvent("自定义事件名称", "消息内容")：服务端向指定的clien客户端发送消息
 * 5. socketIOServer.getBroadcastOperations().sendEvent("自定义事件名称", "消息内容")：服务端发送广播消息给所有客户端
 * socket.io通信，客户端：
 * IO.socket(url)：与指定的socket.io服务端建立连接
 * socket.emit：发送数据到服务端事件
 * socket.on： 监听服务端事件
 * @Author cc
 */
@Slf4j
@Service(value = "socketIOService")
public class SocketIOServiceImpl implements ISocketIOService {

    /**
     * 存放已连接的客户端
     */
    private static Map<String, SocketIOClient> clientMap = new ConcurrentHashMap<>();

    /**
     * 自定义事件`push_data_event`,用于服务端与客户端通信
     */
    private static final String PUSH_DATA_EVENT = "push_event";

    @Autowired
    private SocketIOServer socketIOServer;

    /**
     * Spring IoC容器创建之后，在加载SocketIOServiceImpl Bean之后启动
     */
    @PostConstruct
    private void autoStartup() {
        start();
    }

    /**
     * Spring IoC容器在销毁SocketIOServiceImpl Bean之前关闭,避免重启项目服务端口占用问题
     */
    @PreDestroy
    private void autoStop() {
        stop();
    }

    @Override
    public void start() {
        log.info("clientMap的内容是："+clientMap);
        // 监听客户端连接
        socketIOServer.addConnectListener(client -> {
            log.debug("************ 客户端： " + getIpByClient(client) + " 已连接 ************");
            // 自定义事件`connected` -> 与客户端通信  （也可以使用内置事件，如：Socket.EVENT_CONNECT）
            client.sendEvent("connected", "你成功连接上了哦...");
            String userId = getParamsByClient(client);
            if (userId != null) {
                clientMap.put(userId, client);
            }
        });

        // 监听客户端断开连接
        socketIOServer.addDisconnectListener(client -> {
            String clientIp = getIpByClient(client);
            log.debug(clientIp + " *********************** " + "客户端已断开连接");
            String userId = getParamsByClient(client);
            if (userId != null) {
                clientMap.remove(userId);
                client.disconnect();
            }
        });

        // 自定义事件`client_info_event` -> 监听客户端消息
        socketIOServer.addEventListener(PUSH_DATA_EVENT, String.class, (client, data, ackSender) -> {
            // 客户端推送`client_info_event`事件时，onData接受数据，这里是string类型的json数据，还可以为Byte[],object其他类型
            String clientIp = getIpByClient(client);
            log.debug(clientIp + " ************ 客户端：" + data);
        });

        // 启动服务
        socketIOServer.start();

        // broadcast: 默认是向所有的socket连接进行广播，但是不包括发送者自身，如果自己也打算接收消息的话，需要给自己单独发送。
//        new Thread(() -> {
//            int i = 0;
//            while (true) {
//                try {
//                    // 每3秒发送一次广播消息
//                    Thread.sleep(3000);
//                    socketIOServer.getBroadcastOperations().sendEvent("myBroadcast", "广播消息 " + DateUtil.now());
//                } catch (InterruptedException e) {
//                    e.printStackTrace();
//                }
//            }
//        }).start();
    }

    @Override
    public void stop() {
        if (socketIOServer != null) {
            socketIOServer.stop();
            socketIOServer = null;
        }
    }

    @Override
    public void pushMessageToUser(PushMessage pushMessage) {
        log.info("*************************************************pushMessage:{}",pushMessage);
        //socketIOServer.getBroadcastOperations().sendEvent("myBroadcast", "广播消息 " + pushMessage);
        socketIOServer.getBroadcastOperations().sendEvent(String.valueOf(pushMessage));
    }
    @Override
    public void pushMessageToUser(String userId, String msgContent) {
        SocketIOClient client = clientMap.get(userId);
        log.info("=========向客户端推送消息pushMessageToUser：{}==========",client);
        if (client != null) {
            client.sendEvent(PUSH_DATA_EVENT, msgContent);
            log.info("===============向客户端推送消息result：{}====================",msgContent);
            //socketIOServer.getBroadcastOperations().sendEvent(PUSH_DATA_EVENT,msgContent);
        }
    }

    /**
     * 获取客户端url中的userId参数（这里根据个人需求和客户端对应修改即可）
     *
     * @param client: 客户端
     * @return: java.lang.String
     */
    private String getParamsByClient(SocketIOClient client) {

        // 获取客户端url参数（这里的userId是唯一标识）
        Map<String, List<String>> params = client.getHandshakeData().getUrlParams();
        List<String> userIdList = params.get("userId");
        if (!CollectionUtils.isEmpty(userIdList)) {
            return userIdList.get(0);
        }
        log.info("=========获取客户端url中的userId参数：{}==========",userIdList);
        return null;
    }

    /**
     * 获取连接的客户端ip地址
     *
     * @param client: 客户端
     * @return: java.lang.String
     */
    private String getIpByClient(SocketIOClient client) {
        log.info("=========获取连接的客户端ip地址：{}==========",client);
        String sa = client.getRemoteAddress().toString();
        String clientIp = sa.substring(1, sa.indexOf(":"));
        log.info("=========获取连接的客户端ip地址：{}==========",clientIp);
        return clientIp;
    }
}

至此：socketIO服务端写完了。
UDP的使用参照上一篇博文，只需改变一丁点，在UDP中的Process类，在接收数据处调用socketIO的方法即可实现推送数据，其他部分与UDP部分不变。

@Component
@Slf4j
public class Process {
    @Autowired
    private ISocketIOService socketIOService;
    @Async("getasyncserviceexecutor")
    public void processRun(DatagramPacket packet) {
        byte[] buffer = packet.getData();
        try {
            String jsonString = new String(buffer,"UTF-8");
            log.info("=====从{}:{}接收到UDP数据包:{}==================",packet.getAddress().getHostAddress(),packet.getPort(),jsonString);
            //TODO 使用SOCKET.IO推送数据（调用socketIO推送数据）
            socketIOService.pushMessageToUser("1",jsonString);
        } catch (UnsupportedEncodingException e) {
            e.printStackTrace();
        }
    }
}

这里写一个socketIO客户端类，模拟前端连接：（正式项目就是前端连接了，不需要这个模拟客户端）

  <!-- socket.io客户端 -->
        <dependency>
            <groupId>io.socket</groupId>
            <artifactId>socket.io-client</artifactId>
            <version>1.0.0</version>
        </dependency>

模拟类：

@Slf4j
public class SocketIOClientLaunch {
    public static void main(String[] args) {
        // 服务端socket.io连接通信地址
        String url = "http://127.0.0.1:9099";
        try {
            IO.Options options = new IO.Options();
            options.transports = new String[]{"websocket"};
            options.reconnectionAttempts = 2;
            // 失败重连的时间间隔
            options.reconnectionDelay = 1000;
            // 连接超时时间(ms)
            options.timeout = 500;
            // userId: 唯一标识 传给服务端存储
            final Socket socket = IO.socket(url + "?userId=1", options);
            socket.on(Socket.EVENT_CONNECT, args1 -> socket.send("hello..."));
            // 自定义事件`connected` -> 接收服务端成功连接消息
            socket.on("connected", objects -> log.debug("服务端1:" + objects[0].toString()));
            // 自定义事件`push_data_event` -> 接收服务端消息
            socket.on("push_event", objects -> log.debug("服务端2:" + objects[0].toString()));
            // 自定义事件`myBroadcast` -> 接收服务端广播消息
            socket.on("myBroadcast", objects -> log.debug("服务端3：" + objects[0].toString()));
            socket.connect();
            while (true) {
                Thread.sleep(3000);
                // 自定义事件`push_data_event` -> 向服务端发送消息
                socket.emit("push_event", "发送数据 " + DateUtil.now());
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}

还需协议前端，真正实现实时数据的获取与推送功能，这样就可动态的展示当前获取的数据
给一个简单的前端页面：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>NETTY SOCKET.IO DEMO</title>
    <base>
    <script src="https://cdn.bootcss.com/jquery/3.4.0/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/socket.io/2.2.0/socket.io.js"></script>
    <style>
        body {
            padding: 20px;
        }
        #console {
            height: 450px;
            overflow: auto;
        }
        .username-msg {
            color: orange;
        }
        .connect-msg {
            color: green;
        }
        .disconnect-msg {
            color: red;
        }
    </style>
</head>
<body>
<div id="console" class="well"></div>
</body>
<script type="text/javascript">
    var socket;
    connect();
    function connect() {
        var loginUserNum = '88';
        var opts = {
            query: 'loginUserNum=' + loginUserNum
        };
        socket = io.connect('http://localhost:9099?userId='+loginUserNum, opts);
        socket.on('connect', function (data) {
            console.log(data);
            console.log("连接成功");
            serverOutput('<span class="connect-msg">连接成功</span>');
        });
        socket.on('myBroadcast', function (data) {
            console.log(data);
            serverOutput('<span class="disconnect-msg">' + data+ '</span>');
        });
        socket.on(function (data) {
            console.log(data);
            serverOutput('<span class="disconnect-msg">' + data+ '</span>');
        });
        socket.on('myBroadcast', function (data) {
            console.log(data);
            serverOutput('<span class="disconnect-msg">' + data+ '</span>');
        });
        socket.on('disconnect', function () {
            console.log(data);
            serverOutput('<span class="disconnect-msg">' + '已下线! </span>');
        });
    }
    function output(message) {
        var element = $("<div>" + " " + message + "</div>");
        $('#console').prepend(element);
    }
    function serverOutput(message) {
        var element = $("<div>" + message + "</div>");
        $('#console').prepend(element);
    }
</script>
</html>