admin/claw
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add generated scene skill platform hardening

Browse Source
This commit is contained in:
木炎
2026-04-21 23:19:06 +08:00
parent 118fc77935
commit 956f0c2b68
439 changed files with 61974 additions and 3645 deletions
Download Patch File Download Diff File Expand all files Collapse all files

309
docs/sgClaw技术路线总览.html Normal file
View File

@@ -0,0 +1,309 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>sgClaw 智能浏览器自动化平台 - 技术路线总览</title>
<script src="https://cdn.jsdelivr.net/npm/mermaid@10.9.5/dist/mermaid.min.js"></script>
<style>
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;background:#0d1117;color:#c9d1d9;line-height:1.8}
.header{background:linear-gradient(135deg,#0a1628,#16213e,#1a3a5c);padding:3rem 2rem;text-align:center;border-bottom:3px solid #e65100}
.header h1{font-size:2.2rem;color:#e6edf3;margin-bottom:.5rem}
.header .subtitle{color:#8b949e;font-size:1rem}
.container{max-width:1300px;margin:0 auto;padding:2rem}
.section{background:#161b22;border:1px solid #30363d;border-radius:12px;margin-bottom:2rem;overflow:hidden}
.section-header{background:linear-gradient(90deg,#1a1a2e,#16213e);padding:1rem 1.5rem;border-bottom:1px solid #30363d;display:flex;align-items:center;gap:.8rem}
.section-number{background:#e65100;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}
.section-title{font-size:1.2rem;color:#e6edf3;font-weight:600}
.section-body{padding:1.5rem;overflow-x:auto}
.mermaid{display:flex;justify-content:center;padding:1rem 0}
.mermaid svg{max-width:100%;height:auto}
.desc{background:#1a1a2e;border-left:3px solid #e65100;padding:1rem 1.2rem;margin:1rem 0;border-radius:0 8px 8px 0;font-size:.95rem;color:#8b949e}
.desc strong{color:#e6edf3}
.value-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin:1rem 0}
.value-card{background:#1a1a2e;border:1px solid #30363d;border-radius:10px;padding:1.2rem}
.value-card h3{color:#e65100;font-size:1rem;margin-bottom:.5rem}
.value-card p{color:#8b949e;font-size:.9rem}
.phase-list{display:flex;flex-direction:column;gap:.8rem;margin:1rem 0}
.phase-item{display:flex;gap:1rem;align-items:flex-start;background:#1a1a2e;border-radius:10px;padding:1rem;border-left:4px solid #e65100}
.phase-badge{background:#e65100;color:#fff;padding:.3rem .8rem;border-radius:20px;font-size:.85rem;font-weight:600;white-space:nowrap}
.phase-item h4{color:#e6edf3;font-size:1rem;margin-bottom:.2rem}
.phase-item p{color:#8b949e;font-size:.9rem}
.footer{text-align:center;padding:2rem;color:#484f58;font-size:.85rem;border-top:1px solid #21262d}
</style>
</head>
<body>
<div class="header">
<h1>sgClaw 智能浏览器自动化平台</h1>
<div class="subtitle">用自然语言驱动浏览器操作 让业务流程自动执行</div>
</div>
<div class="container">
<div class="section">
<div class="section-header">
<div class="section-number">1</div>
<div class="section-title">一句话理解 sgClaw</div>
</div>
<div class="section-body">
<div class="desc">
<strong>sgClaw 是一个"智能浏览器助手"。</strong>用户用自然语言说出需求（例如"帮我查本月线损率"），sgClaw 自动在浏览器中完成点击、输入、查询、导出等一系列操作，最终将结果呈现给用户。全程无需人工逐步操作浏览器。
</div>
</div>
</div>
<div class="section">
<div class="section-header">
<div class="section-number">2</div>
<div class="section-title">整体业务流程 - 从用户指令到结果呈现</div>
</div>
<div class="section-body">
<div class="desc">
以下是用户使用 sgClaw 的完整流程。用户只需<strong>输入一句话</strong>，剩下的全部自动完成。
</div>
<div class="mermaid">
graph LR
A["用户输入自然语言指令\n例如: 帮我查本月线损率"] --> B["sgClaw 理解指令意图\n识别是哪个业务场景"]
B --> C{"是否已知场景?"}
C -->|是 已知场景| D["直接执行预设流程\n快速通道 无需AI"]
C -->|否 新场景| E["AI大模型分析理解\n拆解为具体操作步骤"]
D --> F["自动操作浏览器\n点击 输入 查询 导出"]
E --> F
F --> G["将结果呈现给用户\n生成报表 打开Excel"]
classDef userInput fill:#1a3a5c,stroke:#4a9eff,color:#e6edf3
classDef ai fill:#2d1f3d,stroke:#9c27b0,color:#e6edf3
classDef fast fill:#1f3d2d,stroke:#4caf50,color:#e6edf3
classDef action fill:#4a2c17,stroke:#e65100,color:#e6edf3
classDef result fill:#1a3a5c,stroke:#4a9eff,color:#e6edf3
class A userInput
class B ai
class C ai
class D fast
class E ai
class F action
class G result
</div>
</div>
</div>
<div class="section">
<div class="section-header">
<div class="section-number">3</div>
<div class="section-title">平台如何与现有业务系统协同工作</div>
</div>
<div class="section-body">
<div class="desc">
sgClaw <strong>不需要改造现有业务系统</strong>，它像一个坐在电脑前的员工，直接操作浏览器完成工作。
</div>
<div class="mermaid">
graph TB
User["业务人员\n分公司副主任 线损专责 班组长"]
subgraph Platform["统一业务平台"]
S1["线损大数据系统\n查询线损率 统计分析"]
S2["95598客服系统\n故障报修 工单处理"]
S3["其他业务子系统\n..."]
end
subgraph sgClaw["sgClaw 智能助手"]
SG1["理解用户自然语言指令"]
SG2["自动操作浏览器完成任务"]
SG3["安全保障 权限管控"]
end
Result["最终结果\nExcel报表 Word文档 数据展示"]
User -->|"说出需求"| SG1
SG1 --> SG2
SG1 --> SG3
SG2 -->|"自动点击查询"| S1
SG2 -->|"自动填写表单"| S2
SG2 -->|"自动导出报表"| S3
S1 -->|"数据返回"| SG2
S2 -->|"数据返回"| SG2
S3 -->|"数据返回"| SG2
SG2 -->|"生成报表文件"| Result
Result -->|"展示给用户"| User
classDef people fill:#1a3a5c,stroke:#4a9eff,color:#e6edf3
classDef plat fill:#2d1f3d,stroke:#9c27b0,color:#e6edf3
classDef sg fill:#4a2c17,stroke:#e65100,color:#e6edf3
classDef out fill:#1f3d2d,stroke:#4caf50,color:#e6edf3
class User people
class Platform,S1,S2,S3 plat
class sgClaw,SG1,SG2,SG3 sg
class Result out
</div>
</div>
</div>
<div class="section">
<div class="section-header">
<div class="section-number">4</div>
<div class="section-title">安全管控体系</div>
</div>
<div class="section-body">
<div class="desc">
sgClaw 建立了<strong>三道安全防线</strong>，确保即使在AI驱动下，所有操作也在可控范围内。
</div>
<div class="mermaid">
graph TB
A["第一道防线\n身份确认: 确保通信双方可信"] --> B["第二道防线\n规则校验: 只能访问允许的系统和页面"]
B --> C["第三道防线\n二次复核: 操作前再次确认合法性"]
C --> D["最终结果\n所有操作可追溯 可审计"]
classDef l1 fill:#1a3a5c,stroke:#4a9eff,color:#e6edf3
classDef l2 fill:#4a2c17,stroke:#e65100,color:#e6edf3
classDef l3 fill:#2d1f3d,stroke:#9c27b0,color:#e6edf3
classDef ok fill:#1f3d2d,stroke:#4caf50,color:#e6edf3
class A l1
class B l2
class C l3
class D ok
</div>
</div>
</div>
<div class="section">
<div class="section-header">
<div class="section-number">5</div>
<div class="section-title">两种运行模式</div>
</div>
<div class="section-body">
<div class="desc">
sgClaw 支持两种运行方式，适应不同场景需求。
</div>
<div class="mermaid">
graph LR
subgraph Mode1["模式一: 嵌入式 浏览器子进程模式"]
M1A["浏览器启动sgClaw"]
M1B["一问一答式通信"]
M1C["适合单次任务执行"]
M1A --> M1B --> M1C
end
subgraph Mode2["模式二: 独立服务模式"]
M2A["sgClaw作为持久化服务运行"]
M2B["前端网页随时连接使用"]
M2C["适合频繁交互使用"]
M2A --> M2B --> M2C
end
classDef m1 fill:#1a3a5c,stroke:#4a9eff,color:#e6edf3
classDef m2 fill:#2d1f3d,stroke:#9c27b0,color:#e6edf3
class Mode1,M1A,M1B,M1C m1
class Mode2,M2A,M2B,M2C m2
</div>
</div>
</div>
<div class="section">
<div class="section-header">
<div class="section-number">6</div>
<div class="section-title">技术演进路线</div>
</div>
<div class="section-body">
<div class="phase-list">
<div class="phase-item">
<div class="phase-badge">第一阶段</div>
<div>
<h4>基础能力构建</h4>
<p>完成浏览器基础操作能力（点击、输入、导航、读取页面内容），建立安全管控体系，实现与现有业务平台的对接。</p>
</div>
</div>
<div class="phase-item">
<div class="phase-badge">第二阶段</div>
<div>
<h4>AI智能驱动</h4>
<p>接入AI大模型，支持自然语言理解，用户用日常语言描述需求，AI自动拆解为操作步骤并执行。</p>
</div>
</div>
<div class="phase-item">
<div class="phase-badge">第三阶段</div>
<div>
<h4>业务场景沉淀</h4>
<p>将高频使用的场景沉淀为标准化技能包（如线损查询、故障统计、周报生成等），实现快速执行，减少对AI的依赖。</p>
</div>
</div>
<div class="phase-item">
<div class="phase-badge">第四阶段</div>
<div>
<h4>平台化服务</h4>
<p>从单次任务执行升级为持久化服务，支持多用户并发使用，建立完整的技能市场和任务编排体系。</p>
</div>
</div>
</div>
</div>
</div>
<div class="section">
<div class="section-header">
<div class="section-number">7</div>
<div class="section-title">核心价值</div>
</div>
<div class="section-body">
<div class="value-grid">
<div class="value-card">
<h3>效率提升</h3>
<p>原来需要人工逐步操作浏览器完成的任务，现在只需一句话，自动完成查询、导出、报表生成全流程。</p>
</div>
<div class="value-card">
<h3>零改造接入</h3>
<p>不需要改造现有业务系统，sgClaw像员工一样直接操作浏览器，对现有系统零侵入。</p>
</div>
<div class="value-card">
<h3>安全可控</h3>
<p>三道安全防线确保所有操作在允许范围内，域名白名单、动作管控、二次复核，全程可追溯。</p>
</div>
<div class="value-card">
<h3>灵活扩展</h3>
<p>新业务场景通过编写技能包快速接入，已有场景走快速通道无需AI，兼顾效率和灵活性。</p>
</div>
<div class="value-card">
<h3>技术自主</h3>
<p>核心代码自主可控，基于Rust语言构建，性能优异，不依赖外部SaaS服务，数据安全有保障。</p>
</div>
<div class="value-card">
<h3>持续演进</h3>
<p>从单任务执行到持久化服务，从人工指令到AI驱动，技术路线清晰，逐步构建平台化能力。</p>
</div>
</div>
</div>
</div>
<div class="section">
<div class="section-header">
<div class="section-number">8</div>
<div class="section-title">典型使用场景举例</div>
</div>
<div class="section-body">
<div class="desc">
以下是业务人员日常使用 sgClaw 的真实场景。
</div>
<div class="mermaid">
graph TB
U1["线损专责\n每月查询线损率统计数据"] -->|"输入: 帮我查本月线损率"| SG1["sgClaw自动完成\n打开线损系统 选择月份 查询数据 导出Excel"]
U2["供电所班组长\n每周生成线损分析周报"] -->|"输入: 生成上周线损周报"| SG2["sgClaw自动完成\n查询周数据 汇总分析 生成Word报告"]
U3["客服专责\n处理95598故障工单统计"] -->|"输入: 统计本周故障工单"| SG3["sgClaw自动完成\n登录客服系统 筛选工单 生成统计表"]
classDef user fill:#1a3a5c,stroke:#4a9eff,color:#e6edf3
classDef sg fill:#4a2c17,stroke:#e65100,color:#e6edf3
class U1,U2,U3 user
class SG1,SG2,SG3 sg
</div>
</div>
</div>
</div>
<div class="footer">sgClaw 智能浏览器自动化平台 - 技术路线总览 - 2026年4月</div>
<script>
mermaid.initialize({ startOnLoad:true, theme:'dark', securityLevel:'loose', logLevel:'warn' });
</script>
</body>
</html>