MJ-Studio 的对话功能提供了功能丰富的 AI 对话体验,支持多助手管理、流式输出、Markdown 渲染、多模态输入、对话压缩等特性。
- 助手管理: 创建多个专业助手,每个助手独立管理自己的对话
- 助手设置: 每个助手可配置名称、描述、头像、System Prompt(系统提示词)和默认模型
- System Prompt: 定义助手的角色和行为,如"你是一个专业的代码审查助手"。创建对话时,系统提示词会固化到对话中,后续修改助手的提示词不会影响已有对话
- 开场白建议: 每个助手自动生成个性化的开场白建议,帮助用户快速开始对话
- 助手收藏: 点击收藏按钮将常用助手置顶显示,方便快速访问
- 智能排序: 助手列表自动按最后对话时间排序,最近使用的助手排在前面
助手列表分为两个区域:
- 收藏区: 收藏的助手按收藏时间降序排列(最近收藏的在前)
- 普通区: 未收藏的助手按最后活跃时间降序排列(最近对话的在前)
调整收藏顺序: 取消收藏后重新收藏,该助手会移到收藏区最前面
- 新建对话: 点击"+"按钮创建新对话,或点击助手直接进入虚拟对话(发送第一条消息时自动创建)
- 对话重命名: 在对话列表的下拉菜单中选择"重命名",手动修改对话标题
- 智能命名: 点击"智能重命名",AI 根据对话内容自动生成标题
- 对话列表: 每个助手独立管理自己的对话列表,支持删除、分享等操作
- URL 参数: 支持通过 URL 参数指定助手和对话,刷新页面保持状态
智能命名会提取对话的前 2 条和后 2 条消息(每条最多 200 字)作为上下文,让 AI 生成 10-20 字的简洁标题。
- 使用当前助手配置的模型进行生成
- 标题最大长度默认 30 字,超出会截断
- 可在设置页面自定义生成提示词和最大长度
在对话标题下拉菜单中点击"分享"按钮,会在新标签页打开分享页面,页面地址即为分享链接。
- 只读展示: 分享页面仅供查看,无法编辑
- 实时更新: 分享链接指向原始对话,对话内容更新后分享页面同步更新
- Markdown 渲染: 完整支持 Markdown 格式,代码块语法高亮
- 思考过程: 显示 AI 的思考过程(折叠块形式)
- 嵌入式插图: 对话中生成的图片会在分享页面正常显示
- 移动端友好: 响应式布局,手机上也能良好阅读
分享页面顶部有"导出 PDF"按钮,点击后调用浏览器打印功能,可保存为 PDF 文件。打印时工具栏自动隐藏。
- 复制链接: 直接复制分享页面的 URL 发送给他人
- 导出 PDF: 保存为本地文件后分享
- 流式输出: 实时显示 AI 回复
- Markdown 渲染: 消息内容支持 Markdown 格式,代码块支持语法高亮
- 多模态输入: 支持上传图片、PDF、文本文件等附件与 AI 进行多模态交互
- 消息操作: 支持复制、编辑、删除、重放消息
- 停止生成: AI 生成过程中可随时停止输出
- 手动添加: 支持手动添加用户消息和 AI 消息,不触发 AI 回复
- 快速跳转: 点击"对话已开始"分界线可快速跳转到消息列表底部
对话输入框支持上传多种类型的附件:
| 文件类型 | 处理方式 |
|---|---|
| 图片(PNG、JPG、GIF、WebP 等) | 作为图片发送给模型 |
| PDF 文档 | Claude/Gemini 作为文档块,OpenAI 作为文本嵌入 |
| SVG、JSON、代码文件等 | 读取为文本嵌入对话上下文 |
[!note] 大文件确认 非图片/PDF 文件如果大于 20KB,系统会弹出确认对话框,提示文件将作为文本嵌入可能占用较多上下文空间。
对话输入框上方有两个开关,用于控制当前对话的 AI 能力:
| 开关 | 图标 | 功能 | 前提条件 |
|---|---|---|---|
| 思考开关 | 💡 | 启用模型的推理/思考能力 | 模型需勾选"推理"能力 |
| 联网开关 | 🌐 | 启用模型的搜索能力 | 模型需勾选"联网"能力 |
[!tip] 新对话预设 可以在发送第一条消息前预先设置开关状态,开关设置会随对话创建一起保存。
桌面端对话页面的侧边栏(助手信息和对话列表区域)支持以下操作:
- 折叠/展开: 点击侧边栏顶部的折叠按钮可隐藏侧边栏,获得更大的消息显示区域
- 拖拽调整宽度: 鼠标悬停在侧边栏左边缘,出现调整光标时可拖拽改变宽度
- 宽度记忆: 调整后的宽度会自动保存,下次打开时保持
移动端侧边栏自动适配为抽屉式展示,无需手动调整。
长对话自动压缩为摘要,节省 token 的同时保留完整上下文。详见 对话压缩功能介绍
支持 Claude、OpenAI o 系列、Gemini 等模型的原生思考能力,展示 AI 推理过程。详见 思考功能介绍
AI 可访问互联网获取实时信息,通过模型原生 Web Search 能力实现。详见 搜索功能介绍
AI 可在对话中调用绘图组件生成插图。详见 嵌入式绘图组件介绍
部分模型(如 Gemini)支持在对话中直接生成图片,并支持连续编辑:
工作流程:
- 模型返回图片后,系统自动保存到本地并生成公网 URL
- 后续对话中引用该图片时,使用 URL 而非 base64,避免 token 超限
- 支持多轮连续图片编辑(如"把背景换成海边"、"添加一只猫"等)
技术说明:
- 图片自动保存到
uploads/目录 - 消息的
files字段包含publicUrl,用于后续 API 请求 - 刷新页面后图片显示为本地 URL(首次流式渲染时为 base64,这是正常现象)
支持多上游、多模型配置,快速切换和余额查询。详见 上游和模型配置
基于 SSE 的事件驱动架构,支持多端实时同步。详见 多端同步和流式输出
┌──────────────────────────────────────────────────────────────────────────┐
│ MJ Studio [绘图] [设置] [用户] │
├──────────────────────────────────────────────────────────────────────────┤
│ │
│ ┌──────────┐ ┌─────────────────────────────────────┐ ┌───────────────┐ │
│ │ 助手列表 │ │ 消息区域 │ │ 助手信息 │ │
│ ├──────────┤ ├─────────────────────────────────────┤ ├───────────────┤ │
│ │ │ │ │ │ [头像] │ │
│ │ ◉ 默认助手│ │ User: 帮我解释Vue的响应式原理 │ │ 默认助手 [⚙] │ │
│ │ │ │ │ │ │ │
│ │ ○ 代码助手│ │ Assistant: Vue的响应式系统基于... │ │ 智能助理... │ │
│ │ │ │ │ ├───────────────┤ │
│ │ ○ 翻译助手│ │ │ │ 对话列表 │ │
│ │ │ │ │ │ [+ 新对话] │ │
│ ├──────────┤ │ │ ├───────────────┤ │
│ │[+ 新助手]│ │ │ │ ▸ Vue响应式 │ │
│ └──────────┘ │ │ │ ▹ API设计 │ │
│ │ ┌─────────────────────────────────┐│ │ ▹ 数据库设计 │ │
│ │ │ [上游▼] [模型▼] Token: 2.5K ││ └───────────────┘ │
│ │ ├─────────────────────────────────┤│ │
│ │ │ 输入消息... [发送] ││ │
│ │ └─────────────────────────────────┘│ │
│ └─────────────────────────────────────┘ │
│ │
└──────────────────────────────────────────────────────────────────────────┘
移动端采用响应式设计:
- 助手列表: 折叠为顶部下拉菜单
- 助手信息: 隐藏,通过按钮展开抽屉
- 消息区域: 全屏显示,头像自适应隐藏
- 对话列表: 底部抽屉展示
对话中会出现以下几种类型的消息:
- 用户消息: 您发送的消息,显示在右侧
- AI 消息: 助手的回复,显示在左侧,支持 Markdown 格式渲染
| 消息类型 | 样式 | 说明 |
|---|---|---|
| 错误消息 | 红色边框 | AI 生成失败时显示错误原因 |
| 压缩请求 | 蓝色边框 + 归档图标 | 压缩操作的分界线,前方显示"以上内容已压缩" |
| 压缩摘要 | 琥珀色边框 + 文档图标 | AI 生成的历史摘要,默认折叠,支持编辑 |
| 思考过程 | 折叠块 | 开启思考功能时,AI 的推理过程,默认折叠 |
- 创建助手: 点击"新建助手"按钮,配置名称、System Prompt 和默认模型
- 开始对话: 点击助手进入对话界面,查看开场白建议或直接发送消息
- 切换模型: 通过输入框上方的下拉菜单快速切换上游和模型
- 多模态输入: 点击附件按钮上传图片,与 AI 进行图文对话
- 压缩对话: 对话历史过长时,点击"压缩对话"按钮生成摘要
- 重放消息: 在消息下拉菜单中选择"重放消息",从该消息重新生成
- 分叉对话: 在消息下拉菜单中选择"分叉对话",创建新对话分支
- 嵌入式绘图: 在对话中输入 mj-drawing 代码块,快速生成插图
- 智能命名: 在对话列表中点击"智能重命名",AI 自动生成标题
- 虚拟对话: 点击助手后立即进入对话,无需等待对话创建
- 懒加载: 消息列表默认加载最近 10 条,向上滚动时加载更多
- 事件驱动: UI 更新通过事件推送,避免轮询和频繁请求
- 流式缓冲: 前端缓冲区平滑渲染流式内容,减少 DOM 操作
- AI 群聊: 多助手、多用户参与同一对话,智能协作
- 记忆系统: 长期记忆用户偏好和项目背景,跨对话连续性
- TTS/ASR: 语音输入输出,支持语音通话
- Thinking 模式: 显示 AI 思考过程,支持折叠渲染
- MCP 集成: 支持工具调用,集成搜索、代码执行等功能
- 多模态视频: 支持视频通话,实时识图对话
- 助手共享: 支持分享助手配置,导入社区助手
- 助手市场: 社区助手分享和订阅
- 插件系统: 第三方插件扩展助手能力
- 团队协作: 多用户团队共享助手和对话