Spring AI (二) 流式响应

7.流式响应

Spring AI中流式对话接口采用的是Spring WebFlux异步网络框架实现的.

调用客户端chatClient 的stream() 方法得到 Flux 类型流式对象

stream() 方法通常在流式处理的场景下被使用，尤其是在实时通信、大文件传输、或者需要逐步接收大量数据的情况下。在与阿里云通义千问的交互中，stream() 方法允许你以流式的方式接收模型的回复，这对于长文本生成、对话响应等需要逐步展示结果的场景特别有用。

7.1.简单案例

后台代码

produces = "text/event-stream" produces声明为文本事件流, 也可以设置成 produces = MediaType.TEXT_EVENT_STREAM_VALUE

    @GetMapping(value = "/chat/forStream", produces = MediaType.TEXT_EVENT_STREAM_VALUE)public Flux<ChatResponse> forStream(@RequestParam(value = "message", defaultValue = "宫保鸡丁的制作方法")String message) {// 创建Prompt对象，用于发起聊天请求Prompt prompt = new Prompt(new UserMessage(message));// 向聊天客户端发送消息，启动流式聊天会话return chatClient.stream(prompt);}

前端

基于 HTTP 的 Server-Sent Events（SSE）实现, 结合 SSE 和 Flux 向前端流式输出

目前大模型的流式响应接口所采用的技术主要是两种：WebSocket和SSE。这两种方式都支持服务端主动向客户端发送内容，其中，

Websocket是一种双向通信协议，可以在一个连接上进行双向通信，即：客户端可以向服务端发送信息，服务端也可以主动向客户端发送信息。

而SSE是基于标准的Http协议实现的，是一种单向信道，即：只支持服务端向客户端发送数据。

一般我们主要是通过EventSource事件源来监听并获取服务端的消息。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<a href="index.html">返回</a> <br>
<div id="chat"></div>
<hr>
<textarea id="msg">如何玩五子棋</textarea>
<button id="btn" onclick="send()">发送</button></body>
<script>function send() {let msg = document.getElementById('msg').value;var source = new EventSource("http://localhost:8080/chat/forStream?message=" + msg);source.onmessage = function(event) {document.getElementById('chat').innerText = JSON.parse(event.data).result.output.content;};}
</script>
</html>