【JS】获取接口返回 EventStream 结构的数据（即接收读取 stream 流）

最新推荐文章于 2025-03-19 10:43:15 发布
最新推荐文章于 2025-03-19 10:43:15 发布
阅读量7.4k 收藏 20
点赞数 8
分类专栏： 工作随记 文章标签： javascript 开发语言 ecmascript stream EventStream
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45677671/article/details/137687784
版权
本文介绍了如何使用EventStream数据格式进行服务器端实时数据传输，通过fetch接口发送请求并解析返回的可读流，展示了`parseMultiJson`函数在处理接收到的多段数据中的应用。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

文章目录

EventStream 是一种服务器推送的数据格式，可以用于实时数据传输。

  • 接口返回的示例图
    在这里插入图片描述

  • 获取示例：

// 这里的 url 为虚拟的，仅供演示用
fetch(`https://test.cn.com/api/agent/2`, {
   
        method: 'POST',
        headers: {
   
          'Content-Type': 'application/json',
        },
        mode: 'cors',
        credentials: 'include',
        body:
最低0.47元/天 解锁文章
数据爬取遇到EventStream是个什么东西？EventSource与websocket有何区别？Java后台如何获取爬取数据并入库？EventStream后台服务怎么写？
无极低码
02-28 7356
好久没更新了，今天办完房子装修手续，有点空咱们更新一下。 今天更新的内容是以前工作中采集数据的时候遇到的，目前我遇到的通过EventSource方式给前端提供数据的方式比较少，只见过这一种但是这种方式感觉还是有很多优势。 我们开始之前先看一下这几个问题。 数据爬取遇到EventStream是个什么东西？ 在一次采集数据的过程中遇到这样一幕，一般我们的请求都是http，请求结束以后就释放连接，耗时也很低，大部分我们很容易发现调用的接口就直接获取数据了，但是我在本次采集中没有找到相关的数据接口，这就有些纳
fetch获取text/event-stream数据并处理
m0_74114605的博客
04-10 4677
【代码】fetch获取text/event-stream数据并处理。
vue处理接口返回EventStream数据并进行展示
zuo-yiran的博客
03-15 600
使用EventSource对接口返回的EventStream数据进行处理并展示
【 vue3 + js 】流式访问访问接口，结果以流文本形式返回
最新发布
m0_65041204的博客
03-19 383
流式访问访问接口，结果以流文本形式返回，实时获取返回内容并展示。
axios接收接口返回的流数据并动态打印
qq_25741071的博客
04-13 2250
在使用 axios 接收接口返回的流数据并动态打印时，可以使用。GET 请求更改为 POST 请求，只需要将请求方法从。函数将流数据逐个打印到控制台。如果出现错误，会执行。正在为您搜索：上面代码、get请求、post请求。属性将响应类型设置为流数据。正在为您搜索：axios、接收、接口、返回。方法，如果流数据传输完成，会执行。同时，将参数对象传递给。在代码中，创建了一个。
EventStream：一个实时数据流处理库
gitblog_01008的博客
08-13 1927
EventStream：一个实时数据流处理库 项目地址:https://gitcode.com/gh_mirrors/ev/event-stream 1. 项目介绍 EventStream 是一个用于 Node.js 的库，它提供了一种处理实时数据流（例如从服务器到客户端的事件）的方式。它支持 HTTP Server-Sent Events (SSE) 和 WebSocket 协议，使得开发者能够...
EventStream：Node.js流处理的强大工具
gitblog_01284的博客
10-18 472
EventStream：Node.js流处理的强大工具 event-stream EventStream is like functional programming meets IO 项目地址: https://gitcode....
JS API 接口接收与返回
10-11
JS API 接口接收与返回 是一个轻型的、安全的、跨网际的、跨语言的、跨平台的、跨环境的、跨域的、支持复杂对象传输的、支持引用参数传递的、支持内容输出重定向的、支持分级错误处理的、支持会话的、面向服务的高性能远程过程调用协议。 该版本直接解压后就可以使用，其中 属于公共文件。不论是客户端还是服务器端都需要这些文件。 是客户端文件，如果你只需要使用客户端，那么只要有上面那些公共文件和这个文件就可以使用了，使用时，直接在你的程序中包含 phprpc_client.php 就可以，公共文件不需要单独包含。 这三个文件是服务器端需要的文件。 其中 dhparams 目录中包含的是加密传输时用来生成密钥的参数 dhparams.php 是用来读取 dhparams 目录中文件的类。 phprpc_server.php 是服务器端，如果你要使用 PHP 来发布 PHPRPC 服务，只需要包含这个文件就可以了。公共文件和 dhparams.php 都不需要单独包含。 PHP 4.3+、PHP 5、PHP 6 客户端要求开启 socket 扩展。 服务器端需要有 IIS、Apache、lighttpd 等可以运行 PHP 程序的 Web 服务器。 如果服务器端需要加密传输的能力，必须要保证 session 配置正确。 <?php include('php/phprpc_server.php'); //加载文件 function hello($name) { return'Hello ' . $name; } $server = new PHPRPC_Server(); //创建服务端 $server->add(array('hello', 'md5', 'sha1')); //数组形式一次注册多个函数 $server->add('trim'); //单一注册 $server->start(); //开启服务 ?> <?php include ("php/phprpc_client.php"); //加载文件 $client = new PHPRPC_Client('http://127.0.0.1/server.php'); //创建客户端 并连接服务端文件 echo$client->Hello("word"); //调用方法 返回 hello word ?> -------------------------------------------------- --------------------------------------------------- ------------------------------ 服务端其他说明: <?php include('php/phprpc_server.php'); //加载文件 function hello($name) { return'Hello ' . $name; } class Example1 { staticfunction foo() { return'foo'; } function bar() { return'bar'; } } $server = new PHPRPC_Server(); //创建服务端 $server->add('foo', 'Example1'); //静态方法直接调用 $server->add('bar', new Example1()); //非静态方法 需要实例化 //注册别名调用 $server->add('hello', NULL, 'hi'); //第三参数是函数的别名 客户端通过别名来调用函数 $server->add('foo', 'Example1', 'ex1_foo'); $server->add('bar', new Example1(), 'ex1_bar'); $server->setCharset('UTF-8'); //设置编码 $server->setDebugMode(true); //打印错误 $server->setEnableGZIP(true); //启动压缩输出虽然可以让传输的数据量减少，但是它会占用更多的内存和 CPU，因此它默认是关闭的。 $server->start(); //开启服务 ?> -------------------------------------------------- --------------------------------------------------- --------------------------- 客户端其他说明: <?php include ("php/phprpc_client.php"); $client = new PHPRPC_Client(); $client->useService('http://127.0.0.1/server.php'); //远程调用地址 $client->setKeyLength(1000); //密钥长度 $client->setEncryptMode(3); //加密等级0-3 $client->setCharset('UTF-8'); //设置编码 $client->setTimeout(10); //设置超时时间 echo$client->hi('PHPRPC'), "\r\n"; //调用函数 echo$client->getKeyLength(), "\r\n"; //下面是返回值 echo$client->getEncryptMode(), "\r\n"; echo$client->getCharset(), "\r\n"; echo$client->getTimeout(), "\r\n"; ?> -------------------------------------------------- --------------------------------------------------- ---------------------- 关于session <?php include('php/phprpc_server.php'); class ExampleCounter { function ExampleCounter() { if (!isset($_SESSION['count'])) { $_SESSION['count'] = 0; } } function inc() { $_SESSION['count'] += 1; } functioncount() { return$_SESSION['count']; } } $server = new PHPRPC_Server(); $server->add(array('inc', 'count'), new ExampleCounter()); $server->start(); ?> <?php include("php/phprpc_client.php"); $client = newPHPRPC_Client(); $client->useService('http://127.0.0.1/1.php'); $client->setTimeout(10); echo $client->inc(); echo $client->count(); echo $client->inc(); echo $client->count(); ?> 每次刷新都是新建的client 服务端并不能识别.
获取第三方接口的EventStream返回给前端，SpringBoot+Vue+WebFlux+SseEmitter
qq_39356111的博客
01-04 5437
1.原本是bodyToFlux(String.class)，结果没有返回也没有报错，排查了许久，最终改成bodyToFlux(byte[].class)最近项目有个需求，获取第三方gpt接口提供的AI聊天服务，回显给前端，其实就是http请求第三方接口并拿到EventStream流，推送给前端。其中msg绑定的是聊天窗口的机器人答复，目前代码并不完善，在eroor是并未断开连接，等解决了再编辑。
简述js接收读取GPT的stream流的两种方法：EventSource与Fetch
GEEK
06-21 3596
精心调试+亲测的js接收读取stream流的两种方法：EventSource与Fetch，供大家参考。可用于对接GPT等一些AI接口，从而在页面像打字一样输出内容。//执行完成的页面逻辑。//执行错误的页面逻辑。//执行完成的页面逻辑。//逐条解析后端返回数据。
VUE_SSE_js接收读取stream流
分享程序相关知识
05-08 4272
在网络请求中，流(stream)表示持续接收数据的过程，SSE （Server-Sent Events），服务器使用流信息向浏览器推送信息，能够实时地在客户端更新数据而无需刷新页面。不用等待整个响应完成后一次性获取。SSE它基于 HTTP 协议，目前除了 IE/Edge，其他浏览器都支持。使用SSE是在用vue对接智谱.AI的时候，对接智谱.AI使用HTTP调用，调用方式选择sse-invoke : SSE 调用的时候才能实现打字机效果，加强用户体验，缩短用户等待时间。还可以实现天气预报推送等功能。
event-stream: 用于Node.js的流处理库
gitblog_00065的博客
03-14 1165
event-stream: 用于Node.js的流处理库 event-streamEventStream is like functional programming meets IO项目地址:https://gitcode.com/gh_mirrors/ev/event-stream 简介 是一个用于Node.js的流处理库，它提供了一系列有用的功能，如并行处理、合并流、缓冲等。 应用场景 e...
获取JavaScript异步函数的返回值
11-28
今天研究一个小问题： 怎么拿到JavaScript异步函数的返回值？ 1.错误尝试 当年未入行时，我的最初尝试： [removed] function getSomething() { var r = 0; setTimeout(function() { r = 2; }, 10); return r; } function compute() { var x = getSomething(); alert(x * 2); } compute(); [removed] 2.回调函数 弹出的不是4，而是0，后来知道这是异步的问题， 要用回调技术来做： [removed] func
ajax请求后台接口数据与返回值处理js的实例讲解
10-18
今天小编就为大家分享一篇ajax请求后台接口数据与返回值处理js的实例讲解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
Node.js(5)-node的数据流(Stream接口)
m0_65729457的博客
11-20 396
node的数据流(Stream接口)
Axios获取后端返回的二进制数据流并下载下来
蓝色之恋love的博客
08-27 2850
Axios.post(url, {/*传入的参数*/}, { responseType: 'blob'} /*设置返回值的类型，这里设置文件流blob的形式*/) .then(res => { let blob = new Blob([res.data], { type: 'application/xlsx;charset=utf-8'/*application/xlsx // 这里写要下载的文件格式;charset=utf-8*/ });
事件和流（Streams）
疯狂假前端的博客
09-18 611
事件和流是 Node.js 中强大的功能。事件驱动模型允许你处理异步操作和事件，而流式处理使得处理大数据和高效的数据传输变得更加简单和灵活。掌握事件发射器和各种流的使用，将使你能够构建更高效、更具扩展性的 Node.js 应用程序。
SSE(Server-Sent Events)及JS 的 EventSource、 text/event-stream MIME 类型介绍
carcarrot的博客
03-06 250
服务器推送事件，简称 SSE，是一种服务端实时主动向浏览器推送消息的技术。服务端与浏览器端的通信协议（HTTP协议）浏览器端可供 JavaScript 使用的对象。从“服务端主动向浏览器实时推送消息”这一点来看，该 API 与 WebSockets API 有一些相似之处。基于HTTP 协议基于TCP 协议单工，只能服务端单向发送消息全双工，可以同时发送和接收消息轻量级，使用简单相对复杂内置断线重连和消息追踪的功能不在协议范围内，需手动实现。
js获取后台传回的数值
kathiegoodlucky的博客
10-20 5879
js获取后台传回的数值 方法1：js可以通过 [[${变量名}]] 直接获取 例如： var fieddid = [[${myChecked}]]; 方法2：在页面设置隐藏输入框，获取后台的值，再通过$("#id").val()来获取 例如： //HTML的部分 <input type="hidden" value="${student.name}" id="stuName"/> //JavaScript的部分 var stuName = $('#stuName').val()
springboot返回eventStream
04-01
Spring Boot可以使用SSE（Server-Sent Events）技术返回事件流，SSE是一种基于HTTP协议的服务器向客户端推送事件的技术。 下面是一个使用Spring Boot返回事件流的示例： 1. 创建一个简单的Spring Boot应用程序。 2. 创建一个控制器类，使用`@GetMapping`注解将事件流映射到一个URL上。 ```java @RestController public class EventController { @GetMapping("/events") public Flux<String> getEvents() { return Flux.interval(Duration.ofSeconds(1)) .map(sequence -> "Event " + sequence); } } ``` 3. 在`getEvents()`方法中，使用`Flux.interval()`方法创建一个每秒钟生成一个事件的无限序列。在这个例子中，每秒钟生成一个事件，事件的内容是字符串`"Event "`加上一个自增的序号。 4. 将`Flux`对象返回给客户端，客户端会自动接收到事件流。 5. 在客户端使用JavaScript代码订阅事件流： ```javascript const eventSource = new EventSource("/events"); eventSource.onmessage = function(event) { console.log(event.data); }; ``` 6. 运行Spring Boot应用程序，并在浏览器中打开`http://localhost:8080/events`，可以看到控制台输出每秒钟生成的事件。 这样就可以使用Spring Boot返回事件流了。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

一颗不甘坠落的流星

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值