eventSource请求

来,先上图    ,这样chatGPT一样的持续输出数据的是怎么做呢

 他不是后端全部一次性返回来的,也不是轮询请求的,跟websocket很像,但是又有区别!让我们一探究竟...

1.eventSource的介绍

1)eventSource 是一个 Web API,它允许网页通过 HTTP 长连接(通常称为 Server-Sent Events (SSE))从 Web 服务器接收自动更新。它使网页可以接收实时更新,而无需刷新页面或向服务器发送重复请求。

2)使用 eventSource,网页可以订阅从服务器发送的事件流。这些事件可以是任何格式,例如纯文本、JSON 或 XML,并且可以包含服务器想要发送的任何数据。一旦建立连接,服务器可以随时向客户端发送事件,客户端可以根据需要处理它们,例如更新 UI 或触发其他操作。

3)eventSource API 使用简单,并且受到大多数现代 Web 浏览器的支持。它通常用于需要实时更新的 Web 应用程序,例如聊天室、社交媒体提要或股票市场行情。

看我上面巴巴一大堆没看明白吧!

听阳哥一句话总结:简单明了一句话,普通get、post请求完毕后端返回数据前后端通信就自动挂断,但是这个  eventSource请求这个东西  前端请求一次不会挂断,后端可以持续输出数据。

2.eventSource和websocket的区别:

1)协议不同:WebSocket 使用的是一种双向通信协议,而 eventSource 使用的是一种单向通信协议。WebSocket 协议可以在客户端和服务器之间建立一个长连接,双方可以同时发送和接收消息,而 eventSource 只能由服务器向客户端发送消息。

2)数据格式不同:WebSocket 可以发送任何格式的数据,例如文本、二进制数据或 JSON,而 eventSource 只能发送文本格式的数据。

3)支持程度不同:WebSocket 是一种相对较新的技术,在一些旧的浏览器或网络环境下可能不被支持,而 eventSource 已经被广泛支持,可以在大多数现代浏览器中使用。

4)应用场景不同:WebSocket 更适合那些需要实时双向通信的应用,例如在线游戏或视频会议,而 eventSource 更适合那些需要从服务器获取实时信息的应用,例如股票行情或新闻推送。

听阳哥一句话总结: websocket  请求一次 前后端可以互相通话传送数据,eventSource请求一次,只能后端给前端传数据

话不多说,上代码...

EventSource对象只能发送GET请求,不能发送POST请求。- 服务器端发送的数据必须是纯文本格式,不能是二进制数据

