feature/zoujing #4

Open
zoujing wants to merge 15 commits from feature/zoujing into main
5 changed files with 50 additions and 21 deletions
Showing only changes of commit 8137a38060 - Show all commits

View File

@@ -6,7 +6,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta <meta
http-equiv="Content-Security-Policy" http-equiv="Content-Security-Policy"
content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' http://8.138.234.141; connect-src 'self' http://8.138.234.141 https://api.iconify.design" content="default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self' http://8.138.234.141; connect-src 'self' http://8.138.234.141 https://api.iconify.design wss://onefeel.brother7.cn"
/> />
</head> </head>
<body> <body>

View File

@@ -113,22 +113,46 @@ export class WebSocketManager {
await this.connect() await this.connect()
} }
// 改进方案让connect()真正等待连接
async connect(): Promise<void> { async connect(): Promise<void> {
if (this.isConnecting || this.connectionState) return console.log('[WebSocket] connect() called, isConnecting:', this.isConnecting, 'connectionState:', this.connectionState)
if (this.isConnecting || this.connectionState) {
console.log('[WebSocket] Already connecting or connected, returning early')
return
}
this.isConnecting = true this.isConnecting = true
console.log('[WebSocket] Starting connection...')
return new Promise((resolve, reject) => {
try { try {
console.log('[WebSocket] About to create new WebSocket with URL:', this.wsUrl)
this.ws = new WebSocket(this.wsUrl, this.protocols) this.ws = new WebSocket(this.wsUrl, this.protocols)
console.log('WebSocket connecting to:', this.wsUrl) console.log('[WebSocket] WebSocket object created, readyState:', this.ws?.readyState)
this.ws.onopen = this.handleOpen
// 包装handleOpen以resolve Promise
this.ws.onopen = (event: Event) => {
console.log('[WebSocket] onopen event fired')
this.handleOpen(event)
resolve() // ← 真正的连接成功
}
this.ws.onmessage = this.handleMessage this.ws.onmessage = this.handleMessage
this.ws.onclose = this.handleClose this.ws.onclose = (event: CloseEvent) => {
this.ws.onerror = this.handleError console.log('[WebSocket] onclose event fired, code:', event.code, 'reason:', event.reason)
this.handleClose(event)
}
this.ws.onerror = (error: Event) => {
console.log('[WebSocket] onerror event fired', error)
this.handleError(error)
reject(error) // ← Promise拒绝
}
} catch (error) { } catch (error) {
this.isConnecting = false this.isConnecting = false
this.safeCall('onError', error) this.safeCall('onError', error)
this.scheduleReconnect() this.scheduleReconnect()
reject(error)
} }
})
} }
private handleOpen = (event: Event): void => { private handleOpen = (event: Event): void => {

View File

@@ -24,12 +24,12 @@
</div> </div>
<!-- AI 标识 --> <!-- AI 标识 -->
<div v-if="msg.messageRole === MessageRole.AI" class="mt-2 text-xs text-gray-400 "> <div v-if="msg.messageRole === MessageRole.AI && msg.finished" class="mt-2 text-xs text-gray-400 ">
本回答由 AI 生成 本回答由 AI 生成
</div> </div>
<!-- AI 操作按钮 --> <!-- AI 操作按钮 -->
<div v-if="msg.messageRole === MessageRole.AI" <div v-if="msg.messageRole === MessageRole.AI && msg.finished"
class="mt-4 text-gray-500 flex items-center justify-between gap-4 "> class="mt-4 text-gray-500 flex items-center justify-between gap-4 ">
<RiFileCopyLine size="16px" @click="copyFileClick(msg)" /> <RiFileCopyLine size="16px" @click="copyFileClick(msg)" />
<div class="flex items-center gap-4"> <div class="flex items-center gap-4">
@@ -38,7 +38,6 @@
<RiThumbUpLine size="16px" @click="thumbUpClick(msg)" /> <RiThumbUpLine size="16px" @click="thumbUpClick(msg)" />
<RiThumbDownLine size="16px" @click="thumbDownClick(msg)" /> <RiThumbDownLine size="16px" @click="thumbDownClick(msg)" />
</div> </div>
</div> </div>
</div> </div>
@@ -318,6 +317,7 @@ const initWebSocket = async () => {
// 处理WebSocket消息 // 处理WebSocket消息
const handleWebSocketMessage = (data: any) => { const handleWebSocketMessage = (data: any) => {
console.log("收到WebSocket消息:", data);
// 验证关键字段(若服务端传回 conversationId/agentId则校验是否属于当前会话 // 验证关键字段(若服务端传回 conversationId/agentId则校验是否属于当前会话
if (data.conversationId && data.conversationId !== conversationId.value) { if (data.conversationId && data.conversationId !== conversationId.value) {
console.warn("收到不属于当前会话的消息,忽略", data.conversationId); console.warn("收到不属于当前会话的消息,忽略", data.conversationId);
@@ -374,6 +374,7 @@ const handleWebSocketMessage = (data: any) => {
// 处理完成状态 // 处理完成状态
if (data.finish) { if (data.finish) {
chatMsgList.value[aiMsgIndex].finished = data.finish;
const msg = chatMsgList.value[aiMsgIndex].messageContent; const msg = chatMsgList.value[aiMsgIndex].messageContent;
if (!msg || chatMsgList.value[aiMsgIndex].isLoading) { if (!msg || chatMsgList.value[aiMsgIndex].isLoading) {
chatMsgList.value[aiMsgIndex].messageContent = "未获取到内容,请重试"; chatMsgList.value[aiMsgIndex].messageContent = "未获取到内容,请重试";

View File

@@ -3,8 +3,8 @@
<div class="flex h-full w-full flex-col md:flex-row "> <div class="flex h-full w-full flex-col md:flex-row ">
<chat-history class="flex-none w-64" /> <chat-history class="flex-none w-64" />
<div class="flex-1 mr-2 overflow-hidden bg-white rounded-xl"> <div class="flex-1 mr-2 overflow-hidden bg-white rounded-xl">
<chat-guide /> <!-- <chat-guide /> -->
<!-- <chat-box /> --> <chat-box />
</div> </div>
<TaskList /> <TaskList />
</div> </div>

View File

@@ -18,6 +18,8 @@ export class ChatMessage {
messageContent: string; messageContent: string;
// 是否加载中 // 是否加载中
isLoading?: boolean; isLoading?: boolean;
// 是否完成
finished?: boolean;
// 工具调用信息 // 工具调用信息
toolCall?: any; toolCall?: any;
// 问题信息 // 问题信息
@@ -28,13 +30,15 @@ export class ChatMessage {
messageRole: MessageRole, messageRole: MessageRole,
messageContent: string, messageContent: string,
isLoading: boolean = false, isLoading: boolean = false,
finished: boolean = false,
toolCall?: any, toolCall?: any,
question?: any question?: any
) { ) {
this.messageId = messageId;
this.messageRole = messageRole; this.messageRole = messageRole;
this.messageContent = messageContent; this.messageContent = messageContent;
this.finished = finished;
this.isLoading = isLoading; this.isLoading = isLoading;
this.messageId = messageId;
this.toolCall = toolCall; this.toolCall = toolCall;
this.question = question; this.question = question;
} }