服务端实时推送技术之SSE(Server-Send Events)

文章目录

  • 前言
  • 一、解决方案:
      • 1、传统实时处理方案:
      • 2、HTML5 标准引入的实时处理方案:
      • 3、第三方推送:
  • 二、SSE
    • 1.引入库
      • 1、客户端:
    • 2.服务端:
    • 三、业务实践:
        • 能否做到精准投递?
  • 总结


前言

服务端推送,也称为消息推送或通知推送,是一种允许应用服务器主动将信息发送到客户端的能力,为客户端提供了实时的信息更新和通知,增强了用户体验。

服务端推送的背景与需求主要基于以下几个诉求:

  • 实时通知:在很多情况下,用户期望实时接收到应用的通知,如新消息提醒、商品活动提醒等。

  • 节省资源:如果没有服务端推送,客户端需要通过轮询的方式来获取新信息,会造成客户端、服务端的资源损耗。通过服务端推送,客户端只需要在收到通知时做出响应,大大减少了资源的消耗。

  • 增强用户体验:通过服务端推送,应用可以针对特定用户或用户群发送有针对性的内容,如优惠活动、个性化推荐等。这有助于提高用户对应用的满意度和黏性。

常见推送场景有:微信消息通知栏、新闻推送、外卖状态 等等,我们自身的推送场景有:下载、连线请求、直播提醒 …


一、解决方案:

1、传统实时处理方案:

轮询:这是一种较为传统的方式,客户端会定时地向服务端发送请求,询问是否有新数据。服务端只需要检查数据状态,然后将结果返回给客户端。轮询的优点是实现简单,兼容性好;缺点是可能产生较大的延迟,且对服务端资源消耗较高。

长轮询(Long Polling):轮询的改进版。客户端向服务器发送请求,服务器收到请求后,如果有新的数据,立即返回给客户端;如果没有新数据,服务器会等待一定时间(比如30秒超时时间),在这段时间内,如果有新数据,就返回给客户端,否则返回空数据。客户端处理完服务器返回的响应后,再次发起新的请求,如此反复。长轮询相较于传统的轮询方式减少了请求次数,但仍然存在一定的延迟。

2、HTML5 标准引入的实时处理方案:

WebSocket:一种双向通信协议,同时支持服务端和客户端之间的实时交互。WebSocket 是基于 TCP 的长连接,和HTTP 协议相比,它能实现轻量级的、低延迟的数据传输,非常适合实时通信场景,主要用于交互性强的双向通信。

SSE:SSE(Server-Sent Events)是一种基于 HTTP 协议的推送技术。服务端可以使用 SSE 来向客户端推送数据,但客户端不能通过SSE向服务端发送数据。相较于 WebSocket,SSE 更简单、更轻量级,但只能实现单向通信。

两者的主要区别:

SSEWebSocket
通信单向通信双向通信
协议HTTPWebSocket
自动重连支持不支持,需要客户端自行支持
数据格式文本格式,如果需要二进制数据,需要自行编码默认二进制数据,支持文本格式
浏览器支持大部分支持,早期Edge浏览器,Internet Explorer不支持主流浏览器(包括移动端)的支持较好

3、第三方推送:

常见的有操作系统提供相应的推送服务,如苹果的APNs(Apple Push Notification service)、谷歌的FCM(Firebase Cloud Messaging)等。同时,也有一些跨平台的推送服务,如个推、极光推送、友盟推送等,帮助开发者在不同平台上实现统一的推送功能。

这种推送方式在生活中十分常见,一般你打开手机就能看到各种信息推送,基本就是利用第三方推送来实现。

二、SSE

1.引入库

接下来我们重点讲讲 SSE 服务端推送,它基于 HTTP 协议,易于实现和部署,特别适合那些需要服务器主动推送信息、客户端只需接收数据的场景:

1、客户端:

Server-Sent Events(SSE)是 HTML5 的一部分,用于从服务器实时接收更新,目前大部分主流浏览器都提供了支持:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>SSE Client</title>
</head>
<body>
    <h1>Receive: <span id="sse"></span></h1>
    <script>
        const numberElement = document.getElementById("sse");
        const source = new EventSource('http://localhost:8080/sse');

        source.onmessage = (event) => {
            numberElement.innerText = event.data;
        };

        source.onerror = (error) => {
            console.error("SSE error:", error);
        };
    </script>
</body>
</html>

自动重连:一旦连接断开,浏览器会自动尝试重新建立连接。当然,每个浏览器都有自己的重连策略和措施。因此,重连时间和尝试次数可能因浏览器而异。

2.服务端:

我们目前服务端主要使用 Spring,其对 SSE 主要提供了两种支持:

  • Spring WebMVC:传统的基于 Servlet 的同步阻塞编程模型,即 同步模型Web框架。
  • Spring WebFlux:异步非阻塞的响应式编程模型,即 异步模型Web框架。

1)Spring WebFlux 中的 SSE 支持(支持版本Spring5.0):

Spring WebFlux 框架提供了一套基于响应式编程的非阻塞异步IO模型,能高效支持 SSE。在 Spring WebFlux 中,我们可以结合 Flux 和 MediaType.TEXT_EVENT_STREAM_VALUE 来实现 SSE。

以下示例展示如何在 Spring WebFlux 中创建 SSE 流:

import org.springframework.http.MediaType;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import reactor.core.publisher.Flux;

import java.time.Duration;

@RestController
public class SseController {

    @GetMapping(value = "/sse", produces = MediaType.TEXT_EVENT_STREAM_VALUE)
    public Flux<String> getSseStream() {
        // 使用Flux生成每秒一个递增的数据流,用于模拟实时数据推送
        return Flux.interval(Duration.ofSeconds(1))
                .map(sequence -> "Data: " + sequence);
    }
}

Spring WebFlux 底层依赖于两个非阻塞的异步框架: Reactor 和 Netty。其中,Reactor 库主要是提供响应式式编程的支持,Netty 是一个高性能的非阻塞网络框架,主要负责处理 HTTP 输入输出。

  • Reactor:Reactor 是一个基于 Java 8 的响应式流库,它实现了 Reactive Streams 规范。Reactor 提供了两个核心的响应式类型 - Mono 和 Flux,相当于 findOne 和 findList 的区别。这两个类型提供了丰富的操作符,允许你以声明式和函数式的方式来处理你的业务逻辑。
  • Netty:Netty 是一个高性能、异步的事件驱动的网络框架,虽然 Netty 重点在网络通信层,但仍然提供了 Web 服务器的能力。
    Reactor 对 Netty 进行了集成,提供了子模块 Reactor Netty,在 Spring WebFlux 中,Reactor Netty 主要用作默认的服务器运行时环境,负责处理 HTTP 请求和响应。

这两个框架共同为 Spring WebFlux 提供了底层的支持,使得我们能够使用响应式编程编写高性能、可扩展的Web应用程序。另外,虽然 Spring WebFlux 在底层默认使用 Reactor 和 Netty,但它也有很好的灵活性和可替换性,我们可以根据需要更换其他非阻塞的异步框架。

2)Spring WebMVC 中的 SSE 支持(支持版本Spring4.2):

在 Spring WebMVC 中,可以通过SseEmitter对象来处理 SSE 请求,它允许将数据通过 SSE 连接发送给客户端。

下面是一个使用SseEmitter提供 SSE 的简单示例:

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.mvc.method.annotation.SseEmitter;

import java.util.concurrent.ExecutorService;
import java.util.concurrent.Executors;

@RestController
public class SseController {

    private ExecutorService nonBlockingService = Executors.newCachedThreadPool();

    @GetMapping("/sse")
    public SseEmitter getSseStream() {
        SseEmitter emitter = new SseEmitter();

        nonBlockingService.execute(() -> {
            // 这里模拟数据发送给客户端的逻辑
            try {
                for (int i = 0; i < 10; i++) {
                    emitter.send("Data: " + i);
                    Thread.sleep(1000);
                }
                emitter.complete();
            } catch (Exception ex) {
                emitter.completeWithError(ex);
            }
        });

        return emitter;
    }
}

如果你的项目使用 SpringMVC 模型,不想再引入 Spring WebFlux,能否利用 Reactor 响应式库呢?

答案也是可以的,虽然 SpringMVC 主要提供的是同步阻塞能力,但也不妨碍它提供一定的异步支持,比如这里,我们可以直接引入 Reactor 库,也同样可以实现 SSE:

import org.springframework.http.MediaType;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import reactor.core.publisher.Flux;

import java.time.Duration;

@RestController
public class SseController {

    @GetMapping(value = "/sse", produces = MediaType.TEXT_EVENT_STREAM_VALUE)
    public Flux<String> getSseStream() {
        // 使用Flux生成每秒一个递增的数据流,用于模拟实时数据推送
        return Flux.interval(Duration.ofSeconds(1))
                .map(sequence -> "Data: " + sequence);
    }
}

基于 Spring WebMVC 或 Spring WebFlux,我们可以方便地在 Spring 框架中实现 SSE 的支持。这两种方法根据具体需求和场景,可以灵活选择。

三、业务实践:

