springboot集成websocket的两种实现方式

WebSocket跟常规的http协议的区别和优缺点这里大概描述一下

一、websocket与http

http协议是用在应用层的协议，他是基于tcp协议的，http协议建立链接也必须要有三次握手才能发送信息。http链接分为短链接，长链接，短链接是每次请求都要三次握手才能发送自己的信息。即每一个request对应一个response。长链接是在一定的期限内保持链接。保持TCP连接不断开。客户端与服务器通信，必须要有客户端发起然后服务器返回结果。客户端是主动的，服务器是被动的。 
WebSocket是HTML5中的协议， 他是为了解决客户端发起多个http请求到服务器资源浏览器必须要经过长时间的轮训问题而生的，他实现了多路复用，他是全双工通信。在webSocket协议下客服端和浏览器可以同时发送信息。

二、HTTP的长连接与websocket的持久连接

HTTP1.1的连接默认使用长连接（persistent connection），

即在一定的期限内保持链接，客户端会需要在短时间内向服务端请求大量的资源，保持TCP连接不断开。客户端与服务器通信，必须要有客户端发起然后服务器返回结果。客户端是主动的，服务器是被动的。

在一个TCP连接上可以传输多个Request/Response消息对，所以本质上还是Request/Response消息对，仍然会造成资源的浪费、实时性不强等问题。

如果不是持续连接，即短连接，那么每个资源都要建立一个新的连接，HTTP底层使用的是TCP，那么每次都要使用三次握手建立TCP连接，即每一个request对应一个response，将造成极大的资源浪费。

长轮询，即客户端发送一个超时时间很长的Request，服务器hold住这个连接，在有新数据到达时返回Response

websocket的持久连接  只需建立一次Request/Response消息对，之后都是TCP连接，避免了需要多次建立Request/Response消息对而产生的冗余头部信息。

Websocket只需要一次HTTP握手，所以说整个通讯过程是建立在一次连接/状态中，而且websocket可以实现服务端主动联系客户端，这是http做不到的。

springboot集成websocket的不同实现方式：

pom添加依赖

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
 因涉及到js连接服务端，所以也写了对应的html，这里集成下thymeleaf模板，前后分离的项目这一块全都是前端做的

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
配置文件：

server:
port: 8885

#添加Thymeleaf配置
thymeleaf:
cache: false
prefix: classpath:/templates/
suffix: .html
mode: HTML5
encoding: UTF-8
content-type: text/html

1：自定义WebSocketServer，使用底层的websocket方法，提供对应的onOpen、onClose、onMessage、onError方法

1.1：添加webSocketConfig配置类

/**
* 开启WebSocket支持
* Created by huiyunfei on 2019/5/31.
*/
@Configuration
public class WebSocketConfig {
@Bean
public ServerEndpointExporter serverEndpointExporter() {
return new ServerEndpointExporter();
}
}
1.2：添加webSocketServer服务端类

package com.example.admin.web;

/**
* Created by huiyunfei on 2019/5/31.
*/

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

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

//接收sid
private String sid="";

