【视频&交流平台】
http://study.163.com/course/introduction.htm?courseId=1004329008&utm_campaign=commission&utm_source=400000000155061&utm_medium=share
http://study.163.com/course/introduction.htm?courseId=1004638001&utm_campaign=commission&utm_source=400000000155061&utm_medium=share
https://gitee.com/happyangellxq520/spring-boot
http://412887952-qq-com.iteye.com/blog/2321532
需求缘起:
在前面的文章中已经实现了群聊,这里也简单介绍下单聊。这里使用session.getId()中的id作为唯一的消息通道(这里我们称为通讯的频道号), session.getId()是一个递增的数字,从0开始,递增1,2,3… 实际中并不会使用这个id作为标识,这里只是为了讲解方便。
效果展示:
先看下最终实现的效果,如下图:
悟空消息:
师傅消息:
八戒消息:
一、服务端调整
1.1 创建一个Socket消息对象SocketMsg
这里我们就不能使用简单的文本消息进行消息的发送了,我们使用json进行消息的发送。所以需要先创建一个消息对象,里面包含了消息发送者,消息接受者,消息类型(单聊还是群聊),还是就是消息,如下:
package com.kfit.socket; public class SocketMsg { private int type;//聊天类型0:群聊,1:单聊. private String fromUser;//发送者. private String toUser;//接受者. private String msg;//消息 public int getType() { return type; } public void setType(inttype) { this.type = type; } public String getFromUser() { return fromUser; } public void setFromUser(String fromUser) { this.fromUser = fromUser; } public String getToUser() { returntoUser; } public void setToUser(String toUser) { this.toUser = toUser; } public String getMsg() { returnmsg; } public void setMsg(String msg) { this.msg = msg; } }
1.2 调整建立连接的方法(MyWebSocket)
这里主要是要使用一个map对象保存频道号和session之前的关系,之后就可以通过频道号获取session,然后使用session进行消息的发送。
定义一个map对象:
//用来记录sessionId和该session进行绑定 private static Map<String,Session> map = new HashMap<String, Session>();
修改连接的方法onOpen:
在建立连接的时候,就保存频道号(这里使用的是session.getId()作为频道号)和session之间的对应关系:
@OnOpen public void onOpen(Session session,@PathParam("nickname") String nickname) { this.session = session; this.nickname = nickname; map.put(session.getId(), session); webSocketSet.add(this); //加入set中 System.out.println("有新连接加入!当前在线人数为" + webSocketSet.size()); this.session.getAsyncRemote().sendText(this.nickname+"上线了"+"(他的频道号是"+session.getId()+")"); }
修改消息发送的方法 onMessage:
从客户端传过来的数据是json数据,所以这里使用jackson进行转换为SocketMsg对象,然后通过socketMsg的type进行判断是单聊还是群聊,进行相应的处理:
@OnMessage public void onMessage(String message, Session session,@PathParam("nickname") String nickname) { System.out.println("来自客户端的消息:" + message); ObjectMapper objectMapper = new ObjectMapper(); SocketMsg socketMsg; try { socketMsg = objectMapper.readValue(message, SocketMsg.class); if(socketMsg.getType() == 1){ //单聊.需要找到发送者和接受者. socketMsg.setFromUser(session.getId());//发送者. Session fromSession = map.get(socketMsg.getFromUser()); Session toSession = map.get(socketMsg.getToUser()); //发送给接受者. if(toSession != null){ //发送给发送者. fromSession.getAsyncRemote().sendText(nickname+":"+socketMsg.getMsg()); toSession.getAsyncRemote().sendText(nickname+":"+socketMsg.getMsg()); }else{ //发送给发送者. fromSession.getAsyncRemote().sendText("系统消息:对方不在线或者您输入的频道号不对"); } }else{ //群发消息 broadcast(nickname,socketMsg); } } catch (JsonParseException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (JsonMappingException e) { // TODO Auto-generated catch block e.printStackTrace(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); } }
二、客户端调整
2.1 加入频道号输入框
提供用户输入频道号进行单聊:
消息:<input id="text" type="text" /> 频道号<input id="toUser" type="text" /> <button onclick="send()">发送消息</button>
2.2 修改消息发送方法
这里使用了js对象进行消息的传递,这里使用JSON.stringify将json对象转换为json字符串,如下代码:
//发送消息 function send() { //获取输入的文本信息进行发送 var message = document.getElementById('text').value; var toUser = document.getElementById('toUser').value; var socketMsg = {msg:message,toUser:toUser}; if(toUser == ''){ //群聊. socketMsg.type = 0; }else{ //单聊. socketMsg.type = 1; } websocket.send(JSON.stringify(socketMsg)); }
好了,到这里就可以实现了单聊+群聊的效果。
三、新问题的提出
上面虽然可以实现单聊的方式,但是在具体的实际场景中,想要知道对方的频道号好像不是那么容易的哦,那么这个要怎么解决呢?大家在玩QQ群的时候,应该都用过聊天界面中的右边的群成员吧,对头,就是要实现一个在线群成员列表的功能,这样用户在操作的时候就可以直接通过点击某个在线的用户进行聊天了。博主,你会实现嘛?^_^,博主还暂时没有这个计划,其实看懂了上面的代码之后,要实现在线群成员列表也不是很难的事情了。
四、源代码
最后奉上源代码。大家可以下载源代码玩玩!
访问地址:https://gitee.com/happyangellxq520/spring-boot 找到spring-boot-websocket-2017,直接下载即可运行。
相关推荐
如何使用Postman来发送数据到后端Spring Boot应用程序,并使用WebSocket建立实时通信通道,以便后端应用程序可以向Postman推送消息。 学会这个方法,就能缩短你的项目开发周期,以及提高你的开发效率。如果提出您的...
概要:本文介绍如何使用 Spring Boot 3.X 和 WebSocket 实现消息推送,并动态开启、关闭和取消定时任务。通过WebSocket实现实时通信,结合定时任务管理,可实现灵活的消息推送和任务控制。 使用人群:适合有Spring ...
spring boot websocket例子,实现socket连接,关闭,发送消息功能,运行Application.java运行项目,访问地址http://localhost:8080/socket.html
NULL 博文链接:https://412887952-qq-com.iteye.com/blog/2295146
一、前言 WebSocket是一种在单个TCP连接上进行全双工通信的协议。WebSocket通信协议于2011年被IETF定为标准RFC 6455...spring boot2.x整合websocket服务端; websocket客户端java代码版; websocket客户端HTML网页版。
spring boot+websocket网页上使用的是jquery写的,网页放在resources\static目录里边,下载直接运行就可以
一个基于Spring Boot + WebSocket + Redis,可快速开发的分布式即时通讯群聊系统。适用于直播间聊天、游戏内聊天、客服聊天等临时性群聊场景。 Java开发基于SpringBoot+WebSocket+Redis分布式即时通讯群聊系统。一...
内容概要:帮助读者通过 Spring Boot 框架一步步完成 WebSocket 集成,快速上手WebSocket。在通过两种方式集成的过程中会摘取整体框架中的核心逻辑,简化代码实现过程,保留核心功能,例如:IOC、AOP、Bean生命周期...
[课堂课件讲解]Java微服务实践-Spring Boot WebSocket.pptx
此资源为websocket的页面源码,配合Spring boot 2基于Netty的高性能Websocket服务器(心跳模式) 文章来使用
vue前端后端分离spring boot 2.0集成websocket,带身份认证实现消息推送功能
spring-boot-websocket-client 代码示例
WebSocket:WebSocket Spring Boot项目
Spring Boot WebSocket.pptx Spring Boot Web篇 (上) pptx Spring Boot Web篇(下) .pptx Spring Boot Web篇 (中) pptx Spring Boot 安全.pptx Spring Boot 数据库JDBCpptx Spring Boot 日志pptx Spring Boot 测试...
Spring Boot整合websocket实现群聊,点对点聊天,图片发送,音频发送
Spring Boot整合websocket实现群聊,音频发送,点对点聊天,图片发送。 Spring Boot整合websocket实现群聊,点对点聊天,图片发送,音频发送。 Spring Boot整合websocket实现群聊,点对点聊天,图片发送,音频发送 ...
如何使用Postman来发送数据到后端Spring Boot应用程序,并使用WebSocket建立实时通信通道,以便后端应用程序可以向Postman推送消息,并可动态开启、关闭和取消定时任务。 学会这个方法,就能缩短你的项目开发周期,...
第 2-10 课: 使用 Spring Boot WebSocket 创建聊天室/spring-boot-websocket 第 2-2 课 Spring Boot 项目中使用 JSP/spring-boot-jsp 第 2-3 课 模板引擎 Thymeleaf 基础使用/spring-boot-thymeleaf 第 2-4 课 ...
Spring Boot WebSocket聊天应用程序您可以在签出应用程序的实时版本。要求Java-1.8.x Maven-3.xx设定步骤1.克隆应用程序git clone https://github.com/callicoder/spring-boot-websocket-chat-demo.git 2.使用maven...
Spring Boot Documentation 1. About the Documentation 2. Getting Help 3. First Steps 4. Working with Spring Boot 5. Learning about Spring Boot Features 6. Moving to Production 7. Advanced Topics II. ...