1
app.post('/chat-stream', async (req, res) => {
2
  const {message, sessionId} = req.body
3

4
  // 设置响应头为流式传输
5
  res.setHeader('Content-Type', 'text/event-stream')
6
  res.setHeader('Cache-Control', 'no-cache')
7
  res.setHeader('Connection', 'keep-alive')
8

9
  // 获取或初始化用户会话
10
  if (!userSessions.has(sessionId)) {
11
    userSessions.set(sessionId, [{role: 'system', content: '你是一个乐于助人的AI助手'}])
12
  }
13

14
  const messages = userSessions.get(sessionId)
15
  messages.push({role: 'user', content: message})
16

17
  try {
18
    const stream = await openai.chat.completions.create({
19
      model: 'deepseek-reasoner',
20
      messages: messages,
21
      stream: true, // 启用流式响应
22
    })
23

24
    let fullResponse = ''
25

26
    for await (const chunk of stream) {
27
      const content = chunk.choices[0]?.delta?.content || ''
28
      fullResponse += content
29

30
      // 发送每个数据块到前端
31
      res.write(`data: ${JSON.stringify({content})}\n\n`)
32
    }
33

34
    // 保存完整响应到对话历史
35
    messages.push({role: 'assistant', content: fullResponse})
36
    res.end()
37
  } catch (error) {
38
    console.error('Error:', error)
39
    res.write(`data: ${JSON.stringify({error: error.message})}\n\n`)
40
    res.end()
41
  }
42
})

1
async function sendMessage() {
2
  const message = userInput.value.trim()
3
  if (!message) return
4

5
  // 显示用户消息
6
  displayMessage(message, 'user')
7
  userInput.value = ''
8

9
  // 创建AI消息占位符
10
  const aiMessageDiv = document.createElement('div')
11
  aiMessageDiv.className = 'message assistant-message'
12
  chatContainer.appendChild(aiMessageDiv)
13

14
  // 滚动到底部
15
  chatContainer.scrollTop = chatContainer.scrollHeight
16

17
  try {
18
    const sessionId = getOrCreateSessionId()
19
    const response = await fetch('/chat-stream', {
20
      method: 'POST',
21
      headers: {'Content-Type': 'application/json'},
22
      body: JSON.stringify({message, sessionId}),
23
    })
24

25
    if (!response.ok) throw new Error('网络响应不正常')
26

27
    // 处理流式数据
28
    const reader = response.body.getReader()
29
    const decoder = new TextDecoder()
30
    let aiResponse = ''
31

32
    while (true) {
33
      const {done, value} = await reader.read()
34
      if (done) break
35

36
      const chunk = decoder.decode(value)
37
      const lines = chunk.split('\n\n').filter(line => line.trim())
38

39
      for (const line of lines) {
40
        if (line.startsWith('data: ')) {
41
          const data = JSON.parse(line.substring(6))
42

43
          if (data.error) {
44
            aiMessageDiv.textContent = `错误: ${data.error}`
45
            return
46
          }
47

48
          if (data.content) {
49
            aiResponse += data.content
50
            aiMessageDiv.textContent = aiResponse
51

52
            // 平滑滚动效果
53
            chatContainer.scrollTop = chatContainer.scrollHeight
54
          }
55
        }
56
      }
57
    }
58
  } catch (error) {
59
    aiMessageDiv.textContent = `抱歉，发生了错误: ${error.message}`
60
    console.error('Error:', error)
61
  }
62
}

1
/* 添加打字光标效果 */
2
.assistant-message {
3
  border-right: 2px solid #666;
4
  animation: blink-caret 0.75s step-end infinite;
5
}
6

7
@keyframes blink-caret {
8
  from,
9
  to {
10
    border-color: transparent;
11
  }
12
  50% {
13
    border-color: #666;
14
  }
15
}

1
function sendMessageWithEventSource() {
2
  const message = userInput.value.trim()
3
  if (!message) return
4

5
  displayMessage(message, 'user')
6
  userInput.value = ''
7

8
  const aiMessageDiv = document.createElement('div')
9
  aiMessageDiv.className = 'message assistant-message'
10
  chatContainer.appendChild(aiMessageDiv)
11

12
  const sessionId = getOrCreateSessionId()
13
  const eventSource = new EventSource(`/chat-stream?message=${encodeURIComponent(message)}&sessionId=${sessionId}`)
14

15
  let aiResponse = ''
16

17
  eventSource.onmessage = event => {
18
    const data = JSON.parse(event.data)
19

20
    if (data.error) {
21
      aiMessageDiv.textContent = `错误: ${data.error}`
22
      eventSource.close()
23
      return
24
    }
25

26
    aiResponse += data.content
27
    aiMessageDiv.textContent = aiResponse
28
    chatContainer.scrollTop = chatContainer.scrollHeight
29
  }
30

31
  eventSource.onerror = () => {
32
    eventSource.close()
33
    if (!aiResponse) {
34
      aiMessageDiv.textContent = '连接中断，请重试'
35
    }
36
  }
37
}