HTTP头中的Content-Type: text/event-stream；是什么鬼？

最新推荐文章于 2024-02-25 16:17:57 发布
最新推荐文章于 2024-02-25 16:17:57 发布
阅读量1w 收藏 5
点赞数 2
分类专栏： 网络协议 前端 文章标签： nuxt http
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_21859119/article/details/111563786
版权

1、最近在研究nuxt.js。网上找了个vue的项目，改造为nuxt.js架构的SSR程序
在首页直出的时候，发现一个/webpack_hmr/client请求。如图：在这里插入图片描述
在这里插入图片描述
webpack热更新需要向浏览器推送信息，一般都会想到websocket，但是还有一种方式，叫做Server-Sent Events（简称SSE）。

SSE是websocket的一种轻型替代方案。

和websocket有以下几点不同：

  • SSE是使用http协议，而websocket是一种单独的协议
  • SSE是单向传输，只能服务端向客户端推送，websocket是双向
  • SSE支持断点续传，websocket需要自己实现
  • SSE支持发送自定义类型消息

参考资料：
https://segmentfault.com/a/1190000020628924
http://www.ruanyifeng.com/blog/2017/05/server-sent_events.html
https://github.com/easy-team/egg-vue-webpack-boilerplate
https://zhuanlan.zhihu.com/p/30623057

