全网最全vue2技术栈实现AI问答机器人功能（流式与非流式两种接口方法）

补充日志:（我最开始是使用非流式接口实现的，后续业务改造使用流式接口，重点的代码讲解都在下边哈~~）

1. 关于打印机效果后端同样可以实现的逻辑说明:(2024/4/11)

打印机效果使用前端的框架实现时,其实颇有局限,而且逻辑有点复杂,可以百度的也不是很多,最好是交给后端通同学来做,方案是后端控制接口请求的请求头content-type为text/event-stream;这是SSE热更新方案,相当于建立了一个长连接,前端再对该event事件流返回的数据进行判断和监听处理;简单理解就是可以实现后端一直给前端同学返回数据,我们再进行拼接即可,这样可以直接实现打印机效果啦,

2. 补丁上述使用流式接口实现打印机效果讲解:(2024/5/10)

详见下方代码以及讲解！(2-1)

3. 补充实退出时对会话进行保存(下次进入可以看到之前的对话):(2024/6/7)

详见下方代码以及讲解！(3-1)

1.与AI问答机器人对话模型效果展示

1-1：（含）提示词问答对话效果

1-2：停止生成对话效果展示

1-3：打字机延迟效果展示

1-4：整体布局样式效果预览

2-1.重点代码描述与解析（以下为前端对于流式接口的功能实现）

打印机效果使用了流式接口，其中我遇到的比较糟心的问题是
1.什么是流式？怎么使用，我该选择哪一种？如何实现获取流？
答：
(1)流式就是一次链接 服务器可以一直给你发请求，可以主动中断请求也可等待请求完毕 ，其实就是一个长连接 相当于你打开门后 有人一直在给你递苹果（数量不一定多少）
(2)一般来说 ，使用流式，用的都是厂商的api,开放给我们使用，一般都是post请求，由于原生的eventSource 构造函数 只支持get请求 且不可有请求体，一般对于ai问答需要传参的情况，我们不会使用eventSource构造函数，那么剩下的就是模拟信息流