java socketio 入门教程（自制聊天系统）

最新推荐文章于 2024-04-18 07:28:47 发布

夏之奈

最新推荐文章于 2024-04-18 07:28:47 发布

阅读量2.6k

点赞数 4

分类专栏：笔记文章标签： java socketio websocket 聊天系统

本文链接：https://blog.csdn.net/qq_38103371/article/details/102856447

版权

笔记专栏收录该内容

10 篇文章 0 订阅

订阅专栏

java socketio 入门Demo

WebSocket ：一种通信协议，其作用建立一个连接通道，使数据交互从传统的请求响应的方式改为了实时的双向推送 ，解决了 http 协议的部分不足

这里就直接整合了spring boot，spring boot 太香了

聊天demo代码（服务器版）

依赖(没贴spring boot的)

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

设置全局的配置对象

		@Configuration
public class SocketConfig {

    private int PORT = 8081;

    private String HOST = "localhost";


    @Bean
    public SocketIOServer socketIOServer() {
        com.corundumstudio.socketio.Configuration config = new com.corundumstudio.socketio.Configuration();
        //不设置主机、默认绑定0.0.0.0 or ::0
//        config.setHostname(WSS_HOST);
        config.setPort(PORT);
        //这里还可以认证很多设置 比如仓库什么的
        //身份验证
        config.setAuthorizationListener(handshakeData -> {
            //这里没有启用任何认证 直接返回为 true，可以在这里写用户认证的逻辑

            //http://localhost:8081?username=test&password=test
            //            //例如果使用上面的链接进行connect，可以使用如下代码获取用户密码信息
            //            //String username = data.getSingleUrlParam("username");
            //            //String password = data.getSingleUrlParam("password");

            return true;
        });
        final SocketIOServer server = new SocketIOServer(config);
        return server;
    }

    @Bean
    public SpringAnnotationScanner springAnnotationScanner(SocketIOServer socketServer) {
        return new SpringAnnotationScanner(socketServer);
    }
}

编写消息处理者


@Component
public class MessageHandler {
    private static final Logger log = LoggerFactory.getLogger(MessageHandler.class);
    //会话集合,用来存储所有的客户端信息
    private static final ConcurrentSkipListMap<String, ClientInfo> webSocketMap = new ConcurrentSkipListMap<>();
    //静态变量，用来记录当前在线连接数。（原子类、线程安全）
    private static AtomicInteger onlineCount = new AtomicInteger(0);
	//服务器全局对象 发送信息 就靠它了
    private final SocketIOServer server;

    @Autowired
    public MessageHandler(SocketIOServer server) {
        this.server = server;
    }

    /**
     * connect事件处理，当客户端发起连接时将调用，每次建立连接都会调用一次该方法
     *
     * @param client
     */
    @OnConnect
    public void onConnect(SocketIOClient client) {
        // clientid 来自请求地址中
        String clientId = client.getHandshakeData().getSingleUrlParam("clientid");
        log.info("web socket连接:" + clientId);
        UUID session = client.getSessionId();
        ClientInfo si = webSocketMap.get(clientId);
        // 如果没有连接信息、则新建会话信息
        if (si == null) {
            si = new ClientInfo();
            si.setOnline(true);

            //在线数加1
            log.info("socket 建立新连接、sessionId:" + session + "、clientId:" + clientId + "、当前连接数：" + onlineCount.incrementAndGet());
        }
        // 更新客户端连接信息
        si.setLeastSignificantBits(session.getLeastSignificantBits());
        si.setMostSignificantBits(session.getMostSignificantBits());
        si.setLastConnectedTime(new Date());
        //将会话信息更新保存至集合中
        webSocketMap.put(clientId, si);


    }


    public void sendMessage(Object Message) {
        // 这个方法 会向所有的客户端 发送信息。 事件名为 message_event
        // 只有客户端有监听这个事件 就能接收到信息
        for (String clientId : webSocketMap.keySet()) {
            ClientInfo clientInfo = webSocketMap.get(clientId);
            System.out.printf("开始往客户端%s发送数据", clientId);
            UUID session = new UUID(clientInfo.getMostSignificantBits(), clientInfo.getLeastSignificantBits());
            server.getClient(session).sendEvent("message_event", Message);
        }
    }