*/
/**
* 连接建立成功调用的方法*//*
@OnOpen
public void onOpen(Session session, @PathParam("sid") String sid) {
this.session = session;
webSocketSet.add(this); //加入set中
addOnlineCount(); //在线数加1
log.info("有新窗口开始监听:"+sid+",当前在线人数为" + getOnlineCount());
this.sid=sid;
try {
sendMessage("连接成功");
} catch (IOException e) {
log.error("websocket IO异常");
}
}
*/
/**
* 连接关闭调用的方法
*//*
@OnClose
public void onClose() {
webSocketSet.remove(this); //从set中删除
subOnlineCount(); //在线数减1
log.info("有一连接关闭！当前在线人数为" + getOnlineCount());
}
*/
/**
* 收到客户端消息后调用的方法
*
* @param message 客户端发送过来的消息*//*
@OnMessage
public void onMessage(String message, Session session) {
log.info("收到来自窗口"+sid+"的信息:"+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) {
log.error("发生错误");
error.printStackTrace();
}
*/
/**
* 实现服务器主动推送
*//*
public void sendMessage(String message) throws IOException {
this.session.getBasicRemote().sendText(message);
}
*/
/**
* 群发自定义消息
* *//*
public static void sendInfo(String message,@PathParam("sid") String sid) throws IOException {
log.info("推送消息到窗口"+sid+"，推送内容:"+message);
for (WebSocketServer item : webSocketSet) {
try {
//这里可以设定只推送给这个sid的，为null则全部推送
if(sid==null) {
item.sendMessage(message);
}else if(item.sid.equals(sid)){
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--;
}
public static CopyOnWriteArraySet<WebSocketServer> getWebSocketSet() {
return webSocketSet;
}
}
1.3：添加对应的controller

@Controller
@RequestMapping("/system")
public class SystemController {
//页面请求
@GetMapping("/index/{userId}")
public ModelAndView socket(@PathVariable String userId) {
ModelAndView mav=new ModelAndView("/socket1");
mav.addObject("userId", userId);
return mav;
}
//推送数据接口
@ResponseBody
@RequestMapping("/socket/push/{cid}")
public Map pushToWeb(@PathVariable String cid, String message) {
Map result = new HashMap();
try {
WebSocketServer.sendInfo(message,cid);
result.put("code", 200);
result.put("msg", "success");
} catch (IOException e) {
e.printStackTrace();
}
return result;
}
 1.4：提供socket1.html页面

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"></meta>
<title>Title</title>
</head>
<body>
hello world!

</body>
<script>
var socket;
if(typeof(WebSocket) == "undefined") {
console.log("您的浏览器不支持WebSocket");
}else{
console.log("您的浏览器支持WebSocket");
//实现化WebSocket对象，指定要连接的服务器地址与端口 建立连接
//等同于
index = new WebSocket("ws://localhost:8885/websocket/2");
//socket = new WebSocket("${basePath}websocket/${cid}".replace("http","ws"));
//打开事件
index.onopen = function() {
console.log("Socket 已打开");
//socket.send("这是来自客户端的消息" + location.href + new Date());
};
//获得消息事件
index.onmessage = function(msg) {
console.log(msg.data);
//发现消息进入 开始处理前端触发逻辑
};
//关闭事件
index.onclose = function() {
console.log("Socket已关闭");
};
//发生了错误事件
index.onerror = function() {
alert("Socket发生了错误");
//此时可以尝试刷新页面
}
//离开页面时，关闭socket
//jquery1.8中已经被废弃，3.0中已经移除
// $(window).unload(function(){
// socket.close();
//});
}
</script>
</html>
 总结：

浏览器debug访问 localhost:8885/system/index/1跳转到socket1.html，js自动连接server并传递cid到服务端，服务端对应的推送消息到客户端页面（cid区分不同的请求，server里提供的有群发消息方法）

2.1：基于STOMP协议的WebSocket

使用STOMP的好处在于，它完全就是一种消息队列模式，你可以使用生产者与消费者的思想来认识它，发送消息的是生产者，接收消息的是消费者。而消费者可以通过订阅不同的destination，来获得不同的推送消息，不需要开发人员去管理这些订阅与推送目的地之前的关系，spring官网就有一个简单的spring-boot的stomp-demo,如果是基于springboot，大家可以根据spring上面的教程试着去写一个简单的demo。

提供websocketConfig配置类

/**
* @Description:
registerStompEndpoints(StompEndpointRegistry registry)
configureMessageBroker(MessageBrokerRegistry config)
这个方法的作用是定义消息代理，通俗一点讲就是设置消息连接请求的各种规范信息。
registry.enableSimpleBroker("/topic")表示客户端订阅地址的前缀信息，也就是客户端接收服务端消息的地址的前缀信息（比较绕，看完整个例子，大概就能明白了）
registry.setApplicationDestinationPrefixes("/app")指服务端接收地址的前缀，意思就是说客户端给服务端发消息的地址的前缀
* @Author:[email protected]
* @Date: 2019/5/31
*/
@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig extends AbstractWebSocketMessageBrokerConfigurer {

// 这个方法的作用是添加一个服务端点，来接收客户端的连接。
// registry.addEndpoint("/socket")表示添加了一个/socket端点，客户端就可以通过这个端点来进行连接。
// withSockJS()的作用是开启SockJS支持，
@Override
public void registerStompEndpoints(StompEndpointRegistry registry) {
registry.addEndpoint("/socket").withSockJS();
}
@Override
public void configureMessageBroker(MessageBrokerRegistry registry) {
//表示客户端订阅地址的前缀信息，也就是客户端接收服务端消息的地址的前缀信息
registry.enableSimpleBroker("/topic");
//指服务端接收地址的前缀，意思就是说客户端给服务端发消息的地址的前缀
registry.setApplicationDestinationPrefixes("/app");
}
}
 2.2：controller提供对应请求的接口

//页面请求
@GetMapping("/socket2")
public ModelAndView socket2() {//@PathVariable String userId
ModelAndView mav=new ModelAndView("html/socket2");
//mav.addObject("userId", userId);
return mav;
}

