JS实现chatgpt数据流式回复效果

前端小小白zyw

已于 2024-03-07 10:47:50 修改

阅读量2.2k

点赞数 15

CC 4.0 BY-SA版权

分类专栏： Javascript Html / CSS Vue 文章标签： javascript 开发语言 chatgpt

于 2024-03-07 10:17:39 首次发布

本文链接：https://blog.youkuaiyun.com/Vue2018/article/details/136525436

本文介绍了如何在前端使用fetch和reader实现从后端流式获取ChatGPT的回复，并处理Markdown格式。同时，也提到了使用EventSource替代fetch的场景以及如何借助marked.js和highlight.js进行Markdown文本的渲染。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近高了一个简单chatgpt对话功功能，回复时希望流式回复，而不是直接显示结果，其实很简单，前端流式读取即可，后端SSE实现流式传输

前端用到fetch获取数据，然后利用reader读取

let requestId  = parseInt(Math.random() * 1000000000)  // 创建提问ID，用于停止生成
let keyWord = 'xxx' // 问题
let resp = await fetch(`http://10.0.192.84:11015/SYSmartGPTActor/V1.0/sse?keyWord=${
     keyWord}&requestId=${
     requestId}`, {
   
    method: 'get',