    /**
     * 断开连接
     *
     * @param client
     */
    @OnDisconnect
    public void onDisconnect(SocketIOClient client) {
        String clientId = client.getHandshakeData().getSingleUrlParam("clientid");
        webSocketMap.remove(clientId);
        //在线数减1
        log.info("socket 断开连接、sessionId:" + client.getSessionId() + "、clientId:" + clientId + "、当前连接数：" + onlineCount.decrementAndGet());
    }

    /**
     * 消息接收入口，当接收到消息后，查找发送目标客户端，并且向该客户端发送消息，且给自己发送消息
     *
     * @param client
     * @param request
     * @param data
     */

    // onEvnt 对某个事件进行监听 当客户端有触发这个事件时候 调用。这里是一个聊天的逻辑处理
    @OnEvent(value = "message_event")
    public void onEvent(SocketIOClient client, AckRequest request, MessageInfo data) {
        // MessageInfo 该对象 由客户端发送事件时候提供
        String targetClientId = data.getTargetClientId();
        ClientInfo clientInfo = webSocketMap.get(targetClientId);

        //如果目标在线 那么发送消息，如果不在线 就不进行处理
        if (clientInfo != null && clientInfo.isOnline()) {
            UUID target = new UUID(clientInfo.getMostSignificantBits(), clientInfo.getLeastSignificantBits());
            log.info("目标会话UUID:" + target);
            MessageInfo sendData = new MessageInfo();
            sendData.setSourceClientId(data.getSourceClientId());
            sendData.setTargetClientId(data.getTargetClientId());
            sendData.setMsg(data.getMsg());
            // 向当前会话发送信息
            client.sendEvent("message_event", sendData);
            // 向目标会话发送信息
            server.getClient(target).sendEvent("message_event", sendData);
        }
    }

    /**
     * socket会话信息
     * 下面是自定义的一些消息对象
     */

    @Data
    public class ClientInfo {
        private String clientId;
        private boolean isOnline;
        private long mostSignificantBits;
        private long leastSignificantBits;
        private Date lastConnectedTime;

    }

    /**
     * 消息对象
     */
    public static class MessageInfo {
        //源客户端id
        private String sourceClientId;
        //目标客户端id
        private String targetClientId;
        //消息内容
        private String msg;
        // get/set方法 ....


        public void setSourceClientId(String sourceClientId) {
            this.sourceClientId = sourceClientId;
        }

        public void setTargetClientId(String targetClientId) {
            this.targetClientId = targetClientId;
        }

        public void setMsg(String msg) {
            this.msg = msg;
        }

        public String getSourceClientId() {
            return sourceClientId;
        }

        public String getTargetClientId() {
            return targetClientId;
        }

        public String getMsg() {
            return msg;
        }
    }
}

客户端代码

客户端1

<!DOCTYPE html>
<html>
<head lang="zh">
    <meta charset="utf-8"/>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Demo Chat</title>
    <link href="https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.js"></script>
    <!--moment js下载地址:http://momentjs.com/ -->
    <script src="moment.js"></script>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <style>
        body {padding: 20px;} #console {height: 400px;overflow: auto;} .username-msg {color: orange;} .connect-msg {color: green;}.disconnect-msg {color: red;}.send-msg {color: #888}
    </style>
    <script>
        var clientId = 'user1',targetId = 'user2';
        var socket = io.connect('http://localhost:8081?clientid=' + clientId);
        socket.on('connect', function () {
            showMsg('<span class="connect-msg">成功连接到服务器!</span>');
        });

        socket.on('message_event', function (data) {
            showMsg('<br /><span class="username-msg">' + new Date().getHours()+' '+new Date().getMinutes()+' '+new Date().getSeconds()+ '</span> ' + data);
        });
        socket.on('disconnect', function () {
            showMsg('<span class="disconnect-msg">服务已断开！</span>');
        });
        function sendDisconnect() {
            socket.disconnect();
        }
        function sendMessage() {
            var message = $('#msg').val();
            $('#msg').val('');
            var jsonObject = {
                sourceClientId: clientId,
                targetClientId: targetId,
                msg: message
            };
            socket.emit('message_event', jsonObject);
        }
        function showMsg(message) {
            // alert(message)
            // var currentTime = "<span class='time'>" + moment().startOf('hour').fromNow() + "</span>";
            // var element = $("<div>" + currentTime + "" + message + "</div>");
            $('#console').append(message);
        }
        $(document).keydown(function (e) {
            if (e.keyCode == 13) {
                $('#send').click();
            }
        });
    </script>
