SSE使用详解及浏览器连接限制问题解决

最新推荐文章于 2024-08-21 09:30:00 发布

不学习哪有饭吃呀

最新推荐文章于 2024-08-21 09:30:00 发布

阅读量5.8k

点赞数 23

文章标签： spring boot java websocket https http tcp ssl

本文链接：https://blog.csdn.net/bxxnyfcy/article/details/135974577

版权

一、SSE简介

SSE是一种在网页开发中使用的、基于HTTP长连接技术，允许服务器向客户端浏览器实时推送更新。客户端通过创建一个EventSource对象并指向服务器上的一个URL来发起请求，这个请求保持打开状态，服务器可以在这个单一的TCP连接上不断发送新的数据块。这些数据块被称为“事件”，每个事件包含类型（可选）、数据和一些元数据（如事件ID，重新连接时间间隔等）。服务器端以简单的文本格式（通常为UTF-8编码的纯文本）发送数据。

二、SSE有什么用

理论上， SSE 和 WebSocket 做的是同一件事情。当你需要用新数据局部实时更新网络应用时，SSE 可以做到不需要用户执行任何操作，便可以完成。

　　如统计数据的实时情况。类似这种更新频繁、低延迟的场景，SSE 可以完全满足。

SSE 是单向通道，只能服务器向客户端发送消息，当客户端发送一个 HTTP 请求，和服务器进行了一次握手，SSE便可以一直向客户端发送消息。相对于 WebSocket 的双工通道来说，开销会更小一些。

三、SSE发送的数据类型

在服务器端，需要使用text/event-stream作为响应的Content-Type。发送的数据中：

1. event字段是可选的，用于指定事件的名称；

2. data字段是必须的，用于指定数据的内容；

3. id字段是可选的，用于指定事件的标识符；

4. retry字段是可选的，用于指定客户端在连接断开后重新连接的时间间隔（以毫秒为单位）。

每个字段都必须以换行符（\n）结尾，并且每个消息都必须以两个换行符（\n\n）结尾。

四、SSE的使用

本文使用的是springboot集成的SSE，使用SseEmitter来实现sse的消息推送

1. pom文件引入依赖

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-web</artifactId>
</dependency>

springboot中集成了SSE，引入springboot的依赖即可。

2. 编写创建长链接接口

这里展示创建SseEmitter的service的代码，controller中仅调用该接口即可

    public SseEmitter createSseConnect() {
        // 设置超时时间，0表示不过期。默认30秒，超过时间未完成会抛出异常：AsyncRequestTimeoutException
        SseEmitter sseEmitter = new SseEmitter(0L);
        String clientId = String.valueOf(UUID.randomUUID());
        sseCache.put(clientId, sseEmitter);
        // 连接断开回调
        sseEmitter.onCompletion(() -> {
            sseCache.get(clientId).complete();
            sseCache.remove(clientId);
        });
        // 连接超时
        sseEmitter.onTimeout(()-> {
            sseCache.get(clientId).complete();
            sseCache.remove(clientId);
        });
        // 连接报错
        sseEmitter.onError((throwable) ->  {
            sseCache.get(clientId).complete();
            sseCache.remove(clientId);
        });

        return sseEmitter;
    }

其中，创建sseEmitter对象，并创建UUID用于唯一标识该sseEmitter。

然后将sseEmitter存入缓存中（sseCache为全局缓存），以便发送的时候使用。

然后再配置回调函数，包括:

（1） onCompletion：连接断开的回调
（2） onTimeout: 连接超时回调（目前配置为不超时）
 (3) onError: 连接报错回调。

在回调函数中，调用

complete(): 表示执行完毕，会断开连接

再移除缓存中的连接信息。

3. 发送数据

在SseEmitter中，重载了三个send方法，归根结底都是调用同一个send方法，这里给大家介绍一个最全面的。

//先调用event（）方法，返回SseEventBuilder
SseEmitter.SseEventBuilder event = event();

其中builder可以配置多个参数（以下为SSE源码）

    public interface SseEventBuilder {
        SseEventBuilder id(String id);

        SseEventBuilder name(String eventName);

        SseEventBuilder reconnectTime(long reconnectTimeMillis);

        SseEventBuilder comment(String comment);

        SseEventBuilder data(Object object);

        SseEventBuilder data(Object object, @Nullable MediaType mediaType);

        Set<ResponseBodyEmitter.DataWithMediaType> build();
    }

以下为SSE发送消息代码示例：

    public void ssePushMsg() {

        if (CollectionUtils.isEmpty(sseCache)) {
            return;
        }

        for (Map.Entry<String, SseEmitter> entry : sseCache.entrySet()) {
            try {
                SseEmitter.SseEventBuilder event = event();
                event.id("11");
                event.name("这是名字");
                event.data("这是一条sse数据");
                //发送消息
                entry.getValue().send(event);

            } catch (IOException e) {
                // 处理异常
                log.error("发送失败");
            }
        }

    }

到这里发送消息就结束了，前端可以通过EventSource获取数据。还可以通过请求上述的“创建长链接接口”的连接获取数据。具体效果如下：