服务器发送事件：express使用SSE实现消息推送

已于 2022-08-17 18:18:35 修改
阅读量1.2k 收藏 1
点赞数 2
分类专栏： 前端 Node.js 文章标签： javascript 前端 ajax
于 2022-07-23 17:54:21 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43930421/article/details/125950023
版权
本文探讨了如何避免使用定时器实现实时信息获取的缺点，转向使用服务器发送事件（SSE）进行服务器主动推送。SSE是一种基于HTTP协议的轻量级解决方案，适合单向推送需求，如未读消息通知。文中通过示例代码介绍了如何在Express应用中集成SSE。
摘要由CSDN通过智能技术生成

前言

最开始学习 ajax 的时候，为了实时获取最新信息（比如未读消息），通过定时器 setInterval 不断调用 API 。

这样做虽然可以实现效果，但是这种方法并不能判断后端是否有新的消息产生，只能通过客户端不断请求，浪费带宽和服务器资源。

最好的方法是在服务端生产新消息后，推送到客户端，也就是服务器主动推送。

实现

目前主流的服务端推送技术要算 web socket，它可以实现客户端和服务端的双向通信。

但是如果仅仅只是需要实现类似于“未读消息”这样的服务器单向推送需求，那 SSE 或许是个更好的解决方案。

服务器发送事件（Server-Sent Events，简称SSE），基于 HTTP 协议。它是通过发送流信息（streaming）来变通的实现服务器主动推送，类似于视频播放，目前在IE浏览器上还不适用。

sse.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title></title>
		
	</head>
	<body style="padding<