</head>
<body>
<h1>Netty-socket.io Demo</h1><br/>
<div id="console" class="well"></div>
<form class="well form-inline" onsubmit="return false;">
    <input id="msg" class="input-xlarge" type="text" placeholder="Type something..."/>&nbsp;&nbsp;
    <button type="button" onClick="sendMessage()" class="btn" id="send">Send</button>&nbsp;&nbsp;
    <button type="button" onClick="sendDisconnect()" class="btn">Disconnect</button>
</form>
</body>
</html>

客户端2

<!DOCTYPE html>
<html>
<head lang="zh">
    <meta charset="utf-8"/>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Demo Chat</title>
    <link href="https://cdn.bootcss.com/bootstrap/4.0.0-alpha.6/css/bootstrap.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.7.3/socket.io.js"></script>
    <!--moment js下载地址:http://momentjs.com/ -->
    <script src="moment.js"></script>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <style>
        body {padding: 20px;} #console {height: 400px;overflow: auto;} .username-msg {color: orange;} .connect-msg {color: green;}.disconnect-msg {color: red;}.send-msg {color: #888}
    </style>
    <script>
        var clientId = 'user2',targetId = 'user1';
        var socket = io.connect('http://localhost:8081?clientid=' + clientId);
        socket.on('connect', function () {
            showMsg('<span class="connect-msg">成功连接到服务器!</span>');
        });

        socket.on('message_event', function (data) {
            showMsg('<br /><span class="username-msg">' + new Date().getHours()+' '+new Date().getMinutes()+' '+new Date().getSeconds()+ '</span> ' + data);
        });
        socket.on('disconnect', function () {
            showMsg('<span class="disconnect-msg">服务已断开！</span>');
        });
        function sendDisconnect() {
            socket.disconnect();
        }
        function sendMessage() {
            var message = $('#msg').val();
            $('#msg').val('');
            var jsonObject = {
                sourceClientId: clientId,
                targetClientId: targetId,
                msg: message
            };
            socket.emit('message_event', jsonObject);
        }
        function showMsg(message) {
            // alert(message)
            // var currentTime = "<span class='time'>" + moment().startOf('hour').fromNow() + "</span>";
            // var element = $("<div>" + currentTime + "" + message + "</div>");
            $('#console').append(message);
        }
        $(document).keydown(function (e) {
            if (e.keyCode == 13) {
                $('#send').click();
            }
        });
    </script>
</head>
<body>
<h1>Netty-socket.io Demo</h1><br/>
<div id="console" class="well"></div>
<form class="well form-inline" onsubmit="return false;">
    <input id="msg" class="input-xlarge" type="text" placeholder="Type something..."/>&nbsp;&nbsp;
    <button type="button" onClick="sendMessage()" class="btn" id="send">Send</button>&nbsp;&nbsp;
    <button type="button" onClick="sendDisconnect()" class="btn">Disconnect</button>
</form>
</body>
</html>

同时启动这个两个就能进行聊天了

夏之奈

关注

4
点赞
踩
17

收藏

觉得还不错? 一键收藏
3
评论
java socketio 入门教程（自制聊天系统）

java socketio 入门DemoWebSocket ：一种通信协议，其作用建立一个连接通道，使数据交互从传统的请求响应的方式改为了实时的双向推送，解决了 http 协议的部分不足这里就直接整合了spring boot，spring boot 太香了聊天demo代码（服务器版）依赖(没贴spring boot的) <dependency> <gr...
复制链接

扫一扫