//1.创建EventSource对象  url请求地址
var source = new EventSource(url);
/*2.监听事件EventSource对象有三个事件:onopen:连接建立时触发。
onmessage:接收到服务器端发送的数据时触发。
onerror:连接出错时触发。可以通过以下方式监听事件*/source.onopen = function(event) {  // 连接建立时触发};
source.onmessage = function(event) {  // 接收到服务器端发送的数据时触发,在这里作你想做的事情};
source.onerror = function(event) {  // 连接出错时触发};

你个臭写代码的。。。。。还想要post请求的.......你咋不上天呢!👇向下看

如何用post的方式请求eventSource

npm i --save @rangermauve/fetch-event-sourceimport { fetchEventSource } from '@microsoft/fetch-event-source';let eventSource = fetchEventSource(Url, {method: 'POST',headers: {"Content-Type": 'application/json',},body: JSON.stringify(data),onmessage(event) {console.info(event.data);},onerror() {}})

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Move Dev Meetup杭州线下交流会圆满结束

北京时间6月17日下午2点到6点,由MoveFuns DAO 、MoveBit、ComingChat、杭州时戳微蓝信息咨询有限公司和WEB3CN联合举办的Move开发者线下交流会圆满结束。本次交流会吸引了110余名Move开发者报名,其中超过60位参会者成功来到现场参与了线下交流。 第一位分…

亚马逊跨境电商可靠吗?2023年还可以做吗?

新的一年新的打算,不少小伙伴在问,亚马逊跨境电商可靠吗?2023年还可以做亚马逊跨境电商吗?为此我们小编就来简单说说自己的想法吧! 亚马逊跨境电商可靠吗? 【回答】:首先我们需要肯定一点的是&…

个人跨境电商要多少钱?新手怎么做跨境电商?

近几年,随着跨境电商的迅速发展,所以很多人都跃跃欲试,想开始从事跨境电商行业,但是想要加入跨境行业的话,我们就得需要先提前了解清楚个人做跨境电商需要多少钱,今天就给大家讲一下个人做跨境电商所需的花…

【01】如何在电脑上使用wink一键高清短视频

如何在电脑上使用wink一键高清优化短视频画质 文章目录 如何在电脑上使用wink一键高清优化短视频画质1.软件简介1.1痛点1.2解决方案 2.实际操作2.1准备工作2.1.1下载雷电模拟器2.1.2下载wink 2.2.安装软件2.2.1安装雷电模拟器2.2.2安装wink2.2.2.1在雷电模拟器中安装wink2.2.2.…

Python语言翻译包translate,支持翻译多语种

一、前言 在python中,有个多语种翻译包,可以将各种语言进行翻译转换,例如英语转中文,韩语转中文,日语转韩语等,这个包便是translate,而且使用方便,翻译准确率还可以! 二…

元宇宙技术、应用与发展趋势

日前,元宇宙产业大会2023春季会在江苏昆山成功举办,大会主题为“抢抓元宇宙新赛道-重新定义互联网”。会上,国内外院士专家、元宇宙头部企业等嘉宾齐聚一堂,共同探讨元宇宙技术、应用与发展趋势、以及如何认识元宇宙与数字经济的关…

欧盟立法者签署公开信,近万人联名“暂停高级AI研发”

来源丨CoinTelegraph 编辑丨liuruiWeb3CN.Pro ChatGPT 曾经的势头有多猛烈如今就被行业大佬抵制的就有多严重。 近日,十几位欧盟 (EU) 政客签署了“暂停高级AI研发”的公开信,呼吁 AI (人工智能)的“安全”发展,特斯拉…

QT 鼠标移到按钮上,就弹出对话框,移开,对话框就消失

我们在做项目的时候,有一个这样的需求,就是一个按钮,鼠标放上去之后,就会弹出一张图片,鼠标移开,图片就消失。 比如这样的按钮, 鼠标放上去之后,就会弹出对话框 该怎么做呢&#xf…

如何通过Google学术快速获取参考文献引用格式-2021年

通过Google学术快速获取参考文献引用格式 首先,利用浏览器(最好是Google浏览器)打开Google学术,下面是链接: https://scholar.google.com/ 若是没有fan-qiang的话可以百度搜索Google学术镜像来使用Google学术。 然…

LaTeX 使用 bib 管理参考文献时,引用网络资源 URL 导致排版难看的问题

是在今天写工作报告的时候,需要引用参考文献,以前的工作报告都没有用过参考文献,所以现学了的,稍稍总结一下: 我是通过在文章最后添加下面命令添加参考文献的,其中文献引用风格文件 chinesebst2005_UTF8.bs…

LaTex 参考文献不显示,出现问号

参考文献不显示这件事太让人崩溃了,而且我还竟然经常遇到这种问题,幸运的是终于找到解决办法啦!!!特别简单 使用快捷键F6,F8,F6,F6就可以了 快捷键被其他占用,可以直接去点击按钮。 看完记得点赞&#xf…

解决Latex中参考文献没有引用却依然在出现的问题

工具: bib文件、bibtex和TeXStudio 正常情况下,如果在文章中删除了对某篇文献的引用,那么它即使存在于bib文件中,也不会在论文中显示出来。但是在使用中可能会遇到这样的问题:参考文献没有引用却依然在出现。 解决方…

Texstudio参考文献出现问号怎么办

先把文献写进去,然后点工具->清理辅助文件,然后编译一次,点工具->参考文献,最后再编译两遍。

Latex的\cite后面的参考文献显示问号 [?]

我用的是texlive2017-20170524光盘映像文件安装的TeXworks.模板使用的是IEEE trans。每次编译时都是选择的用pdfLaTeX编译,但是这样在参考文献处会出错。 当我需要在文中插入参考文献时,按照网上的方法,创建bib文件,然后在latex中…

Endnote引用中文、英文参考文献方法(不用手敲中文文献信息)

目录 引用英文参考文献 插入中文参考文献格式 导入出错的解决方案 引用英文参考文献 打开知网的官网,选择想要导出成endnote格式的文献(在文献前面打√,即为选中状态),在导出与分析-导出文献-endnote,即…

LaTeX参考文献引用显示?问号解决办法!!!!

在使用Latex之前,我们一般会借用已有的论文模板,在模板基础上加入我们自己的文章内容,随后编译成PDF文件,其基本流程就是:Latex->Bibtex->Latext->Latex。 1、第一步点击Latex编译,可以获得*.aux…

endnote的参考文献没有journal信息的解决【实测成功】

仅作为记录,大佬请跳过。 修改endnote的endnote import,将%B改为%J即可。 文章目录 步骤endnote中:Edit——Import Filters——Open Filter Manager——找到Endnote Import——Edit——templates——journal article——修改成%J 参考 步骤 …

#华为推送# 电商应用如何提高用户购买率?推送服务助您一臂之力,现在接入更有专人为您解决技术问题

新用户留存率、复购率低? 如何提高用户活跃和留存? 缺乏有效触达用户的渠道? 如何精准触达用户? …… 在电商行业高速发展过程中,APP运营无法避免上述问题。 结合华为推送功能,我们希望与您分享电商推送方案…

跨境电商如何充分利用 WhatsApp提供优质客户服务?

关键词:跨境电商客服、WhatsApp客服 WhatsApp在国外相当于我们的WeChat——全球用户都用它来发送和接收来自朋友、家人和同事的消息,用户基数非常庞大。WhatsApp每月有20 亿活跃用户,因此可以访问大量受众。 这些优势使很多跨境电商卖家对它…

微信聊天记录导出

本文将介绍如何将微信聊天记录导出为结构化数据 所需材料 一部已经root的安卓手机带GPU的Linux电脑 整体流程如下: 数据库文件提取 使用RE管理器,在已经root的安卓手机上,找到如下文件:/data/data/com.tencent.mm/MicroMsg/[…