【新增】AI:流式发送消息的微调,统一成单接口
This commit is contained in:
parent
83b9332125
commit
4d3c5ef7c1
@ -31,19 +31,16 @@ export const ChatMessageApi = {
|
|||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
||||||
// 发送 add 消息
|
|
||||||
add: async (data: ChatMessageSendVO) => {
|
|
||||||
return await request.post({ url: `/ai/chat/message/add`, data })
|
|
||||||
},
|
|
||||||
|
|
||||||
// 发送 send 消息
|
|
||||||
send: async (data: ChatMessageSendVO) => {
|
|
||||||
return await request.post({ url: `/ai/chat/message/send`, data })
|
|
||||||
},
|
|
||||||
|
|
||||||
// 发送 send stream 消息
|
// 发送 send stream 消息
|
||||||
// TODO axios 可以么? https://apifox.com/apiskills/how-to-create-axios-stream/
|
// TODO axios 可以么? https://apifox.com/apiskills/how-to-create-axios-stream/
|
||||||
sendStream: async (id: string, ctrl, onMessage, onError, onClose) => {
|
sendStream: async (
|
||||||
|
conversationId: number,
|
||||||
|
content: string,
|
||||||
|
ctrl,
|
||||||
|
onMessage,
|
||||||
|
onError,
|
||||||
|
onClose
|
||||||
|
) => {
|
||||||
const token = getAccessToken()
|
const token = getAccessToken()
|
||||||
return fetchEventSource(`${config.base_url}/ai/chat/message/send-stream`, {
|
return fetchEventSource(`${config.base_url}/ai/chat/message/send-stream`, {
|
||||||
method: 'post',
|
method: 'post',
|
||||||
@ -53,7 +50,8 @@ export const ChatMessageApi = {
|
|||||||
},
|
},
|
||||||
openWhenHidden: true,
|
openWhenHidden: true,
|
||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
id: id
|
conversationId,
|
||||||
|
content
|
||||||
}),
|
}),
|
||||||
onmessage: onMessage,
|
onmessage: onMessage,
|
||||||
onerror: onError,
|
onerror: onError,
|
||||||
|
@ -90,6 +90,7 @@
|
|||||||
<div class="message-container" ref="messageContainer">
|
<div class="message-container" ref="messageContainer">
|
||||||
<div class="chat-list" v-for="(item, index) in list" :key="index">
|
<div class="chat-list" v-for="(item, index) in list" :key="index">
|
||||||
<!-- 靠左 message -->
|
<!-- 靠左 message -->
|
||||||
|
<!-- TODO 芋艿:类型判断 -->
|
||||||
<div class="left-message message-item" v-if="item.type === 'system'">
|
<div class="left-message message-item" v-if="item.type === 'system'">
|
||||||
<div class="avatar">
|
<div class="avatar">
|
||||||
<el-avatar
|
<el-avatar
|
||||||
@ -297,24 +298,28 @@ const onSend = async () => {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
const content = prompt.value?.trim()
|
const content = prompt.value?.trim()
|
||||||
if (content?.length < 2) {
|
if (content.length < 2) {
|
||||||
ElMessage({
|
ElMessage({
|
||||||
message: '请输入内容!',
|
message: '请输入内容!',
|
||||||
type: 'error'
|
type: 'error'
|
||||||
})
|
})
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
// TODO 芋艿:这块交互要在优化;应该是先插入到 UI 界面,里面会有当前的消息,和正在思考中;之后发起请求;
|
||||||
// 清空输入框
|
// 清空输入框
|
||||||
prompt.value = ''
|
prompt.value = ''
|
||||||
const requestParams = {
|
// const requestParams = {
|
||||||
|
// conversationId: conversationId.value,
|
||||||
|
// content: content
|
||||||
|
// } as unknown as ChatMessageSendVO
|
||||||
|
// // 添加 message
|
||||||
|
const userMessage = {
|
||||||
conversationId: conversationId.value,
|
conversationId: conversationId.value,
|
||||||
content: content
|
content: content
|
||||||
} as unknown as ChatMessageSendVO
|
}
|
||||||
// 添加 message
|
// list.value.push(userMessage)
|
||||||
const userMessage = (await ChatMessageApi.add(requestParams)) as unknown as ChatMessageVO
|
// // 滚动到住下面
|
||||||
list.value.push(userMessage)
|
// scrollToBottom()
|
||||||
// 滚动到住下面
|
|
||||||
scrollToBottom()
|
|
||||||
// stream
|
// stream
|
||||||
await doSendStream(userMessage)
|
await doSendStream(userMessage)
|
||||||
//
|
//
|
||||||
@ -330,13 +335,15 @@ const doSendStream = async (userMessage: ChatMessageVO) => {
|
|||||||
let isFirstMessage = true
|
let isFirstMessage = true
|
||||||
let content = ''
|
let content = ''
|
||||||
ChatMessageApi.sendStream(
|
ChatMessageApi.sendStream(
|
||||||
userMessage.id,
|
userMessage.conversationId, // TODO 芋艿:这里可能要在优化;
|
||||||
|
userMessage.content,
|
||||||
conversationInAbortController.value,
|
conversationInAbortController.value,
|
||||||
(message) => {
|
(message) => {
|
||||||
console.log('message', message)
|
console.log('message', message)
|
||||||
const data = JSON.parse(message.data) as unknown as ChatMessageVO
|
const data = JSON.parse(message.data) // TODO 芋艿:类型处理;
|
||||||
|
// debugger
|
||||||
// 如果没有内容结束链接
|
// 如果没有内容结束链接
|
||||||
if (data.content === '') {
|
if (data.receive.content === '') {
|
||||||
// 标记对话结束
|
// 标记对话结束
|
||||||
conversationInProgress.value = false
|
conversationInProgress.value = false
|
||||||
// 结束 stream 对话
|
// 结束 stream 对话
|
||||||
@ -345,9 +352,12 @@ const doSendStream = async (userMessage: ChatMessageVO) => {
|
|||||||
// 首次返回需要添加一个 message 到页面,后面的都是更新
|
// 首次返回需要添加一个 message 到页面,后面的都是更新
|
||||||
if (isFirstMessage) {
|
if (isFirstMessage) {
|
||||||
isFirstMessage = false
|
isFirstMessage = false
|
||||||
list.value.push(data)
|
// debugger
|
||||||
|
list.value.push(data.send)
|
||||||
|
list.value.push(data.receive)
|
||||||
} else {
|
} else {
|
||||||
content = content + data.content
|
// debugger
|
||||||
|
content = content + data.receive.content
|
||||||
const lastMessage = list.value[list.value.length - 1]
|
const lastMessage = list.value[list.value.length - 1]
|
||||||
lastMessage.content = marked(content) as unknown as string
|
lastMessage.content = marked(content) as unknown as string
|
||||||
list.value[list.value - 1] = lastMessage
|
list.value[list.value - 1] = lastMessage
|
||||||
|
Loading…
Reference in New Issue
Block a user