接触 EventStream

这两天OpenAI让ChatGPT可以免登录使用,然后就想着是否可以免费使用ChatGPT的接口来调用大模型了。根据他持续接收后端数据的行为,起初以为是通过websocket实现,打开Chrome看了下请求,惊呆了,发现他是通过一个POST请求就能持续接收文字数据,Chrome控制台有一个EventStream的Tab,十分好奇,现在就来初步了解下EventStream。

EventStream

EventStream是一种用于在Web应用程序中实现服务器向客户端推送事件的协议。它建立在HTTP之上,并通过在HTTP响应中使用特殊的Content-Type(text/event-stream)和一些预定义的字段来传输事件数据。EventStream允许服务器向客户端持续发送事件数据,而无需客户端发起新的请求。

EventStream协议的特点包括:

  1. 文本格式 :事件以纯文本形式发送,每个事件由一个或多个字段组成,以\n作为分隔符。
  2. 单向传输:通常是服务器向客户端发送事件,客户端通常不会向服务器发送数据。
  3. 持续连接:客户端通过HTTP长连接(Keep-Alive)与服务器建立连接,使得服务器可以在任何时候向客户端发送事件。
  4. 事件类型:每个事件可以有一个可选的事件类型(event),用于标识事件的类型。
  5. 数据字段:每个事件可以包含一个数据字段(data),用于携带事件的具体数据。
  6. 注释字段:事件流中可以包含注释字段(以冒号开头),用于传递一些额外的信息,但客户端通常会忽略它们。

一个简单的EventStream事件如下所示:

makefile 复制代码
event: message
data: Hello, world!

这表示一个类型为"message"的事件,其数据为"Hello, world!"。

EventStream协议本身并不是一种独立的网络协议,而是建立在HTTP之上的一种通信协议,用于实现服务器向客户端推送事件的功能。

ChatGPT这里POST请求是通过HTTP协议发送的,并且事件流的响应也是通过HTTP协议发送的,只是在响应头中指定了Content-Typetext/event-stream,表明这是一个事件流的响应。

值得一提的是ChatGPT发送的POST请求,Content-Type是application/json, 但是Accept是text/event-stream, 我猜是服务器宽松处理,实现灵活地处理逻辑。

服务器如何响应EventStream

以nodejs为例,以下是一个简单的例子:

javascript 复制代码
const http = require('http');

http.createServer((req, res) => {
  res.writeHead(200, {
    'Content-Type': 'text/event-stream',
    'Cache-Control': 'no-cache',
    'Connection': 'keep-alive'
  });

  // 发送事件
  setInterval(() => {
    res.write(`data: ${JSON.stringify({ message: 'Event message' })}\n\n`);
  }, 1000);
}).listen(3000);

console.log('Server running at http://localhost:3000/');

总结

通过EventStream,我们可以在无需发起websocket的情况下持续从服务器接收数据,可用于服务器端不能立即响应所有数据的场景,例如web终端的命令执行,就可以使用event-stream持续显示服务器端命令行的执行情况。

后续再研究下能否通过服务器免费调用chatgpt接口

相关推荐
多则惑少则明33 分钟前
Vue开发系列——自定义组件开发
前端·javascript·vue.js
用户2506949216141 分钟前
next框架打包.next文件夹部署
前端
程序猿小蒜43 分钟前
基于springboot的校园社团信息管理系统开发与设计
java·前端·spring boot·后端·spring
一叶难遮天43 分钟前
开启RN之旅——前端基础
前端·javascript·promise·js基础·es6/ts·npm/nrm
申阳44 分钟前
Day 4:02. 基于Nuxt开发博客项目-整合 Inspira UI
前端·后端·程序员
程序猿_极客1 小时前
【期末网页设计作业】HTML+CSS+JavaScript 猫咪主题网站开发(附源码与效果演示)
前端·css·html·课程设计·网页设计作业
IT古董1 小时前
【前端】从零开始搭建现代前端框架:React 19、Vite、Tailwind CSS、ShadCN UI 完整实战教程-第1章:项目概述与技术栈介绍
前端·react.js·前端框架
有点笨的蛋1 小时前
从零搭建小程序首页:新手也能看懂的结构解析与实战指南
前端·微信小程序
爱宇阳1 小时前
Vue3 前端项目 Docker 容器化部署教程
前端·docker·容器
Irene19911 小时前
前端缓存技术和使用场景
前端·缓存