Ollama流式应答接口页面对接

本节需求

实现一款简单的UI界面，与服务端 Ollama DeepSeek AI 进行对接

前端代码

这里直接贴一份我自己和AI多次对话得到的一个效果还不错的HTML

效果展示

支持的功能

1. 普通请求/流式请求切换

   • 用户可通过界面按钮在普通请求（一次性返回完整消息）与流式请求（逐段返回消息）之间切换。
   • 当前模式会在界面顶部显示，并附带简要说明。

2. 聊天记录快捷导航

   • 支持通过键盘的 ↑/↓ 箭头快速切换上一条或下一条用户发言，方便重复发送或修改。

3. Markdown 格式渲染

   • 服务端返回的消息支持 Markdown 格式，前端会自动解析并渲染，包括代码块、列表、表格等。

4. 深度思考与普通输出区分

   • 模型的“深度思考”状态会以特殊样式（如灰色背景提示框）显示，普通输出则以常规气泡样式展示。

5. 日志功能

   • 提供日志面板，记录用户请求与服务端响应的详细信息，便于调试与问题排查。
   • 日志支持查看、清空等操作，提升开发与测试效率。

具体代码

点击这里下载完整 HTML 文件

我们将完整的 HTML 文件提供为下载链接，您可以点击上方链接获取。