Kimi-VL-A3B-Thinking快速上手Chainlit自定义UI添加历史记录与导出功能1. 准备工作与环境确认1.1 模型服务状态检查在开始使用Kimi-VL-A3B-Thinking模型前我们需要确认服务是否已成功部署。打开终端执行以下命令cat /root/workspace/llm.log如果看到类似下面的输出表示模型已成功加载[INFO] Model loaded successfully [INFO] Ready to accept requests注意初次加载可能需要5-10分钟时间请耐心等待直到看到成功提示。1.2 Chainlit前端启动确保模型服务正常运行后我们可以启动Chainlit前端界面chainlit run app.py启动成功后默认会在浏览器打开http://localhost:8000界面。如果未自动打开可以手动输入该地址访问。2. 基础功能快速体验2.1 图文对话功能测试让我们先测试一个简单的图文识别功能点击界面上的上传图片按钮选择一张包含文字的图片如店铺招牌、路牌等在输入框中提问图中店铺名称是什么等待模型分析并返回结果效果示例输入图片一张咖啡店门头照片提问图中店铺名称是什么模型回答店铺名称为星巴克咖啡2.2 多轮对话测试Kimi-VL支持连续的多轮对话可以基于前文内容进行深入交流先上传一张餐厅菜单图片提问这张菜单上最贵的菜是什么接着问它的价格是多少继续问这道菜的主要食材是什么模型会记住之前的对话上下文给出连贯的回答。3. 自定义UI功能开发3.1 添加对话历史记录功能默认Chainlit界面不保存历史对话我们可以通过修改app.py添加这一功能。以下是关键代码实现from chainlit import Message, on_chat_start import json import os # 历史记录存储文件 HISTORY_FILE chat_history.json on_chat_start async def init_chat(): # 初始化时加载历史记录 if os.path.exists(HISTORY_FILE): with open(HISTORY_FILE, r) as f: history json.load(f) for item in history: await Message( contentitem[content], authoritem[author] ).send()3.2 实现对话导出功能为了让用户能保存有价值的对话我们添加导出功能from chainlit import Action, on_message on_message async def handle_message(message: str): # 原有消息处理逻辑... # 添加导出按钮 actions [ Action(nameexport, valueexport, label导出对话) ] await Message(content, actionsactions).send() # 处理导出动作 on_action(export) async def on_export(): if os.path.exists(HISTORY_FILE): with open(HISTORY_FILE, r) as f: history json.load(f) export_content \n.join( f{item[author]}: {item[content]} for item in history ) return export_content return 暂无对话历史3.3 完整功能集成将上述功能整合后的完整app.py示例import chainlit as cl from chainlit import Action, on_message, on_chat_start import json import os HISTORY_FILE chat_history.json on_chat_start async def start_chat(): # 初始化历史记录 if os.path.exists(HISTORY_FILE): with open(HISTORY_FILE, r) as f: history json.load(f) for item in history[-10:]: # 只显示最近10条 await cl.Message( contentitem[content], authoritem[author] ).send() on_message async def main(message: str): # 保存用户消息 save_message(message, user) # 调用模型获取回复 response await get_model_response(message) # 保存模型回复 save_message(response, assistant) # 添加导出按钮 actions [Action(nameexport, valueexport, label导出对话)] await cl.Message(contentresponse, actionsactions).send() def save_message(content: str, author: str): 保存消息到历史记录 history [] if os.path.exists(HISTORY_FILE): with open(HISTORY_FILE, r) as f: history json.load(f) history.append({content: content, author: author}) with open(HISTORY_FILE, w) as f: json.dump(history, f) async def get_model_response(query: str) - str: 调用Kimi-VL模型获取回复 # 这里替换为实际的模型调用代码 return 这是模型的模拟回复4. 功能测试与优化4.1 历史记录功能验证关闭并重新打开Chainlit界面检查之前的对话是否自动加载进行新的对话后刷新页面确认新对话也被保存4.2 导出功能测试进行几轮对话后点击导出按钮检查导出的内容是否包含完整对话确认导出的文本格式是否正确4.3 性能优化建议如果发现界面响应变慢可以考虑以下优化限制历史记录数量只保存最近50条对话# 在save_message函数中添加 if len(history) 50: history history[-50:]使用数据库替代文件存储对于高频使用场景建议改用SQLite等轻量级数据库异步保存使用异步IO操作减少界面卡顿async def async_save_message(content: str, author: str): loop asyncio.get_event_loop() await loop.run_in_executor(None, save_message, content, author)5. 总结通过本教程我们为Kimi-VL-A3B-Thinking模型的Chainlit前端添加了两个实用功能对话历史记录自动保存用户与模型的对话关闭后再次打开仍可查看对话导出功能一键导出完整对话记录方便存档或分享这些改进显著提升了用户体验使Kimi-VL在多轮对话场景中更加实用。您可以根据实际需求进一步扩展功能比如添加对话分类标签实现对话搜索功能支持多种导出格式Markdown、PDF等获取更多AI镜像想探索更多AI镜像和应用场景访问 CSDN星图镜像广场提供丰富的预置镜像覆盖大模型推理、图像生成、视频生成、模型微调等多个领域支持一键部署。