客户端接收 text/event-stream

html

<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>Event Stream Demo</title>

		<style type="text/css">

			body {

				font-family: Arial, sans-serif;

				text-align: center;

			}

			#event-stream-data {

				margin: 50px auto;

				max-width: 600px;

				border: 1px solid #ccc;

				padding: 10px;

			}

		</style>

	</head>

	<body>

		<div id="event-stream-data"></div>

		<script>

			const eventStreamDataElement = document.getElementById('event-stream-data');

			function handleEventStreamMessage(event) {

				console.log(event)

				const eventText = event.data;

				displayEvent(eventText);

			}

			function displayEvent(eventText) {

				const eventElement = document.createElement('p');

				eventElement.textContent = eventText;

				eventStreamDataElement.appendChild(eventElement);

			}

			function connectToEventStream() {

				fetch('http://localhost:8004/website/events', {

						method: 'POST',

						headers: {

							'Content-Type': 'application/json'

						},

						body: JSON.stringify({

							data: 'example'

						}) // Replace with your POST data

					})

					.then(response => {

						const reader = response.body.getReader();

						const decoder = new TextDecoder();

						return reader.read().then(function processResult(result) {

							console.log(result)

							if (result.done) {

								return;

							}

							const chunk = decoder.decode(result.value, {

								stream: true

							});

							handleEventStreamMessage({

								data: chunk

							});

							return reader.read().then(processResult);

						});

					})

					.catch(error => {

						console.error('Error occurred while fetching event stream:', error);

					});

			}

			connectToEventStream();

		</script>

	</body>

</html>

服务端发送（springboot）

    @PostMapping(value = "/events", produces = MediaType.TEXT_EVENT_STREAM_VALUE)

    public SseEmitter eventStream(@RequestBody Object obj) {

        SseEmitter emitter = new SseEmitter();

        System.out.println(obj.toString());

        ScheduledExecutorService executorService = Executors.newScheduledThreadPool(1);

        executorService.scheduleAtFixedRate(() -> {

            try {

                // 模拟产生一条事件数据

                String eventData = "Event data: " + System.currentTimeMillis();

                emitter.send(SseEmitter.event().data(eventData));

            } catch (IOException e) {

                emitter.complete();

            }

        }, 0, 1, TimeUnit.SECONDS);

        return emitter;

    }

text/event-stream协议的更多相关文章

  1. [Reactive Programming] Using an event stream of double clicks -- buffer()

    See a practical example of reactive programming in JavaScript and the DOM. Learn how to detect doubl ...

  2. [html5] 学习笔记-服务器推送事件

    1.HTML5服务器推送事件介绍 服务器推送事件(Server-sent Events)是Html5规范的一个组成部分,可以用来从服务端实时推送数据到浏览器端. 传统的服务器推送技术----WebSo ...

  3. 《Web性能权威指南》

    <Web性能权威指南> 基本信息 原书名:High performance browser networking 原出版社: O'Reilly Media 作者: (加)Ilya Grig ...

  4. Web性能权威指南 PDF扫描版​

    Web性能权威指南是谷歌公司高性能团队核心成员的权威之作,堪称实战经验与规范解读完美结合的产物.<Web性能权威指南>目标是涵盖Web开发者技术体系中应该掌握的所有网络及性能优化知识.全书 ...

  5. HTTP协议开发应用-HTTP&XML协议栈开发

    Netty HTTP+XML协议栈开发 由于HTTP协议的通用性,很多异构系统间的通信交互采用HTTP协议,通过HTTP协议承载业务数据进行消息交互,例如非常流行的HTTP+XML或者RESTful+ ...

  6. 多点触摸(MT)协议（翻译）

    参考: http://www.kernel.org/doc/Documentation/input/multi-touch-protocol.txt 转自:http://www.arm9home.ne ...

  7. 内核中的多点触摸协议文档 Multi【转】

    转自:http://www.arm9home.net/read.php?tid=24754 前段时间改写了一个GT801的内核驱动,仔细阅读 MT Event 上报的时候,发现这个驱动是针对 Andr ...

  8. Stream computing

    stream data 从广义上说,所有大数据的生成均可以看作是一连串发生的离散事件.这些离散的事件以时间轴为维度进行观看就形成了一条条事件流/数据流.不同于传统的离线数据,流数据是指由数千个数据源持 ...

  9. zz:NETCONF协议详解

    随着SDN的大热,一个诞生了十年之久的协议焕发了第二春,它就是NETCONF协议.如果你在两年前去搜索NETCONF协议,基本得到的信息都是"这个协议是一个网管协议,主要目的是弥补SNMP协 ...

  10. XMPP即时通讯协议使用（十二）——基于xmpp搭建简单的局域网WebRTC

    创建HTML和JS ofwebrtc.html <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...

随机推荐

  1. C++ 运算符全解析：从基础概念到实际应用

    C++ 运算符 运算符用于对变量和值执行操作. 在下面的示例中,我们使用 + 运算符将两个值相加: int x = 100 + 50; 虽然 + 运算符经常用于将两个值相加,就像上面的示例一样,但它也 ...

  2. 掌握 Spring IoC 容器与 Bean 作用域：详解 singleton 与 prototype 的使用与配置

    在您的应用程序中,由 Spring IoC 容器管理的形成其核心的对象被称为 "bean".一个 bean 是由 Spring IoC 容器实例化.组装和管理的对象 这些 bean ...

  3. MogDB 使用样本数据集Mogila

    MogDB 使用样本数据集 Mogila MogDB 提供了一个样本数据集 Mogila,本数据集借鉴了适用于 MySQL 的Sakila 示例数据库.Sakila最初由 MySQL AB 文档团队的 ...

  4. 一种新的姿势：程序try/catch抛出异常之绕过canary pwn121

    一种新的姿势:程序try/catch抛出异常之绕过canary 我前面发了不少关于绕过canary的姿势,先总结一下,现在绕过canary的姿势有泄露,爆破,格式化字符串绕过,多线程劫持TLS绕过, ...

  5. redis 简单整理——redis shell[九]

    前言 简单介绍一下redis的shell命令. 正文 redis 提供了一些工具,如redis-cli.redis-server.redis-benchmark等. redis-cli -r 对red ...

  6. Python阿里云消息推送调用API

    很多公司测试APP推送时候,应该也是很头疼:推送环境:测试.正式,稍不注意就把测试的push到正式上,导致所有用户都收到 例子很多: 其实阿里.极光都有推送Api,直接调用API就ok,特别是有的公司 ...

  7. Spring JDBCTemplet通用RowMapper帮助类

    1 import java.lang.reflect.Method; 2 import java.math.BigDecimal; 3 import java.math.BigInteger; 4 i ...

  8. 阿里云 EMAS Serverless 重磅发布

    简介: EMAS Serverless 是阿里云提供的基于Serverless技术的一站式后端开发平台,为开发者提供高可用.弹性伸缩的云开发服务,包含云函数.云数据库.云存储.静态网站托管等功能,可用 ...

  9. 全面提升易用性：OpenClusterManagement 0.7 版本发布

    ​简介:千呼万唤始出来,三月末 OpenClusterManagement 社区正式发布了 v0.7 版本.在新的版本有一系列新的功能特性欢迎感兴趣的读者体验探索,同时在这个版本中社区维护者对目前已有 ...

  10. 汽车之家基于 Flink 的数据传输平台的设计与实践

    简介: 数据接入与传输作为打通数据系统与业务系统的一道桥梁,是数据系统与架构中不可或缺的一个重要部分.数据传输系统稳定性和准确性,直接影响整个数据系统服务的 SLA 和质量.此外如何提升系统的易用性, ...