VTJ.PRO 在线应用开发平台的LLM服务、缓存与AI Agent工作流

LLM服务、缓存与AI Agent工作流

本文档详细介绍了VTJ.PRO的AI子系统,重点阐述其与大语言模型(LLM)的集成、提示词管理,以及用于代码生成和图像分析的AI Agent工作流的编排。

AIService: LLM编排器

AIService 是所有LLM交互的核心网关。它抽象了底层兼容OpenAI的客户端,并管理着诸如流式响应、错误处理和请求取消等复杂任务。

主要职责

  • 客户端初始化:根据提供商配置(API密钥、基础URL)动态创建OpenAI客户端。
  • 流式补全 :实现 chatCompletionsStream 方法,以处理向前端实时传输的token流。
  • 中止管理 :使用 AbortController 允许用户终止长时间运行的AI生成任务。
  • 用量追踪:计算并记录token使用量,用于监控和潜在的计费需求。

LLM请求数据流

下图展示了一个请求如何从高层级的Agent服务,通过 AIService,最终流向外部LLM提供商。

图示:AI请求管道

flowchart UserPrompt[User Prompt / Image] SystemPrompt["System Prompt (PromptService)"] ChatService["ChatService.chat()"] AIService["AIService.chatCompletionsStream()"] OpenAIClient["OpenAI Instance (openai-node)"] API["External LLM API (DeepSeek/OpenAI/etc)"] Frontend["Frontend UI (Chat Window)"] subgraph Natural Language Space UserPrompt --> ChatService SystemPrompt --> ChatService end subgraph "Code Entity Space (AIService)" ChatService --> AIService AIService --> OpenAIClient OpenAIClient --> API API -->|Stream| AIService end subgraph Response Handling AIService -->|SSE / Buffer| Frontend end

提示词管理与模板

VTJ.PRO 使用专门的系统提示词来引导LLM生成符合平台要求的代码和元数据。这些提示词由 PromptService 管理,并以Markdown文件的形式存储在 _docs/prompts/ 目录下。

提示词类型

  • Coder Prompt (coder.md, coder_v3.md) :指示AI扮演一名资深Vue 3开发者的角色。它强制使用"混合API"风格(即同时使用Composition API和Options API),并为增量更新提供严格的 SEARCH/REPLACE diff格式。
  • Image Prompt (image.md):配置AI以分析UI截图,并生成关于布局、导航和配色方案的描述性结构。
  • JSON Prompt (json.md):用于将设计工具(如Figma/MasterGo)导出的JSON转换为可读的实现说明。

实现: PromptService

PromptService 负责读取这些模板,并在将其发送给LLM之前执行变量插值(例如,注入支持的依赖项或当前平台类型)。

函数 用途 模板源
getCoderPrompt 生成用于代码生成的系统提示词 _docs/prompts/coder_v3.md
getImagePrompt 生成用于图像转代码分析的提示词 _docs/prompts/image.md
getJsonPrompt 生成用于设计稿转代码分析的提示词 _docs/prompts/json.md

AI Agent工作流 (ReAct模式)

该平台在其 coder_v3 工作流中采用了 ReAct(推理+行动) 模式。这使得AI不仅能够生成代码,还能"思考"任务并调用特定的工具。

五步循环

  1. T (思考):分析用户需求并检查约束条件。
  2. P (规划):将任务分解为原子操作(例如,创建页面、获取技能)。
  3. A (行动) :执行单个操作,如输出一个 diff 块或一个 json 工具调用。
  4. O (观察):接收来自系统的反馈(例如,编译错误或工具结果)。
  5. F (完成):总结已完成和待处理的任务。

增量更新 (SEARCH/REPLACE)

为了最大限度地减少token消耗,并避免因微小更改而重写整个文件,AI使用了精确的diff格式。

图示:增量代码更新工作流

sequenceDiagram participant AI Agent (coder_v3) participant ChatService participant ValidationService participant DslService AI Agent (coder_v3)->>ChatService: Output SEARCH/REPLACE Block ChatService->>ValidationService: Validate Diff Syntax ValidationService->>DslService: Fetch Current DSL/File DslService-->>ValidationService: Return Content ValidationService->>ValidationService: Apply Regex Match & Replace ValidationService-->>ChatService: Success / Match Error ChatService-->>AI Agent (coder_v3): Observation (O:) with Result

支撑服务

TopicService 与 ChatService

  • TopicService: 管理聊天"主题"的持久化。每个主题包含多条消息,并与特定的项目或应用关联。
  • ChatService : 编排对话流程。它负责检索历史记录、准备上下文(系统提示词+历史记录),并调用 AIService

ConfigService 与 ValidationService

  • ConfigService: 处理全局AI设置(如针对不同用途的默认模型)的检索。
  • ValidationService : 专门用于解析AI的输出。它提取代码块、验证JSON工具调用,并确保 SEARCH/REPLACE 块能唯一匹配目标源代码。

LLM模型缓存

为确保管理后台和Agent执行期间的高性能,模型配置会被缓存。LLMModelService 提供了 getModels()getCoderModels() 等基于缓存的方法,从而减少了每个AI请求对数据库的查询次数。

参考资料

相关推荐
带刺的坐椅1 小时前
SolonCode CLI 为什么选择 Java 技术栈?
ai编程·cli·claudecode·opencode·soloncode
冬奇Lab2 小时前
Android 开发要变天了:Google 专为 Agent 重建工具链,Token 减少 70%、速度提升 3 倍
android·人工智能·ai编程
bKYP953cL2 小时前
构建自己的AI编程助手:基于RAG的上下文感知实现方案
数据库·人工智能·ai编程
幺风2 小时前
Claude Code 源码分析 — Tool/MCP/Skill 可扩展工具系统
前端·javascript·ai编程
薛定谔的猫3693 小时前
探索 MCP 协议:构建跨平台的 Agent 自动化生态
ai·自动化·agent·技术趋势·mcp
芥末的无奈4 小时前
Harness Engineering 实战(一):为 fdk-acc 添加单元测试
单元测试·ai编程·harness
笨笨狗吞噬者5 小时前
Opus 4.7 使用体验
前端·ai编程
阿里云大数据AI技术5 小时前
深度回顾 | 阿里云携手 Elastic 定义 Agent 时代搜索新范式,解锁 Search AI 核心生产力
elasticsearch·agent
程序员老刘7 小时前
跨平台开发地图:四月风暴前夕,你该怎么选?| 2026年4月
flutter·ai编程·客户端
仰望誓言7 小时前
GLM Coding Plan速率限制429问题
ai编程