/**
* @Description:这个方法是接收客户端发送功公告的WebSocket请求，使用的是@MessageMapping
* @Author:[email protected]
* @Date: 2019/5/31
*/
@MessageMapping("/change-notice")//客户端访问服务端的时候config中配置的服务端接收前缀也要加上 例：/app/change-notice
@SendTo("/topic/notice")//config中配置的订阅前缀记得要加上
public CustomMessage greeting(CustomMessage message){
System.out.println("服务端接收到消息："+message.toString());
//我们使用这个方法进行消息的转发发送！
//this.simpMessagingTemplate.convertAndSend("/topic/notice", value);(可以使用定时器定时发送消息到客户端)
// @Scheduled(fixedDelay = 1000L)
// public void time() {
// messagingTemplate.convertAndSend("/system/time", new Date().toString());
// }
//也可以使用sendTo发送
return message;
}
2.3：提供socket2.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<title>Spring Boot+WebSocket+广播式</title>

</head>
<body >
<noscript><h2 style="color: #ff0000">貌似你的浏览器不支持websocket</h2></noscript>
<div>
<div>
<button id="connect" onclick="connect();">连接</button>
<button id="disconnect" disabled="disabled" onclick="disconnect();">断开连接</button>
</div>
<div id="conversationDiv">
<label>输入你的名字</label><input type="text" id="name" />
<button id="sendName" onclick="sendName();">发送</button>
<p id="response"></p>
</div>
</div>
<script th:src="@{/js/sockjs.min.js}"></script>
<script th:src="@{/js/stomp.min.js}"></script>
<script th:src="@{/js/jquery-3.2.1.min.js}"></script>
<script type="text/javascript">
var stompClient = null;

