- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我对 Nodejs 很陌生,但正在尝试一些新的 chatgpt 东西。
我有一些代码可以获取一个主题并生成一个笑话。这是使用 https://api.openai.com/v1/chat/completions
我可以看到流返回并给出每个部分,但客户端未正确获取流。
客户端上的 console.log({done, value});
仅被命中两次,但调试服务器时的流具有更多的 block 。
// the value decoded here is '{}'
home-page.tsx:46 {done: false, value: Uint8Array(2)}
home-page.tsx:46 {done: true, value: undefined}
要从服务器正确连接此流,我缺少什么?
import { createParser, ParsedEvent, ReconnectInterval } from "eventsource-parser";
export const config = {
runtime: "edge",
};
export async function OpenAIStream(payload) {
const encoder = new TextEncoder();
const decoder = new TextDecoder();
let counter = 0;
const res = await fetch("https://api.openai.com/v1/chat/completions", {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${process.env.OPENAI_API_KEY}`,
},
method: "POST",
body: JSON.stringify(payload),
});
const stream = new ReadableStream({
async start(controller) {
function onParse(event: ParsedEvent | ReconnectInterval) {
if (event.type === "event") {
const data = event.data;
if (data === "[DONE]") {
controller.close();
return;
}
try {
const json = JSON.parse(data);
const text = json.choices[0].delta?.content || "";
if (counter < 2 && (text.match(/\n/) || []).length) {
return;
}
console.log(text);
const queue = encoder.encode(text);
controller.enqueue(queue);
counter++;
} catch (e) {
controller.error(e);
}
}
}
// stream response (SSE) from OpenAI may be fragmented into multiple chunks
// this ensures we properly read chunks & invoke an event for each SSE event stream
const parser = createParser(onParse);
// https://web.dev/streams/#asynchronous-iteration
for await (const chunk of res.body as any) {
parser.feed(decoder.decode(chunk));
}
},
});
return stream;
}
import { Body, Controller, Post } from '@nestjs/common';
import { AppService } from './app.service';
import { OpenAIStream } from './helpers/openai';
import { ChatCompletionRequestMessage } from 'openai';
const MAX_RESPONSE_TOKENS = 200;//1024;
@Controller()
export class AppController {
constructor(private readonly appService: AppService) { }
@Post("joke")
async generate(@Body() message: JokeTemplate) {
let messages: Array<ChatCompletionRequestMessage> = [
{ "role": "system", "content": "You are a joke engine." },
{ "role": "user", "content": `Tell me a joke about ${message.subject}` }]
const payload = {
model: 'gpt-3.5-turbo',
max_tokens: MAX_RESPONSE_TOKENS,
temperature: 0,
messages,
stream: true
};
const stream = await OpenAIStream(payload);
return new Response(stream);
}
}
interface JokeTemplate {
subject: string;
}
const triggerGPTRequest = async (e: any) => {
setGptResponse('');
setLoading(true);
const response = await fetch("/api/joke", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({ 'subject': promptText }),
});
if (!response.ok) {
throw new Error(response.statusText);
}
const data = response.body;
if (!data) {
return;
}
const reader = data.getReader();
const decoder = new TextDecoder();
let done = false;
while (!done) {
const {value, done: doneReading} = await reader.read();
done = doneReading;
const chunkValue = decoder.decode(value);
console.log({done, value});
setGptResponse((prev) => prev + chunkValue);
}
setLoading(false);
}
最佳答案
Nest 不知道 fetch 的 Response
类型,它只是将该类型视为一个类,因此它尝试序列化它,这会导致错误。尝试返回一个 StreamableFile
实例,Nest 将通过调用 stream.pipe(res)
正确处理该实例。
import { Body, Controller, Post, StreamableFile } from '@nestjs/common';
import { AppService } from './app.service';
import { OpenAIStream } from './helpers/openai';
import { ChatCompletionRequestMessage } from 'openai';
const MAX_RESPONSE_TOKENS = 200;//1024;
@Controller()
export class AppController {
constructor(private readonly appService: AppService) { }
@Post("joke")
async generate(@Body() message: JokeTemplate) {
let messages: Array<ChatCompletionRequestMessage> = [
{ "role": "system", "content": "You are a joke engine." },
{ "role": "user", "content": `Tell me a joke about ${message.subject}` }]
const payload = {
model: 'gpt-3.5-turbo',
max_tokens: MAX_RESPONSE_TOKENS,
temperature: 0,
messages,
stream: true
};
const stream = await OpenAIStream(payload);
return new StreamableFile(stream)
}
}
interface JokeTemplate {
subject: string;
}
关于node.js - 通过 chatGpt api 流从 NextJs (express) 返回 ReadableStream,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/76582684/
这个问题在这里已经有了答案: Why filter() after flatMap() is "not completely" lazy in Java streams? (8 个答案) 关闭 6
我正在创建一个应用程序来从 Instagram 收集数据。我正在寻找像 Twitter 流 API 这样的流 API,这样我就可以自动实时收集数据而无需发送请求。 Instagram 有类似的 API
我正在使用 Apache Commons 在 Google App Engine 中上传一个 .docx 文件,如此链接中所述 File upload servlet .上传时,我还想使用 Apach
我尝试使用 DynamoDB 流和 AWS 提供的 Java DynamoDB 流 Kinesis 适配器捕获 DynamoDB 表更改。我正在 Scala 应用程序中使用 AWS Java 开发工具
我目前有一个采用 H.264 编码的 IP 摄像机流式视频 (RTSP)。 我想使用 FFmpeg 将此 H.264 编码流转换为另一个 RTSP 流,但 MPEG-2 编码。我该怎么做?我应该使用哪
Redis 流是否受益于集群模式?假设您有 10 个流,它们是分布在整个集群中还是都分布在同一节点上?我计划使用 Redis 流来实现真正的高吞吐量(200 万条消息/秒),所以我担心这种规模的 Re
这件事困扰了我一段时间。 所以我有一个 Product 类,它有一个 Image 列表(该列表可能为空)。 我想做 product.getImages().stream().filter(...) 但
是否可以使用 具有持久存储的 Redis 流 还是流仅限于内存数据? 我知道可以将 Redis 与核心数据结构的持久存储一起使用,但我已经能够理解是否也可以使用 Redis 中的流的持久存储。 最佳答
我开始学习 Elixir 并遇到了一个我无法轻松解决的挑战。 我正在尝试创建一个函数,该函数接受一个 Enumerable.t 并返回另一个 Enumerable.t ,其中包含下 n 个项目。它与
我试图从 readLine 调用创建一个无限的字符串流: import java.io.{BufferedReader, InputStreamReader} val in = new Buffere
你能帮我使用 Java 8 流 API 编写以下代码吗? SuperUser superUser = db.getSuperUser; for (final Client client : super
我正在尝试服用补品routeguide tutorial,并将客户端变成rocket服务器。我只是接受响应并将gRPC转换为字符串。 service RouteGuide { rpc GetF
流程代码可以是run here. 使用 flow,我有一个函数,它接受一个键值对对象并获取它的值 - 它获取的值应该是字符串、数字或 bool 值。 type ValueType = string
如果我有一个函数返回一个包含数据库信息的对象或一个空对象,如下所示: getThingFromDB: async function(id:string):Promise{ const from
我正在尝试使用javascript api和FB.ui将ogg音频文件发布到流中, 但是我不知道该怎么做。 这是我给FB.ui的电话: FB.ui( { method: '
我正在尝试删除工作区(或克隆它以使其看起来像父工作区,但我似乎两者都做不到)。但是,当我尝试时,我收到此消息:无法删除工作区 test_workspace,因为它有一个非空的默认组。 据我所知,这意味
可以使用 Stream|Map 来完成此操作,这样我就不需要将结果放入外部 HashMap 中,而是使用 .collect(Collectors.toMap(...)); 收集结果? Map rep
当我们从集合列表中获取 Stream 时,幕后到底发生了什么?我发现很多博客都说Stream不存储任何数据。如果这是真的,请考虑代码片段: List list = new ArrayList(); l
我对流及其工作方式不熟悉,我正在尝试获取列表中添加的特定对象的出现次数。 我找到了一种使用Collections来做到这一点的方法。其过程如下: for (int i = 0; i p.conten
我希望将一个 map 列表转换为另一个分组的 map 列表。 所以我有以下 map 列表 - List [{ "accId":"1", "accName":"TestAcc1", "accNumber
我是一名优秀的程序员,十分优秀!