zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 对接了会话的接口与会话交互

Browse Source
This commit is contained in:
zoujing
2025-07-22 00:08:36 +08:00
parent c75448e558
commit e6b9407e69
6 changed files with 219 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
manager/LoginManager.js
View File

@@ -15,7 +15,8 @@ export async function loginAuth() {
password: 'YehdBPev'
});
if (response.access_token) {
return response.data;
uni.setStorageSync('token', response.access_token)
return response;
} else {
throw new Error(response.message || '登录失败');
}

1
pages/chat/ChatCardAI.vue
View File

@@ -19,6 +19,7 @@
.chat-ai {
margin: 6px 12px;
padding: 16px;
min-width: 60px;
background: rgba(255,255,255,0.4);
box-shadow: 2px 2px 10px 0px rgba(0,0,0,0.1);

112
pages/chat/ChatMainList.vue
View File

@@ -21,20 +21,10 @@
<!-- logo栏 -->
<ChatTopBanner class="chat-container-top-bannar"></ChatTopBanner>
<ChatCardAI class="message-item message-item-ai" text="查信息、预定下单、探索玩法、呼叫服务、我通通可以满足，快试试问我问题吧!">
</ChatCardAI>
<view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">
<CommandWrapper text="ssss"/>
<template v-if="item.msgType === MessageRole.AI">
<ChatCardAI class="message-item message-item-ai" :text="item.msg">
<image v-if="item.msgContent && item.msgContent.type === MessageType.IMAGE" src="/static/logo.png" style="width: 100px;height: 100px;"></image>
<OneFeelMK001></OneFeelMK001>
</ChatCardAI>
</template>
@@ -83,6 +73,7 @@
import { MessageRole, ChatModel, MessageType } from '../../model/ChatModel';
import OneFeelMK001 from '../module/OneFeelMK001.vue';
import request from '../../request/base/request';
// 导航栏相关
const statusBarHeight = ref(20);
@@ -176,18 +167,7 @@
}
chatMsgList.value.push(newMsg)
let type = chatMsgList.value.length % 3 === 0
const newMsgAI: ChatModel = {
msgId: `msg_${chatMsgList.value.length}`,
msgType: MessageRole.AI,
msg: `我是ai,你输入的内容是：${text}`,
msgContent: {
type: type ? MessageType.IMAGE : MessageType.TEXT,
url: ''
}
}
chatMsgList.value.push(newMsgAI)
sendChat('酒店一共有哪些温泉？')
console.log("发送的新消息：",JSON.stringify(newMsg))
}
@@ -201,6 +181,94 @@
});
}
let loadingTimer: any = null;
let typeWriterTimer: any = null;
let aiMsgBuffer = ''; // 全局缓冲区
let isTyping = false; // 是否正在打字
const sendChat = (text) => {
console.log('=============会话测试')
const args = {
conversationId: "1931957498711957505",
agentId: "1",
messageType: 0,
messageContent: text
}
// 1. 插入AI消息
const aiMsg: ChatModel = {
msgId: `msg_${chatMsgList.value.length}`,
msgType: MessageRole.AI,
msg: '加载中.',
msgContent: {
type: MessageType.TEXT,
url: ''
}
}
chatMsgList.value.push(aiMsg)
const aiMsgIndex = chatMsgList.value.length - 1
// 动态加载中动画
let dotCount = 1;
loadingTimer && clearInterval(loadingTimer);
loadingTimer = setInterval(() => {
dotCount = dotCount % 3 + 1;
chatMsgList.value[aiMsgIndex].msg = '加载中' + '.'.repeat(dotCount);
}, 400);
aiMsgBuffer = '';
isTyping = false;
if (typeWriterTimer) {
clearTimeout(typeWriterTimer);
typeWriterTimer = null;
}
// 2. 流式接收内容
request.getAIChatStream(args, (chunk) => {
console.log('分段内容:', chunk)
if (chunk && chunk.content) {
// 收到内容，停止动画
if (loadingTimer) {
clearInterval(loadingTimer);
loadingTimer = null;
}
// 把新内容追加到缓冲区
aiMsgBuffer += chunk.content;
// 启动打字机（只启动一次）
if (!isTyping) {
isTyping = true;
chatMsgList.value[aiMsgIndex].msg = '';
typeWriter();
}
}
if (chunk && chunk.finish) {
// 结尾处理：确保剩余内容全部输出
const finishInterval = setInterval(() => {
if (aiMsgBuffer.length === 0) {
clearInterval(finishInterval);
isTyping = false;
scrollToBottom();
}
}, 50);
}
});
// 打字机函数
function typeWriter() {
if (aiMsgBuffer.length > 0) {
chatMsgList.value[aiMsgIndex].msg += aiMsgBuffer[0];
aiMsgBuffer = aiMsgBuffer.slice(1);
scrollToBottom();
typeWriterTimer = setTimeout(typeWriter, 30);
} else {
// 等待新内容到来，不结束
typeWriterTimer = setTimeout(typeWriter, 30);
}
}
}
</script>