我们以「文件下载」功能进行说明,一般情况下,大文件的下载,服务端压力比较大、处理时间也比较长,为了有更好的交互体验,我们可以使用异步处理,服务端处理完了之后主动通知 客户端,效果如下:
在这里插入图片描述

在这里插入图片描述
1)SSE 连接:

先建立 SSE 连接,确保服务端有主动推送消息的能力。

2)异步下载:

长耗时下载任务我们通过异步的方式处理,避免用户在下载页面长时间等待。

3)广播并推送:

下载完成后,我们需要将完成事件推送给客户端。需要注意的是,由于服务是集群部署、SSE 连接在节点本地 Map 维护,这就有可能导致当前客户端的 SSE连接所在节点 与 事件推送节点 是两个独立的节点。

因此,我们这里借助于 Redis 的发布/订阅能力,将消息广播出去,能匹配连接的节点负责将消息推送至客户端、其他节点直接丢弃即可。效果图如下:
在这里插入图片描述

能否做到精准投递?

答案也是可以的,我们可以这样来做:

借助 Redis 做中心存储,存储Map<用户,节点IP> 这样的映射关系。
在推送消息之前,先通过映射关系找到该用户的SSE连接所在节点
然后在通过 RPC调用 直接将消息投递到对应的服务节点,最后由该节点进行事件推送。
一般情况下,我们可以用「广播」这种简单粗暴的方式应对大部分场景,毕竟「精准投递」需要中心化的维护节点关系、应对节点变更等,处理起来稍显麻烦。具体视业务场景来做选择即可。


总结

SSE 技术是一种轻量级的实时推送技术,具有支持跨域、使用简单、支持自动重连等特点,使得其在实时消息推送、股票交易等场景下广泛使用。

另外,SSE 相对于 WebSocket 更加轻量级,如果需求场景不需要交互式动作,那么 SSE 是一个不错的选择。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/397641.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

解决Ubuntu中vscode右键没有create catkin package

右键发现没有这个create catkin package 解决方案&#xff1a; 查了一会发现安装个拓展就可以了 效果&#xff1a;

vue页面基本增删改查

练手项目vue页面 新手前端轻喷&#xff1a; 效果如下 1、2两个部分组成&#xff1a; 对应代码中 element-ui中的 el-form 和 el-table 照着抄呗&#xff0c;硬着头皮来&#xff01; 建议&#xff1a;认真读一遍你用的组件 这篇文章烂尾了&#xff0c;对不起大家

element-plus日期选择器2次封装

预期效果 官网默认样式&#xff1a; 修改后的样式&#xff1a; 代码实现 DatePicker.vue <template><div class"date-picker-container"><el-date-picker v-model"date" change"handleChange" type"date" value-for…

抓住母亲节销售机会:Shopee 平台选品策略大揭秘

母亲节&#xff0c;作为一个重要的购物节日&#xff0c;为卖家带来了巨大的销售机会。在Shopee这样的电商平台上&#xff0c;如何通过有效的选品策略吸引消费者、提高销量呢&#xff1f;下面将介绍一些关键策略&#xff0c;帮助卖家在母亲节期间实现销售突破。 先给大家推荐一…

植隆业务中台和金蝶云星空单据接口对接

植隆业务中台和金蝶云星空单据接口对接 源系统:金蝶云星空 金蝶K/3Cloud在总结百万家客户管理最佳实践的基础上&#xff0c;提供了标准的管理模式&#xff1b;通过标准的业务架构&#xff1a;多会计准则、多币别、多地点、多组织、多税制应用框架等&#xff0c;有效支持企业的运…

Linux——信号(2)

在上一张博客我们介绍了Linux中信号的概念和信号是如何产生的&#xff0c;虽然信号 有多种产生方式&#xff0c;但是最终只能由操作系统给对应进程发送特定信号。现在 我将更加规范的介绍Linux中的信号。上一章的遗留问题 我们上一章中在观察信号的默认处理的时候发现终止信号…

新增长100人研讨会:快消零售专场探讨招商加盟数字化转型实战

2024年2月2日下午&#xff0c;一场由纷享销客与杨国福集团联合主办的招商加盟数字化转型研讨会在上海成功举办。本次研讨会汇聚了众多快消零售业界的领军人物&#xff0c;共同探讨行业未来的新增长点。 会议伊始&#xff0c;杨国福集团数字化中心负责人王林林发表了主题演讲&a…

基于Springboot+Vue的在线考试系统源码

✌全网粉丝20W,csdn特邀作者、博客专家、CSDN新星计划导师、java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和毕业项目实战✌ &#x1f345;文末获取项目下载方式&#x1f345; 一、项目背景介绍&#xff1a; 随着现代教育和职业培…

【Vuforia+Unity】AR03-圆柱体物体识别