黑面狐 sa~
关注
  • 2
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
大模型时代：利用Event Stream技术革新Web应用响应速度
qq_44103359的博客
05-24 485
Event Stream技术是一种允许服务器向客户端推送实时数据的技术。与传统的客户端定期轮询服务器以获取数据的方式不同，Event Stream技术允许服务器在有新数据可用时立即向客户端推送数据。这种技术通常基于HTTP/2协议，通过持久连接实现数据的实时推送。
【JS】获取接口返回 EventStream 结构的数据（即接收读取 stream 流）
最新发布
qq_45677671的博客
04-12 2483
前端获取接口返回 EventStream 结构的数据（即接收读取 stream 流）
重新审视SSE服务器发送事件：ChatGPT流式输出效果
漫漫前端路，进一寸有进一寸的欢喜
02-25 1240
服务端发送事件（SSE）技术早在很久以前就已存在，但其在实际应用场景中并不十分常见。随着ChatGPT的出现，SSE技术得到了重新关注并被广泛应用于实现流式输出。本文将介绍SSE技术的使用
header(‘Content-Type: text/event-stream‘)；是干什么的？底层原理是什么？
长风破浪会有时的博客
07-04 3409
需要注意的是，SSE是一种单向通信协议，只允许服务器向客户端推送数据，而不支持客户端向服务器发送请求。因此，SSE适用于需要服务器主动向客户端推送实时数据的场景，如实时通知、实时数据更新等。响应头告诉浏览器使用SSE的协议来解析响应，并按照SSE规范处理收到的事件数据。浏览器会将每个事件分解为适当的事件对象，从而能够对其进行处理和展示。响应头的HTTP响应时，它会将响应解析为SSE流。，这是用于Server-Sent Events（SSE）的规定内容类型。是用于设置HTTP响应头的一行代码。
text/event-stream
liuzhenghua66的博客
10-07 5017
GPT火了之后，一种新的Http MediaType慢慢火了起来，它就是。这几种类型本质上都是客户端与服务端打开了一个长连接，服务端可以多次写入一部分数据给客户端，客户端可以多次读取，直到全部读取完成。由于ChatGPT的特性，如果需要生成的token较多，等它全部生成完成将消耗较多的时间，但是如果你将它生成过程中的数据源源不断地展示给用户，那么用户端的体验也不会差（类似于在线播放视频，不需要把整个视频下载完成才能播放）支持服务端分多次往客户端写内容。
iOS- "unacceptable content-type: text/plain"等content-type bug解决方案
极客学伟的技术分享社区
03-03 7676
经常在使用AFN的时候会出现content-type错误,缺少请求类型,比如”unacceptable content-type: text/plain” 解决方法: 1.在网络请求代码处修改AFHTTPSessionManager *mgr = [AFHTTPSessionManager manager]; mgr.responseSerializer = [AFHTTPRespons
Android 接收 text/event-stream 数据
Android_yh的博客
02-20 1511
text/event-stream 数据解析
2-8：Http响应头content-type内容详解
崔凯洋的博客
08-26 680
常见content-type的取值，响应头再也不怕填什么了，这真的是葵花宝典。
Excel导出 POI 响应头设置 Content-Type: application/vnd.ms-excel 异常解决方法
热门推荐
weixin_liutao的博客
07-16 2万+
先看看报的异常，大概意思是没有转换器。内含内含预设的内容类型’application/vnd.ms-excel;charset=UTF-8’] Resolved [org.springframework.http.converter.HttpMessageNotWritableException: No converter for [class java.util.LinkedHashMap] with preset Content-Type 'application/vnd.ms-excel;charse
django-eventstream:Django的服务器发送事件
04-29
Django EventStream EventStream为您的Django应用程序提供API终结点，可以将数据推送到连接的客户端。 数据使用服务器发送事件协议...Content-Type: text/event-stream event: message data: {"foo": "bar"} event:
sse-example:SSE 和 EventSource 的快速而肮脏的例子
06-27
'Content-Type': 'text/event-stream', 'Cache-Control': 'no-cache', 'Connection': 'keep-alive' }); // 发送实时更新 setInterval(() => { res.write(`data: {"time": "${new Date().toISOString()}"}\n\...
hyper-tokio-sse-example:超级v0.11.27服务器发送事件示例
05-01
在这个示例中，我们创建了一个名为`sse`的路由，当接收到GET请求时，它会返回一个带有`Content-Type: text/event-stream`的响应。然后，我们使用Tokio的`spawn`函数启动一个新任务，该任务周期性地发送SSE事件到...
go-gin-web-server：在渲染上部署Go Gin
02-05
在Gin中，可以通过设置HTTP响应头`Content-Type: text/event-stream`并以特定格式发送数据来实现SSE。 **Realtime Messaging** 是Go Gin Web Server的一个关键特性，它利用了SSE来实现实时通信。通过这种技术，...
html5-comet-EventSource--node.js-example:node.js实现html5原生comet(长连接)例子
07-14
3. **设置Content-Type**：为了让浏览器知道我们正在发送的是Server-Sent Events，我们需要在响应头中设置`Content-Type: text/event-stream`。 4. **发送数据**：每当服务器有新数据要推送时，使用`res.write(data...
HTML创建邮件模板（手写 和 拖拽）
如果我年少有为不自卑
05-30 2万+
1、手写： 查看邮箱里的邮件，拿到里面的模板代码去修改：
原生JS实现下拉刷新
如果我年少有为不自卑
12-11 1万+
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8"> <title>Document</title> <title>Pull to Refresh</title> <meta name="viewport" content="width=device-width,height=device-
360*640是什么设备的分辨率？
如果我年少有为不自卑
12-07 1万+
作者：孙明然 链接：https://www.zhihu.com/question/48243257/answer/196101102 来源：知乎 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。这个问题比较复杂，我们先解释320*480，320*568，375*667，414*736这几个分辨率。解释前，引入个概念：设备像素比 devicePixelRatio，window
axios post 接收响应格式为text/event-stream
05-26
如果你想要使用axios发送POST请求并接收响应格式为text/event-stream，可以使用axios的`responseType`配置项来设置响应类型。具体操作如下： ```javascript axios.post(url, data, { headers: { 'Content-Type': 'application/json', 'Accept': 'text/event-stream' }, responseType: 'text' }).then(response => { // 处理响应 }).catch(error => { // 处理错误 }); ``` 上面的代码中，我们在请求头中设置了`Content-Type`为`application/json`，表示我们要发送JSON格式的数据。同时，也设置了`Accept`为`text/event-stream`，表示我们希望接收的响应格式为text/event-stream。最后，我们设置了`responseType`为`text`，表示希望将响应数据作为字符串接收。这样就可以使用axios发送POST请求并接收响应格式为text/event-stream了。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值