24
pages/drawer/DrawerHome.vue
View File

@@ -6,6 +6,8 @@
<button @click="closeDrawer" type="default">关闭</button>
<button @click="login" type="default">登录</button>
<button @click="sendChat" type="default">会话测试</button>
<view class="drawer-list">
<view v-for="(item,index) in 100" :key="index">
<text class="message-item">{{item}}</text>
@@ -20,6 +22,9 @@
const emits = defineEmits(['closeDrawer'])
import * as loginMnager from '@/manager/LoginManager'
import { getAgentChatMessage } from '@/request/api/AgentChatApi.js'
import request from '../../request/base/request'
const closeDrawer = () => {
emits('closeDrawer')
console.log('=============关闭抽屉')
@@ -39,6 +44,25 @@
// 这里可以处理登录逻辑，比如调用登录接口等
}
const sendChat = () => {
console.log('=============会话测试')
const args = {
"conversationId":"1931957498711957505",
"agentId":"1",
"messageType": 0,
"messageContent":"酒店一共有哪些温泉？"
}
request.getAIChatStream(args, (chunk) => {
// 每收到一段数据都会回调
console.log('分段内容:', chunk)
// 你可以在这里追加到消息列表
})
}
</script>
<style lang="scss" scoped>

19
request/api/AgentChatApi.js Normal file
View File

@@ -0,0 +1,19 @@
import request from "../base/request";
function getAgentChatMessage() {
const args = {
"conversationId":"1931957498711957505",
"agentId":"1",
"messageType": 0,
"messageContent":"酒店一共有哪些温泉？"
}
const defaultConfig = {
header: {
Accept: 'text/event-stream',
'Content-Type': 'application/json'
},
};
return request.post('/agent/assistant/chat', args, defaultConfig);
}
export { getAgentChatMessage }

83
request/base/request.js
View File

@@ -14,6 +14,7 @@ function request(url, args = {}, method = 'POST', customConfig = {}) {
}
// 动态获取 token
const token = uni.getStorageSync('token');
let header = {
...defaultConfig.header,
...customConfig.header
@@ -23,9 +24,12 @@ function request(url, args = {}, method = 'POST', customConfig = {}) {
delete header.Authorization;
} else {
if (token) {
header.Authorization = `Basic ${token}`;
header.Authorization = `Bearer ${token}`;
}
}
console.log("请求头customConfig:" + JSON.stringify(customConfig))
const config = {
...defaultConfig,
...customConfig,
@@ -54,8 +58,8 @@ function request(url, args = {}, method = 'POST', customConfig = {}) {
}
// 默认 POST
request.post = function(url, args = {}) {
return request(url, args, 'POST');
request.post = function(url, args = {}, config = {}) {
return request(url, args, 'POST', config);
};
// 支持 GET
@@ -63,4 +67,77 @@ request.get = function(url, args = {}) {
return request(url, args, 'GET');
};
/**
* 获取AI聊天流式信息（仅微信小程序支持）
* @param {Object} params 请求参数
* @param {Function} onChunk 回调，每收到一段数据触发
* @returns {Promise}
*/
request.getAIChatStream = function(params, onChunk) {
return new Promise((resolve, reject) => {
const token = uni.getStorageSync('token');
console.log("发送请求内容: ", params)
// #ifdef MP-WEIXIN
const requestTask = uni.request({
url: BASE_URL + '/agent/assistant/chat', // 替换为你的接口地址
method: 'POST',
data: params,
enableChunked: true,
header: {
Accept: 'text/event-stream',
'Content-Type': 'application/json',
Authorization: `Bearer ${token}`, // 如需token可加
},
responseType: 'arraybuffer',
success(res) {
resolve(res.data);
},
fail(err) {
reject(err);
}
});
requestTask.onHeadersReceived(res => {
console.log('onHeadersReceived', res);
});
requestTask.onChunkReceived(res => {
const base64 = uni.arrayBufferToBase64(res.data);
let data = '';
try {
data = decodeURIComponent(escape(atob(base64)));
} catch (e) {
// 某些平台可能不支持 atob，可以直接用 base64
data = base64;
}
const messages = parseSSEChunk(data);
messages.forEach(msg => {
if (onChunk) onChunk(msg);
});
});
// #endif
});
}
// 解析SSE分段数据
function parseSSEChunk(raw) {
// 拆分为多段
const lines = raw.split('\n\n');
const results = [];
lines.forEach(line => {
// 只处理包含 data: 的行
const dataMatch = line.match(/data:(\{.*\})/);
if (dataMatch && dataMatch[1]) {
try {
const obj = JSON.parse(dataMatch[1]);
results.push(obj);
} catch (e) {
// 解析失败忽略
}
}
});
return results;
}
export default request;