🧐[问题]onChatEnd拿不到回调信息

[mengxz0203]

🧐 问题描述

我按照文档里的尝试使用onChatEnd自定义结束后的回调，但是我拿不到输出的值，这是为什么呢
还有个问题，我尝试在流式返回结束后使用proChatRef.setMessage设置最后一次响应的消息也没有成功，这是为什么呢

💻 示例代码

<ProChat
key={randomKey}
chatRef={proChatRef}
showTitle={true}
userMeta={{
avatar: props?.userinfo?.user.picture,
title: props?.userinfo?.user.nickname,
}}
assistantMeta={{
avatar: 'https://cdn-tos-cn.bytedance.net/obj/archi/tob/infinite/giraffe_fe/img/favicon.ico',
title: 'Giraffe AI Bot',
}}
helloMessage={
你好, ${props?.userinfo?.user.nickname}, 今天能帮你做些什么？
}
inputAreaProps={{
style: {
border: '1px solid #1890ff',
color: 'rgb(38,64,15)',
fontWeight: 800,
},
}}
onChatStart={(chat) => {
console.log('chat start', chat);
}}
onChatEnd={(id, type) => {
console.log('chat end', id);
console.log('chat end type', type);
}}
onChatGenerate={(chunkText) => {
console.log('chat generate', chunkText);
}}
request={
async (messages, config, signal) => {
console.log(messages)
setGenerating(true)
messages.unshift({ createAt: 0, extra: undefined, id: '', updateAt: 0, role: 'system', content: '使用RobotFramework标准库和EasyUILib编写WebUI自动化脚本，注意代码缩进等格式要正确。'})
const response = await fetch('http://10.86.82.210:11434/api/chat', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
'model': 'Giraffe-2024-08-07_2',
// "mode": "code",
'messages': messages,
}),
});
// 确保服务器响应是成功的
if (!response.ok || !response.body) {
throw new Error(HTTP error! status: ${response.status});
}

            // 获取 reader
            const reader = response.body.getReader();
            const decoder = new TextDecoder('utf-8');
            const encoder = new TextEncoder();

            const readableStream = new ReadableStream({
              async start(controller) {
                function push() {
                  reader
                    .read()
                    .then(({ done, value }) => {
                      if (done) {
                        if (!proChatRef.current) return;
                        const messages = proChatRef.current.getChatMessages();
                        const { id, content } = messages[1] || {};
                        proChatRef.current.scrollToBottom?.();
                        if (!id) return;
                        proChatRef.current.setMessageContent(id, 'content', '12345');
                        setRandomKey(new Date().getTime().toString())
                        setGenerating(false)
                        controller.close();
                        return;
                      }
                      const chunk = decoder.decode(value, { stream: true });
                      // console.log('原始数据:', chunk);

                      // 按行分割数据
                      const messages = chunk.split('\n').filter(line => line.trim() !== '');

                      messages.forEach(message => {
                        try {
                          const parsed = JSON.parse(message);
                          // console.log('解析结果:', parsed);
                          controller.enqueue(encoder.encode(parsed.message.content));
                        } catch (error) {
                          console.error('JSON 解析错误:', error);
                        }
                      });

                      push();
                    })
                    .catch((err) => {
                      console.error('读取流中的数据时发生错误', err);
                      controller.error(err);
                    });
                }

                push();
              },
            });
            return new Response(readableStream); // 返回可读流
          }
        }

      />

🚑 其他信息