我要评论一.什么是sse？
sse（server-sent events）是一种在web应用中实现单向实时通信的技术。通过sse，服务器可以主动向客户端发送更新，而无需客户端不断发起请求。这对于需要实时更新的应用场景（如聊天应用、实时数据监控等）非常有用。（服务端单向传输客户端，长连接）
主要特点：
- 单向通信：数据从服务器流向客户端，客户端不能直接向服务器发送数据。
- 基于http：sse使用http协议，简单易用，支持浏览器。
- 自动重连：如果连接丢失，浏览器会自动尝试重连。
- 文本格式：数据以文本流的形式发送，通常是utf-8编码。
使用场景：频繁的更新数据，低延迟，单向通信
二.sse的实现过程：
首先前端给后端发送请求，随后后端会返回响应文本流创建连接，然后后端就可以持续的长连接进行给前端传输数据。
sse 基于 http 协议，利用了其长连接特性，通过浏览器向服务器发送一个 http 请求，建立一条持久化的连接。sse 可以传输文本和二进制格式的数据，但只支持单向数据流，即只能由服务器向客户端推送数据。
三.sse的前端实现：
1.创建 eventsource 对象：
通过指定服务器端的sse url，创建一个
eventsource实例。
const eventsource = new eventsource('http://localhost:8080/sse/chat');2.处理接收到的信息：
使用
onmessage事件处理程序接收服务器发送的消息。
eventsource.onmessage = function(event) {
console.log('received:', event.data);
// 在这里处理接收到的数据，比如更新ui
};
接收到的event是一个messageevent对象，它包含以下重要属性：
data：这是服务器发送的消息内容，通常是文本或json字符串。origin：表示事件来源的uri，通常是服务器的url。lasteventid：如果浏览器重新连接，它会包含最后接收到的事件id，这在处理丢失消息时非常有用。
eventsource.onmessage = function(event) {
// event.data的结果假设是 '{"name": "alice", "age": 25}'
console.log('received:', event.data);
// 如果是json格式，解析后 message 是一个对象： { name: "alice", age: 25 }
const message = json.parse(event.data);
// 在这里更新ui或进行其他操作
};
sse发送的数据是以文本流的形式传输的，通常是字符串（例如，json格式的字符串）。如果服务器发送的是json格式的字符串（例如 {"key": "value"}），那么你可以使用 json.parse() 将这个字符串转换为javascript对象，以便更方便地访问数据。
3.处理特定事件：
如果服务器发送了不同类型的事件，可以使用
oneventname处理特定事件。
eventsource.addeventlistener('customevent', function(event) {
console.log('custom event received:', event.data);
});
4.处理连接错误问题：
可以使用
onerror事件处理程序来处理连接错误。
eventsource.onerror = function(event) {
console.error('eventsource failed:', event);
// 可以在这里实现重连逻辑
};
5.关闭连接：
如果不再需要接收消息，可以通过调用
close方法来关闭连接。
eventsource.close();
四.sse的后端实现：
1.导入web依赖：
<dependency>
<groupid>org.springframework.boot</groupid>
<artifactid>spring-boot-starter-web</artifactid>
</dependency>
2.创建controller类：
package com.itheima.bigdealboot.controller;
import lombok.extern.slf4j.slf4j;
import org.springframework.http.mediatype;
import org.springframework.web.bind.annotation.getmapping;
import org.springframework.web.bind.annotation.requestmapping;
import org.springframework.web.bind.annotation.restcontroller;
import org.springframework.web.servlet.mvc.method.annotation.sseemitter;
import java.io.ioexception;
import java.util.concurrent.executors;
import java.util.concurrent.scheduledexecutorservice;
import java.util.concurrent.timeunit;
@restcontroller
@requestmapping("/sse")
@slf4j
public class ssecontroller {
@getmapping(value = "/chat", produces = mediatype.text_event_stream_value)
public sseemitter ssechat(){
sseemitter emitter = new sseemitter();
// 创建一个定时任务
scheduledexecutorservice executor = executors.newsinglethreadscheduledexecutor();
executor.scheduleatfixedrate(() -> {
try {
// 发送当前时间戳
emitter.send(system.currenttimemillis());
} catch (ioexception e) {
// 处理异常（如客户端关闭连接）
emitter.completewitherror(e);
}
}, 0, 1, timeunit.seconds); // 每秒发送一次
// 处理连接关闭
emitter.oncompletion(() -> executor.shutdown());
emitter.ontimeout(() -> {
emitter.complete();
executor.shutdown();
});
return emitter; // 返回sseemitter实例
}
}
- sseemitter实例：创建
sseemitter对象，准备向前端发送事件。 - 定时任务：使用
scheduledexecutorservice定期发送数据（如当前时间戳）。如果发送失败（例如，客户端关闭连接），则调用completewitherror()处理异常。 - 连接关闭处理：
oncompletion()：当连接正常关闭时调用，执行资源清理。ontimeout()：在连接超时时关闭连接。
3.seeemitter的介绍以及使用方法：
sseemitter是 spring框架提供的一个类，用于支持 server-sent events (sse)。
（1）. 构造方法
sseemitter()：创建一个新的sseemitter实例，使用默认的超时值。sseemitter(long timeout)：创建一个新的sseemitter实例，设置指定的超时时间（毫秒）。
（2）. 发送数据
send(object data)：发送数据到客户端。send(object data, mediatype mediatype)：发送数据到客户端，并指定数据的媒体类型。send(sseevent event)：发送一个sseevent对象到客户端。
（3）. 关闭连接
complete()：正常完成事件流，关闭连接。completewitherror(throwable throwable)：由于错误完成事件流，并关闭连接。completewitherror(string message)：由于错误完成事件流，并关闭连接，提供错误信息。
（4）. 连接状态处理
oncompletion(runnable callback)：注册连接完成的回调函数。ontimeout(runnable callback)：注册连接超时的回调函数。
（5）. 获取超时时间
gettimeout()：返回当前的超时时间（毫秒）。
（6）. 其他
iscompleted()：检查sseemitter是否已完成。isexpired()：检查sseemitter是否已过期。
总结
到此这篇关于使用sse流式输出(javaweb前后端)的文章就介绍到这了,更多相关javaweb前后端sse流式输出内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网！
发表评论