最低0.47元/天 解锁文章
林梓阳
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
express 使用SSE轮询
小妖666个人笔记
01-03 1448
SSE是客户端请求服务器后，服务器每隔一段时间向客户端发送数据（是单向的）。 详细可参照：http://www.ruanyifeng.com/blog/2017/05/server-sent_events.html SSE 的本质 严格地说，HTTP 协议无法做到服务器主动推送信息。但是，有一种变通方法，就是服务器向客户端声明，接下来要发送的是流信息（streaming）。 也就是说，发送的不是一次性的数据包，而是一个数据流，会连续不断地发送过来。这时，客户端不会关闭连接，会一直等着服务器发过来的新
WEB通讯技术。前端实现SSE长连接，nodejs+express搭建简单服务器，进行接口调试，通过curl请求数据
阿牛哥的博客
04-21 9560
WEB通讯技术。前端实现SSE长连接，nodejs+express搭建简单服务器，进行接口调试，通过curl请求数据
SSE（Server-Send-Event）服务端推送数据技术
最新发布
pig_boss的博客
07-11 1229
服务端与客户端建立Socket连接进行数据传输，Socket的传输方式是全双工的。WebSocket是基于 TCP 的长连接，和HTTP 协议相比，它能实现轻量级的、低延迟的数据传输，非常适合实时通信场景，主要用于交互性强的双向通信。客户端通过频繁请求向服务端请求数据，达到类似实时更新的效果。轮询的优点是实现简单，但是会给服务端和网络带来额外的压力，且延迟较高。实现效果如下：服务端不断推送数据到前端，前端可以也可以调用接口主动关闭连接。适用场景：SSE由于是服务端单向通讯，所以适合那种需要单向持久的连接。
NodeJS Express 中创建html5的server-sent event服务端
w470543882的专栏
05-20 785
router.get('/ServerSent', function(req, res, next) {   res.setHeader('Content-Type', 'text/event-stream');   res.setHeader('Cache-Control', 'no-cache');   res.end("data: The server time is"+new D
服务器发送的事件
04-27 236
介绍 订阅流： EventSource对象 从服务器发送事件 发送message事件 发送custom事件 以retry间隔管理重新连接 使用id字段设置唯一标识符 处理事件 处理错误 浏览器实现差异 浏览器支持和后备策略 想象一下，您所在国家的国家篮球队正在参加世界篮球锦标赛。 您想跟踪游戏，但是您不能观看它，因为它发生在您工作时。 对您来说幸运的是，您的国家新闻机构有...
express-eventstream:服务器发送的Express事件
04-30
Express EventStream 一个用于轻松创建将事件流传输到客户端的Web端点的库。 这些端点表示 ，因此可以使用在Web浏览器中轻松使用。 该库支持 ，这意味着它可以与或一起使用，以方便扩展。 例子 -每秒在“时钟”通道上发布“时间”事件，并通过Web UI显示连接状态，连接日志和事件日志。 入门 如果在本地使用图钉，请记住通过将aco参数添加到路由配置文件来启用“自动跨站” 使用可选的GRIP配置创建events对象 // server.js const expressEventStream = require('express-eventstream') const grip = process.env.GRIP_URL // e.g. 'http://localhost:5561?key=changeme' const events = expressEventS
【node-express-sse】Server Sent Event 单向推送消息，实现站内信功能
daddykei的博客
01-02 658
Sever Sent Event 消息推送，实现日志信息的推送完成站内信功能。
使用sse服务推送消息案例代码
11-19
4. **JavaScript实现**：在客户端，我们需要使用JavaScript创建一个EventSource对象，连接到服务器的SSE端点，并监听`message`事件来接收和处理推送的消息。例如： ```javascript var source = new EventSource('...
表达：ExpreSSE：一个更好的模块，用于处理Express中的服务器发送的事件
02-05
使用服务器发送的事件，服务器可以通过将消息推送到网页来随时将新数据发送到网页。 -一对一（服务器到1个客户端） -一对多（服务器到n个客户端） —对sseHub() Redis支持—（ n个服务器到n个客户端） 注意：// ...
http 服务器 推消息,HTTP 服务器消息推送之SSE
weixin_39603217的博客
08-03 374
HTTP 服务器推送也称 HTTP 流，是一种客户端-服务器通信模式，它将信息从 HTTP 服务器异步推送到客户端，而无需客户端请求。现在的 web 和 app 中，越来越多的场景使用这种通信模式，比如实时的消息提醒，IM在线聊天，多人文档协作等。以前实现这种类似的功能一般都是用ajax长轮询，而现在我们有了新的、更优雅的选择 —— WebSocket 和 SSE。WebSocket是HTML5开...
express-eventsource:ExpressJS的服务器发送事件中间件
05-20
Express EventSource 这个快速模块创建了一个简单的服务器发送的事件室。 安装 $ npm install express-eventsource 例子 var express = require ( 'express' ) ; var eventsource = require ( 'express-eventsource' ) ; var sse = eventsource ( { connections : 2 } ) ; var broadcast = sse . sender ( 'foo' ) ; var app = express ( ) . use ( sse . middleware ( ) ) . listen ( 3000 ) ; setInterval ( function ( ) { broadcast ( { bar : 'b
sse-server:这是一个简单的node.js sse服务器
03-26
sse服务器 这是一个简单的node.js sse服务器
sse java8_HTTP 服务器消息推送之SSE
weixin_32506617的博客
02-22 624
HTTP 服务器推送也称 HTTP 流，是一种客户端-服务器通信模式，它将信息从 HTTP 服务器异步推送到客户端，而无需客户端请求。现在的 web 和 app 中，越来越多的场景使用这种通信模式，比如实时的消息提醒，IM在线聊天，多人文档协作等。以前实现这种类似的功能一般都是用ajax长轮询，而现在我们有了新的、更优雅的选择 —— WebSocket 和 SSE。WebSocket是HTML5开...
前端通信-服务端发送事件: SSE（Server-Sent Events）
pk142536的博客
05-15 2578
前端通信-服务端推送方案 server-send events
express使用socket.io 服务端推送消息的几种方式
前端阿皓
10-12 1179
const express = require('express'); const http = require('http'); const socketio = require('socket.io'); const server = http.createServer(express()); const io = socketio(server); // 使用默认nsp '/' ,io.on等效于io.of('/')； io.of('/').on('connection', (socket) =&
19.服务器发送事件Server-Sent Events
qq_43966202的博客
01-13 368
Server-Sent Events
服务器发送事件Server-sent events详解与示例
风如也的博客
09-04 3416
Server-Sent-Events（SSE）是一种HTML5 API，用于在服务器和客户端之间实时推送数据流。 SSE可以用于实现实时通知、实时聊天、实时数据更新和实时监控等功能。
如何通过Express和React处理SSE
奇舞周刊
10-11 664
本文作者为360奇舞团前端开发工程师最近AIGC技术的大热，市面上也出现了许多类似生产的AI工具，其中有一大特色就是对话的输出结果是类似真人的打字效果出现，要呈现出这种效果，最主要的就是要利用SSE技术（Server-Sent Events是一种基于HTTP长连接的“服务器推”技术，其特点在于建立更长时间的连接以等待后续数据的传输。具体来说，当客户端请求），下面我就通过一个案例，使用Express...
NoteExpress2.0使用指南：自动化管理与推送题录
对于那些从事深度研究工作的人来说，NoteExpress无疑是一个值得信赖的助手，能够将原本繁琐的文献管理工作转化为简单易行的步骤，让研究者可以专注于核心的创新性工作，实现“Hard research, Easy work！”的目标。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值