工作流 Agent
agent-workflow
演示地址：workflow-demo.canoeagent.com Key：（为防止 Key 滥用，请在履历页面或联系站长获取） 提示：刷新或重开页面页面均需要输入 Key 建议：PC 或平板电脑等宽屏设备访问效果最佳 操作指南.txt
创建、编辑工作流
技术栈 & 外部 API
Agent Workflow — 一个轻量化的通用工作流编排引擎 + 可视化前端。用户可通过拖拽编辑器自定义工作流（搜索 → AI 分析 → 确认 → 输出），实时查看每一步执行过程，最终生成行业调研报告。
后端技术栈
| 维度 | 选择 | 说明 |
|---|---|---|
| 语言 | Go 1.25 | 单二进制部署，高并发原生支持 |
| HTTP 路由 | net/http 标准库 | 未使用第三方路由，纯 http.ServeMux |
| HTTP 客户端 | go-resty/resty v2.17.2 | 流式响应需通过 SetDoNotParseResponse(true) + RawBody() 手动读取 |
| 配置解析 | gopkg.in/yaml.v3 | 解析 config.yaml |
| 实时推送 | SSE (Server-Sent Events) | net/http 标准库手写 text/event-stream，Flusher.Flush() 推送 |
| 并发控制 | sync.WaitGroup + sync.RWMutex | 并行组和上下文变量池的线程安全 |
前端技术栈
| 维度 | 选择 | 说明 |
|---|---|---|
| 布局 | Flexbox | 左（流程图）右（执行日志）双栏自适应 |
| 图表 | Mermaid.js v11 | 工作流 DAG 可视化，动态着色节点状态 |
| 编辑 | 纯 DOM 拖拽 | 鼠标事件 + SVG 贝塞尔连线 → 无第三方库 |
| 存储 | localStorage | 自定义工作流的持久化（JSON 序列化） |
| 实时 | fetch + Response.body.getReader() | 非 EventSource，手动解析 SSE 流式数据流 |
前端核心功能
| 功能 | 技术实现 |
|---|---|
| 工作流可视化 | Mermaid flowchart + 节点实时着色（动态修改 stroke） |
| 拖拽编辑器 | mousedown/mousemove/mouseup + 网格吸附 + SVG path 贝塞尔连线 |
| 组化步骤 | Mermaid subgraph，方向 LR，支持并行/串行标注 |
| 流式输出 | SSE llm_stream 事件 → 逐 token textContent += 到结果卡片 |
| 用户确认 | 弹窗模态框 → POST /api/confirm → context 中写入 user_feedback |
| 结果导出 | Blob + URL.createObjectURL → 下载 .txt 文件 |
| 报告格式控制 | 根据用户确认时的反馈（"禁止 Markdown" 等关键词）决定是否 stripMarkdown() |
外部 API 调用
| 服务商 | 用途 |
|---|---|
| DeepSeek Chat API | LLM 核心 |
| 博查 AI 搜索 API | 联网搜索工具 |