streaming request api
Unanswered
Parson Russell Terrier posted this in #help-forum
Parson Russell TerrierOP
I'm trying to make a api route that will return to page and streaming the values
have here a sample code
export async function POST(req: Request) {
const { text } = await req.json()
const chain = new RemoteRunnable({
url:
});
const result = await chain.stream({
text: text,
});
console.log("result", result)
const stream = result;
return new Response(stream.getReader(), {
headers: {
"Content-Type": "text/event-stream",
Connection: "keep-alive",
"Cache-Control": "no-cache, no-transform",
},
});
}
have here a sample code
export async function POST(req: Request) {
const { text } = await req.json()
const chain = new RemoteRunnable({
url:
https://cloudrun-langserve-testworld-g3jhehd6ca-uc.a.run.app/pirate-speak,});
const result = await chain.stream({
text: text,
});
console.log("result", result)
const stream = result;
return new Response(stream.getReader(), {
headers: {
"Content-Type": "text/event-stream",
Connection: "keep-alive",
"Cache-Control": "no-cache, no-transform",
},
});
}
10 Replies
Parson Russell TerrierOP
and here from the frontend
const response = await fetch('/api/call_piratespeak_api', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ text: user_input, })
})
const reader = response.body.getReader();
const chunks = [];
while (true) {
const { done, value } = await reader.read();
if (done) {
break;
}
console.log(value.content)
chunks.push(value);
}
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ text: user_input, })
})
const reader = response.body.getReader();
const chunks = [];
while (true) {
const { done, value } = await reader.read();
if (done) {
break;
}
console.log(value.content)
chunks.push(value);
}
I want to get the value.content to update text from front end
as in something like: https://nextjs.org/docs/app/building-your-application/routing/route-handlers#streaming? (second code block for not ai related)
Parson Russell TerrierOP
yeah but myu problem was frontend I'm not getting the content
so, you want to get then one by one and add it to a useState or something and not have all the data at once?
Parson Russell TerrierOP
yes I want them to add one by one to a usestate
that why from api I will return stream.getReader(), but im not sure if thats the correct way
Parson Russell TerrierOP
any?
@Parson Russell Terrier any?
i havent tried, but can you have a look at this promising repo: https://github.com/jherr/generic-streaming