1.创建数据库模型 这个是让我们把生活中类似圆柱体和圆锥体的物体进行AR识别所选择的模型 Bottom Diameter:底部直径 Top Diameter:顶部直径 Side Length:圆柱侧面长度 请注意&#xff0c;您不必上传所有三个部分的图片&#xff0c;但您需要先为侧面曲面关联一个图像&#…

今日Arxiv最热NLP大模型论文:浙江大学发布统一的幻觉检测框架UNIHD

引言&#xff1a;多模态大语言模型的幻觉问题及其重要性 在人工智能领域&#xff0c;多模态大语言模型&#xff08;MLLMs&#xff09;已经取得了显著的进步&#xff0c;它们在多种任务中展现出了类似人类认知和学习的能力&#xff0c;为人工通用智能&#xff08;AGI&#xff0…

【Java大数据期末】银行管理系统(MySQL数据库)

诚接C语言、C、Java、Python、HTML、JavaScript、vue、MySQL相关编程作业&#xff0c; 标价10-20每份&#xff0c;如有需要请加文章最下方QQ。 本文资源&#xff1a;https://download.csdn.net/download/weixin_47040861/88850902https://download.csdn.net/download/weixin_4…

ClickHouse--06--其他扩展MergeTree系列表引擎

其他扩展MergeTree系列 MergeTree 系列表引擎 --种类 MergeTree 系 列 表 引 擎 包 含 &#xff1a; MergeTreeReplacingMergeTreeSummingMergeTree&#xff08;汇总求和功能&#xff09;AggregatingMergeTree&#xff08;聚合功能&#xff09;CollapsingMergeTree&#xff08…

maven3下载地址(含旧版本)

因为现有的3.8版本与IDEA不兼容&#xff0c;我需要下载3.6版本&#xff0c;但是官网的位置非常隐蔽&#xff0c;找了很多资料才看到。故记录一下。Index of /dist/maven/maven-3 选择需要的版本 选择binaries 选择zip文件下载就可以了

openai chat GPT-4 Technical Report 技术报告论文

摘要 我们报告了 GPT-4 的开发&#xff0c;这是一个大规模、多模态的模型&#xff0c;可以接受图像和文本输入&#xff0c;并生成文本输出。虽然在许多现实场景中不如人类&#xff0c;但 GPT-4 在各种专业和学术基准测试中表现出与人类水平相当的性能&#xff0c;包括在模拟的…

代码编写规范

这里写目录标题 空格头文件位置换行缩进位置符号左右两边各加一个空格括号前面是否需要加空格分号前不加空格 缩进各种分级语句 大括号对于if、else以及for循环等其他语句大括号左括号的位置二级目录 变量名、函数名变量名函数名在类unix系统下编程 注释哪些地方需要注释函数内…

【数据结构】栈「介绍+完整代码+调试」

1.栈 1.1栈的概念及结构 栈&#xff1a;一种特殊的线性表&#xff0c;其只允许在固定的一端进行插入和删除元素操作。进行数据插入和删除操作的一端 称为栈顶&#xff0c;另一端称为栈底。栈中的数据元素遵守后进先出LIFO&#xff08;Last In First Out&#xff09;的原则。压…

潮乎新年盲盒H5版本可易支付对接

添加图片注释&#xff0c;不超过 140 字&#xff08;可选&#xff09; 潮乎新年盲盒H5版本可易支付对接 前端三十行和三十一行改成你域名百度网盘

毕设(二)——NB-IOT通信模块(nb卡通信测试)+gps定位

文章目录 一、关于接线2月1日记录2月4日记录 二、网络连接测试三、HTTP通信3.1 网络调试3.2 nb-lot的连接测试 一、关于接线 如果pico的供电能力不行&#xff0c;可能会直接用4.2V的锂电池对右下引脚进行供电 这个模块只支持nb卡&#xff0c;我哭死&#xff0c;20块钱&#xff…

第二件事 在Java 虚拟机 (JVM)跑一个程序

上篇文章写了 在 WINDOWS上 创建了一个 JVM&#xff0c; 好&#xff01; 现在在这个 Java 虚拟计算机系统上跑一个Java语言编写的小程序&#xff1b; 题目&#xff1a; 用Java语言 编写一个小程序 在Console界面 打印 整数 1-10 (回头了一下源程序&#xff0c;靠&#xff0c;应…

行人重识别综述

Deep Learning for Person Re-identification: A Survey and Outlook 论文地址https://arxiv.org/pdf/2001.04193 1. 摘要 we categorize it into the closed-world and open-world settings. closed-world&#xff1a;学术环境下 open-world &#xff1a;实际应用场景下 2…