Springboot+WebSocket实现一对一聊天和公告的示例代码
作者：一个头发茂密的程序员 发布时间：2022-06-16 11:32:33
标签：Springboot,WebSocket,聊天
1.POM文件导入Springboot整合websocket的依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
<version>2.1.6.RELEASE</version>
</dependency>
2.注册WebSocket的Bean交给Spring容器管理
@Configuration
public class WebSocketServiceConfig {
@Bean
public ServerEndpointExporter serverEndpointExporter() {
return new ServerEndpointExporter();
}
}
3.WebSocket服务端实现
@ServerEndpoint 注解声明为一个WebSocket服务，访问地址为/chat/{username}，@Component将其注册为Spring的一个组件，交给Spring进行管理
@ServerEndpoint("/chat/{username}")
@Component
@Slf4j
public class WebSocket {
//注入dao或者service，注意：因为dao层接口和service层都是单例的Bean
//webSocket 不是单例的，所以在注入dao或者service时，需要用set方法对其进行注入，保证每一个都是独立的
private static ChatMapper chatMapper;
//参数中的ChatMapper 是 单例池中的ChatMapper
@Autowired
public void setChatMapper(ChatMapper chatMapperBean){
WebSocket.chatMapper = chatMapperBean;
}
//当前连接数
private static int onLinePersonNum;
//定义为Map结构，key值代表用户名称或其他唯一标识，Value代表对应的WebSocket连接。
//ConcurrentHashMap 保证线程安全，用来存放每个客户端对应的WebSocket对象
private static Map<String,WebSocket> webSocketMap = new ConcurrentHashMap<String, WebSocket>();
//用户名
private String username;
//当前httpSession
private Session session;
/**
* 打开链接
* @param username
* @param session
*/
@OnOpen
public void openConnect(@PathParam("username")String username, Session session){
this.session = session;
this.username = username;
//在线连接数+1
onlinePerNumAdd();
//用户名和当前用户WebSocket对象放进Map中
webSocketMap.put(this.username,this);
log.info("{}连接服务器成功。。。。",this.username);
}
/**
* 关闭连接
* @param username
* @param session
* @PathParam 用来获取路径中的动态参数Key值
*/
@OnClose
public void closeConnect(@PathParam("username")String username, Session session){
webSocketMap.remove(username);
//在线连接数-1
onlinePerNumSub();
log.info("{} 断开连接。。。",username);
}
/**
* 错误提示
*/
@OnError
public void errorConnect(Session session, Throwable error){
log.error("websocket连接异常：{}",error.getMessage());
}
@OnMessage
public void send(String message, Session session) throws IOException {
ObjectMapper objectMapper = new ObjectMapper();
Map map = objectMapper.readValue(message, Map.class);
sendMessage(map.get("username").toString(),message);
}
/**
* 点对点发送
* @param username
* @param message
* @throws IOException
*/
private void sendMessage(String username,String message) throws IOException {
WebSocket webSocket = webSocketMap.get(username);
webSocket.session.getBasicRemote().sendText(message);
}
/**
* 广播类型发送
* @param message
* @throws IOException
*/
private void sendMessage(String message) throws IOException {
Set<String> keys = webSocketMap.keySet();
for (String key : keys) {
WebSocket webSocket = webSocketMap.get(key);
webSocket.sendMessage(message);
}
}
private synchronized static void onlinePerNumAdd(){
WebSocket.onLinePersonNum ++;
}
private synchronized static void onlinePerNumSub(){
WebSocket.onLinePersonNum --;
}
private synchronized static int getOnLinePerNum(){
return WebSocket.onLinePersonNum;
}
}
4.webSocket客户端
chat1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- <script src="https://heerey525.github.io/layui-v2.4.3/layui/layui.js"></script>-->
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
</head>
<body>
<!--<button id="user1" onclick="connect()">连接</button>-->
<input id="link" type="text"/>
<input id="sendMsg" type="text"/>
<button onclick="send()">发送</button>
<div id="message">
</div>
</body>
<script type="text/javascript">
var websocket = null;
// function connect() {
//判断当前浏览器是否支持WebSocket ,主要此处要更换为自己的地址
if('WebSocket' in window){
websocket = new WebSocket("ws://localhost:8089/chat/bbb");
}
else{
alert('Not support websocket')
}
//连接发生错误的回调方法
websocket.onerror = function(){
// setMessageInnerHTML("error");
};
//连接成功建立的回调方法
websocket.onopen = function(event){
console.log("连接成功！！！")
// setMessageInnerHTML("open");
$("#link").val("连接成功！！")
}
//连接关闭的回调方法
websocket.onclose = function(){
// setMessageInnerHTML("close");
}
//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = function(){
websocket.close();
}
//发送消息
function send(){
websocket.send("aaa");
// onmessage();
}
//接收到消息的回调方法
// function onmessage(){
websocket.onmessage = function(event){
console.log(event.data)
// setMessageInnerHTML(event.data);
$("#message").append("<h1>"+ event.data + "</h1>")
// }
}
</script>
</html>
chat2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- <script src="https://heerey525.github.io/layui-v2.4.3/layui/layui.js"></script>-->
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
</head>
<body>
<!--<button id="user1" onclick="connect()">连接</button>-->
<input id="link" type="text"/>
<input id="sendMsg" type="text"/>
<button onclick="send()">发送</button>
<div id="message">
</div>
</body>
<script type="text/javascript">
var websocket = null;
// function connect() {
//判断当前浏览器是否支持WebSocket ,主要此处要更换为自己的地址
if('WebSocket' in window){
websocket = new WebSocket("ws://localhost:8089/pushMsg/aaa");
}
else{
alert('Not support websocket')
}
//连接发生错误的回调方法
websocket.onerror = function(){
// setMessageInnerHTML("error");
};
//连接成功建立的回调方法
websocket.onopen = function(event){
console.log("连接成功！！！")
// setMessageInnerHTML("open");
$("#link").val("服务器连接成功！！")
}
//连接关闭的回调方法
websocket.onclose = function(){
// setMessageInnerHTML("close");
}
//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = function(){
websocket.close();
}
//发送消息
function send(){
websocket.send("bbb");
// onmessage();
}
//接收到消息的回调方法
// function onmessage(){
websocket.onmessage = function(event){
console.log(event.data)
// setMessageInnerHTML(event.data);
$("#message").append("<h1>"+ event.data + "</h1>")
// }
}
</script>
</html>
来源：https://www.jianshu.com/p/980f0100edbc
0
投稿猜你喜欢
- public class MainActivity extends Activity { @Override protected void
- 1，通过Handler机制主线程中定义Handler,子线程发消息，通知Handler完成UI更新,Handler对象必须定义在主线程中，如
- 本文实例讲述了JDBC基础知识与技巧。分享给大家供大家参考。具体分析如下：1.什么是JDBC？通俗来讲JDBC技术就是通过java程序来发送
- 很多主流框架都使用了反射技术.像ssh框架都采用两种技术 xml做配置文件+反射技术.与反射有关的类包.java.lang.reflect.
1. Easy Rules 概述Easy Rules是一个Java规则引擎，灵感来自一篇名为《Should I use a Rules En- 简介在 Java 开发领域，热部署一直是一个难以解决的问题，目前的 Java 虚拟机只能实现方法体的修改热部署，对于整个类的结构修改，仍然需
- 如下所示：import java.util.ArrayList;import com.heima.bean.Person;public cl
- Android 应用签名的两种方法一、使用pem签名 （一） apk签名命令java –jar sign
- 在查询时经常出现一对多”的关系,所有会出现嵌套对象的情况，Mybatis在resultMap提供了collection标
- 引言在项目中，时间的使用必不可少，而java 8之前的时间api Date和Calander等在使用上存在着很多问题，于是，jdk1.8引进
- 单例模式的介绍说到单例模式,大家第一反应应该就是——什么是单例模式？，从“单例”字面意思上理解为——一个类只有一个实例，所以单例模式也就是保
- MVP 是从经典的模式MVC演变而来，它们的基本思想有相通的地方：Controller/Presenter负责逻辑的处理，Model提供数据
- 准备工作HALCON示例程序的描述部分一直是英文的，看起来很不方便。我决定汉化一下HALCON示例程序的描述，准备工作如下：拿到HALCON
- 一、Thread 的常见构造方法方法说明Thread()创建线程对象Thread(Runnable target)使用 Runnable 对
- 1.PDF文件简介PDF是可移植文档格式，是一种电子文件格式，具有许多其他电子文档格式无法相比的优点。PDF文件格式可以将文字、字型、格式、
- Android ScrollView无法填充满屏幕的解决办法ScrollView滚动视图是指当拥有很多内容、屏幕显示不完时、需要通过滚动跳来
- 简介Java 在 1.5 引入了泛型机制，泛型本质是参数化类型，也就是说变量的类型是一个参数，在使用时再指定为具体类型。泛型可以用于类、接口
- 多个条件使用Map传递参数进行批量删除1、使用场景因为项目需要针对资源文件(视频、音频、文档)，编辑时候可能出现以下3种情况：实现的项目效果
- 本文实例为大家分享了Android table布局开发实现简单计算器的具体代码，供大家参考，具体内容如下结果如图：XML文件如下：<F
- 一、问题背景在Intellij idea中，新建Maven项目，在魔项目中新建多个模块，发现模块间相互调用失败二、问题原因模块间无法相互引用