function setConnected(connected) {
document.getElementById(‘connect‘).disabled = connected;
document.getElementById(‘disconnect‘).disabled = !connected;
document.getElementById(‘conversationDiv‘).style.visibility = connected ? ‘visible‘ : ‘hidden‘;
$(‘#response‘).html();
}

function connect() {
var socket = new SockJS(‘/socket‘); //1
stompClient = Stomp.over(socket);//2
stompClient.connect({}, function(frame) {//3
setConnected(true);
console.log(‘开始进行连接Connected: ‘ + frame);
stompClient.subscribe(‘/topic/notice‘, function(respnose){ //4
showResponse(JSON.parse(respnose.body).responseMessage);
});
});
}

function disconnect() {
if (stompClient != null) {
stompClient.disconnect();
}
setConnected(false);
console.log("Disconnected");
}

function sendName() {
var name = $(‘#name‘).val();
stompClient.send("/app/change-notice", {}, JSON.stringify({ ‘name‘: name }));//5
}

function showResponse(message) {
var response = $("#response");
response.html(message);
}
</script>
</body>
</html>
2.4:对应的js引用可以去网上下载

2.5：浏览器debug访问localhost:8885/system/socket2，点击连接连接到服务器，数据内容可以推送到服务器以及服务器消息回推。

2.6：实现前端和服务端的轮训可以页面Ajax轮训也可以后端添加定时器

@Component
@EnableScheduling
public class TimeTask {
private static Logger logger = LoggerFactory.getLogger(TimeTask.class);

@Scheduled(cron = "0/20 * * * * ?")
public void test(){
System.err.println("********* 定时任务执行 **************");
CopyOnWriteArraySet<WebSocketServer> webSocketSet =
WebSocketServer.getWebSocketSet();
int i = 0 ;
webSocketSet.forEach(c->{
try {
c.sendMessage(" 定时发送 " + new Date().toLocaleString());
} catch (IOException e) {
e.printStackTrace();
}
});

System.err.println("/n 定时任务完成.......");
}
}
代码在https://github.com/huiyunfei/spring-cloud.git 的admin项目里

基于STOMP协议的广播模式和点对点模式消息推送可参考：
https://www.cnblogs.com/hhhshct/p/8849449.html

https://www.cnblogs.com/jmcui/p/8999998.html
————————————————
版权声明：本文为CSDN博主「不偷腥的mao」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/huiyunfei/article/details/90719351

原文地址：https://www.cnblogs.com/Jeremy2001/p/11525082.html

时间： 2024-11-06 18:48:22

springboot集成websocket的两种实现方式的相关文章

Springboot中IDE支持两种打包方式，即jar包和war包

Springboot中IDE支持两种打包方式,即jar包和war包 打包之前修改pom.xml中的packaging节点,改为jar或者war    在项目的根目录执行maven 命令clean package -Dmaven.test.skip=true,即可打包,如下 命令执行成功后,在target目录下即可看到打包好的文件 提示:若打的包为jar包,可通过java -jar guns-xxx.jar来启动Guns系统 原文地址:https://www.cnblogs.com/mracale

springboot之jackson的两种配置方式

springboot 针对jackson是自动化配置的,如果需要修改,有两种方式: 方式一:通过application.yml 配置属性说明:## spring.jackson.date-format指定日期格式,比如yyyy-MM-dd HH:mm:ss,或者具体的格式化类的全限定名 spring.jackson.deserialization是否开启Jackson的反序列化 spring.jackson.generator是否开启json的generators. spring.jackson

我爱Java系列之---【SpringBoot中常用的注解和两种注入方式】

@EnableConfigurationProperties(DataSourceProperties.class) 来声明要使用DataSourceProperties 这个类并初始化该类对象,该类不用放在IOC容器中,可以通过该注解直接使用. [email protected]:一般写在类上边,通过该注解将当前类初始化到Spring的IOC容器中,其他类若想调用,直接用@Autowired去容器中拿. [email protected]: 一般写在类上边,标明该类是一个配置类,被注解的类内部

JAVABEAN是什么和总结JAVABEAN的两种使用方式

看完这个后再也不纠结javabean是什么东西了,感谢博主,由于是Javablog不能收藏故在此转发. 以下内容转自:http://www.blogjava.net/flysky19/articles/88180.html 一. javabean 是什么? Javabean 就是一个类,这个类就定义一系列 get<Name> 和 set<Name> 方法. So simple ! Javabean 就是为了和 jsp 页面传数据化简交互过程而产生的. 自己的理解: 使用 javab

Java多线程的两种实现方式：继承Thread类 &amp; 实现Runable接口

------Java培训.Android培训.iOS培训..Net培训.期待与您交流! 创建和启动线程的两种传统方式: Java提供了线程类Thread来创建多线程的程序.其实,创建线程与创建普通的类的对象的操作是一样的,而线程就是Thread类或其子类的实例对象.每个Thread对象描述了一个单独的线程.要产生一个线程,有两种方法: ◆需要从Java.lang.Thread类派生一个新的线程类,重载它的run()方法: ◆实现Runnalbe接口,重载Runnalbe接口中的run()方法.

Windows校验文件哈希hash的两种常用方式

大家经常都到哪儿去下载软件和应用程序呢?有没想过下载回来的软件.应用程序或资源是否安全呢?在 Windows 10 和 Office 2016 发布当初,很多没权限的朋友都使用第三方网站去下载安装映像.而大家如何保证自己下载回来的映像或软件就是官方版本,而没有被别人篡改过呢? 很多朋友会想到将下载回来的资源校验 MD5 或 SHA1 与官方版哈希值进行对比,如果无误则表示未被篡改.大家平常在 Windows 中都使用何种工具算校验值呢?本文向大家推荐 Windows 校验文件哈希的两种常用方式.

PlaceHolder的两种实现方式

placeholder属性是HTML5 中为input添加的.在input上提供一个占位符,文字形式展示输入字段预期值的提示信息(hint),该字段会在输入为空时显示. 如 1 <input type="text" name="loginName" placeholder="邮箱/手机号/QQ号"> 目前浏览器的支持情况 浏览器 IE6/7/8/9 IE10+ Firefox Chrome Safari  是否支持 NO YES YE

简易版聊天系统实现 Socket VS NIO两种实现方式

说是简单聊天系统,压根不能算是一个系统,顶多算个雏形.本文重点不在聊天系统设计和实现上,而是通过实现类似效果,展示下NIO 和Socket两种编程方式的差异性.说是Socket与NIO的编程方式,不太严谨,因为NIO的底层也是通过Socket实现的,但又想不出非常好的题目,就这样吧. 主要内容 Socket方式实现简易聊天效果 NIO方式实现简易聊天效果 两种方式的性能对比 前言 预期效果,是客户端之间进行"广播"式聊天,类似于QQ群聊天.希望以后有机会,以此简易版为基础,不断演进,演

Redis两种持久化方式(RDB&amp;AOF)

爬虫和转载请注明原文地址;博客园蜗牛:http://www.cnblogs.com/tdws/p/5754706.html Redis所需内存 超过可用内存怎么办 Redis修改数据多线程并发—Redis并发锁 windows下redis基础操作与主从复制 从而 数据备份和读写分离 Redis两种持久化方式(RDB&AOF) Redis的持久化过程中并不需要我们开发人员过多的参与,我们要做的是什么呢?除了深入了解RDB和AOF的作用原理,剩下的就是根据实际情况来制定合适的策略了,再复杂一点,也就