摘要:SseEmitter是Spring Framework中用于服务器发送事件(Server-Sent Events, SSE)的类。SSE是一种允许服务器主动向客户端推送数据的技术,通常用于实现如实时通知、数据流等功能。其工作原理基于HTTP协议,客户端通过HT
SseEmitter是Spring Framework中用于服务器发送事件(Server-Sent Events, SSE)的类。SSE是一种允许服务器主动向客户端推送数据的技术,通常用于实现如实时通知、数据流等功能。其工作原理基于HTTP协议,客户端通过HTTP请求订阅服务器的事件流,服务器则通过SseEmitter对象持续向客户端发送事件。
SseEmitter的核心特性
单向通信:SSE是单向的,只允许服务器向客户端推送数据,客户端不能通过此通道向服务器发送数据。基于HTTP:SSE使用标准的HTTP协议,因此不需要额外的协议支持,易于实现和使用。自动重连:如果连接中断,客户端浏览器会自动尝试重新连接服务器。事件流格式:SSE使用简单的文本格式传输数据,每条消息以data:开头,并以两个换行符\n\n结束SseEmitter的使用场景
实时数据流:在需要实时数据更新的应用中,如股票交易平台,服务器可以使用SseEmitter向客户端推送最新的股票价格和交易信息。实时通知:适用于需要向用户发送实时通知的场景,例如在线教育平台的新课程发布或作业提交通知。聊天应用:在聊天应用中,SseEmitter可以用来实现实时消息推送,提高消息传递的效率。监控系统:在监控系统中,SseEmitter可以用于实时推送监控数据,如物联网项目中传感器采集的数据,以实时监控设备状态。SseEmitter的基本用法
创建SseEmitter实例:在控制器中创建一个SseEmitter实例,并将其返回给客户端。发送事件:通过SseEmitter实例的send方法向客户端发送事件。处理连接关闭:通过SseEmitter的onCompletion和onTimeout方法处理连接关闭或超时的情况。通过SseEmitter,开发者可以构建出高效、可靠的实时应用,提升用户体验和系统性能。下面我们通过一个简单示例演示下
创建Vue 3项目获取消息,然后进行等待服务端的消息。
Server-Sent Events
{{ message.content }}import { ref, onMounted, onUnmounted } from 'vue';import { SseClient } from './SseClient';const messages = ref();const sseClient = new SseClient((event) => {const data = JSON.parse(event.data);messages.value.push(data);});onMounted( => {sseClient.connect;});onUnmounted( => {sseClient.disconnect;});/* Add your styles here */创建JS文件SseClient
export class SseClient {constructor(onMessage) {this.onMessage = onMessage;this.eventSource = null;}connect {this.eventSource = new EventSource('http://localhost:8089/events/54321');this.eventSource.onmessage = (event) => {this.onMessage(event);};this.eventSource.onerror = (error) => {this.disconnect;};}disconnect {if (this.eventSource) {this.eventSource.close;this.eventSource = null;}}}然后再Vue项目入口 APP.vue中引入刚才的Vue文件。
创建SpringBoot服务
直接写一个简易的Controller,将SseEmitter 缓存起来,可以直接进行消息发送。
@Controllerpublic class SseEmitterController {private static Map sseCache = new ConcurrentHashMap;@CrossOrigin(origins = "*")@GetMapping("/events/{userId}")public SseEmitter stream(@PathVariable String userId) throws IOException {sseCache.put(userId,new SseEmitter(10 * 60 * 1000L));SseEmitter emitter = sseCache.get(userId);Map map = new HashMap;map.put("id", userId);map.put("content", "连接成功");emitter.send(map);return emitter;}@GetMapping("/sendMessage/{userId}")public String sendMessage(@PathVariable String userId,@RequestParam(name = "message", required = false) String message) throws IOException {SseEmitter emitter = sseCache.get(userId);Map map = new HashMap;map.put("id", userId);map.put("content", message);emitter.send(map);return "成功";}@GetMapping("/close/{userId}")public String close(@PathVariable String userId) throws IOException {SseEmitter emitter = sseCache.get(userId);emitter.complete;return "成功";}}前后端启动后联调:
初始化连接成功。
再手动发送消息。
客户端接收消息:
以上是一个简易的服务端主动推送消息给客户端的例子。
来源:马士兵老师
免责声明:本站系转载,并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题,请在30日内与本站联系,我们将在第一时间删除内容!