Coverage for agentos/cli/config_panel.py: 16%
154 statements
« prev ^ index » next coverage.py v7.14.3, created at 2026-07-06 19:15 +0800
1"""
2AgentOS 配置面板 — Web GUI，一键浏览器配置 API Key。
3启动: agentos config-panel
4访问: http://localhost:18480
5"""
7from __future__ import annotations
9import http.server
10import json
11import os
12import sys
13import webbrowser
14from pathlib import Path
16CONFIG_DIR = Path.home() / ".agentos"
17CONFIG_FILE = CONFIG_DIR / "config.yaml"
18ENV_FILE = CONFIG_DIR / ".env"
20CSS = """
21* { margin: 0; padding: 0; box-sizing: border-box; }
22body {
23 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
24 "Microsoft YaHei", "Helvetica Neue", sans-serif;
25 background: linear-gradient(135deg, #0f0c29, #302b63, #24243e);
26 min-height: 100vh; color: #e0e0e0; padding: 24px;
27}
28.container { max-width: 720px; margin: 0 auto; }
29.header {
30 text-align: center; padding: 40px 0 32px;
31}
32.header h1 {
33 font-size: 28px; font-weight: 700;
34 background: linear-gradient(90deg, #667eea, #764ba2);
35 -webkit-background-clip: text; -webkit-text-fill-color: transparent;
36}
37.header p { color: #a0a0b8; margin-top: 8px; font-size: 14px; }
38.card {
39 background: rgba(255,255,255,0.06);
40 backdrop-filter: blur(12px);
41 border: 1px solid rgba(255,255,255,0.10);
42 border-radius: 16px; padding: 28px; margin-bottom: 20px;
43 transition: border-color 0.2s;
44}
45.card:hover { border-color: rgba(102,126,234,0.4); }
46.card h3 {
47 font-size: 17px; font-weight: 600; margin-bottom: 6px;
48 display: flex; align-items: center; gap: 10px;
49}
50.card h3 .badge {
51 font-size: 11px; font-weight: 500; padding: 2px 8px; border-radius: 10px;
52}
53.badge-recommend { background: #667eea22; color: #667eea; }
54.badge cheap { background: #4caf5022; color: #4caf50; }
55.badge strong { background: #ff980022; color: #ff9800; }
56.card .desc { color: #9090a8; font-size: 13px; margin-bottom: 14px; line-height: 1.6; }
57.card .info-row {
58 display: flex; gap: 20px; margin-bottom: 14px; flex-wrap: wrap;
59}
60.card .info-item {
61 font-size: 12px; color: #808098;
62}
63.card .info-item strong { color: #c0c0d0; font-weight: 600; }
64.input-row { display: flex; gap: 10px; }
65.input-row input {
66 flex: 1; padding: 10px 14px;
67 background: rgba(0,0,0,0.25); border: 1px solid rgba(255,255,255,0.12);
68 border-radius: 10px; color: #e0e0e0; font-size: 14px;
69 outline: none; transition: border-color 0.2s;
70}
71.input-row input:focus { border-color: #667eea; }
72.input-row input::placeholder { color: #555; }
73.btn {
74 padding: 10px 20px; border-radius: 10px; border: none;
75 font-size: 14px; font-weight: 600; cursor: pointer;
76 transition: all 0.2s;
77}
78.btn-primary { background: linear-gradient(135deg, #667eea, #764ba2); color: #fff; }
79.btn-primary:hover { filter: brightness(1.1); transform: translateY(-1px); }
80.btn-outline {
81 background: transparent; border: 1px solid rgba(255,255,255,0.15);
82 color: #c0c0d8;
83}
84.btn-outline:hover { background: rgba(255,255,255,0.06); }
85.btn-success { background: #4caf50; color: #fff; }
86.status { font-size: 12px; margin-top: 8px; height: 20px; }
87.status-ok { color: #4caf50; }
88.status-err { color: #f44336; }
89.status-checking { color: #ff9800; }
90.status-bar {
91 text-align: center; margin-top: 24px; padding: 16px;
92 background: rgba(76,175,80,0.10); border-radius: 12px;
93 font-size: 14px; color: #81c784;
94}
95.status-bar.warning {
96 background: rgba(255,152,0,0.10); color: #ffb74d;
97}
98.footer { text-align: center; padding: 24px; color: #606078; font-size: 12px; }
99"""
101HTML = """<!DOCTYPE html>
102<html lang="zh-CN">
103<head>
104<meta charset="utf-8">
105<meta name="viewport" content="width=device-width, initial-scale=1">
106<title>AgentOS 配置面板</title>
107<style>{css}</style>
108</head>
109<body>
110<div class="container">
111 <div class="header">
112 <h1>🔧 AgentOS 配置面板</h1>
113 <p>选择一个 AI 服务商，填入 API Key，30 秒完成配置</p>
114 </div>
116 <!-- OpenAI -->
117 <div class="card" id="card-openai">
118 <h3>
119 <span>🔵 OpenAI</span>
120 <span class="badge badge-recommend">推荐</span>
121 </h3>
122 <div class="desc">
123 最成熟的 AI 服务商，提供 GPT-4o、GPT-4o-mini 等模型。
124 适合日常对话、代码生成、文档处理，中英文均出色。响应快、稳定性高。
125 </div>
126 <div class="info-row">
127 <div class="info-item">默认模型: <strong>gpt-4o-mini</strong></div>
128 <div class="info-item">费用: <strong>低 ~ 中（约 $0.15/百万token）</strong></div>
129 <div class="info-item">注册: <a href="https://platform.openai.com/api-keys"
130 target="_blank" style="color:#667eea">platform.openai.com</a></div>
131 <div class="input-row">
132 <input type="password" id="key-openai" placeholder="粘贴你的 OpenAI API Key（以 sk- 开头）">
133 <button class="btn btn-primary" onclick="save('openai')">保存并验证</button>
134 <button class="btn btn-outline" onclick="verify('openai')">仅验证</button>
135 </div>
136 <div class="status" id="status-openai"></div>
137 </div>
139 <!-- DeepSeek -->
140 <div class="card" id="card-deepseek">
141 <h3>
142 <span>🟢 DeepSeek</span>
143 <span class="badge cheap">最实惠</span>
144 </h3>
145 <div class="desc">
146 国产高性价比 AI 服务商，deepseek-chat 模型在中文理解和代码生成方面表现突出。
147 价格极低（约为 OpenAI 的 1/10），适合高频调用和预算敏感的场景。
148 </div>
149 <div class="info-row">
150 <div class="info-item">默认模型: <strong>deepseek-chat</strong></div>
151 <div class="info-item">费用: <strong>极低（约 ¥1/百万token）</strong></div>
152 </div>
153 <input type="password" id="key-deepseek" placeholder="粘贴你的 DeepSeek API Key（以 sk- 开头）">
154 <button class="btn btn-primary" onclick="save('deepseek')">保存并验证</button>
155 <button class="btn btn-outline" onclick="verify('deepseek')">仅验证</button>
156 </div>
157 <div class="status" id="status-deepseek"></div>
158 </div>
160 <!-- Anthropic -->
161 <div class="card" id="card-anthropic">
162 <h3>
163 <span>🟣 Anthropic (Claude)</span>
164 <span class="badge strong">最强推理</span>
165 </h3>
166 <div class="desc">
167 Claude 系列擅长深度推理、长篇分析和安全对齐，创意写作和复杂逻辑任务表现顶级。
168 适合需要深度思考的场景，如研究分析、合规审查、长文生成。
169 </div>
170 <div class="info-row">
171 <div class="info-item">默认模型: <strong>claude-sonnet-4</strong></div>
172 <div class="info-item">费用: <strong>中 ~ 高（约 $3/百万token）</strong></div>
173 </div>
174 <div class="input-row">
175 <button class="btn btn-primary" onclick="save('anthropic')">保存并验证</button>
176 <button class="btn btn-outline" onclick="verify('anthropic')">仅验证</button>
177 </div>
178 <div class="status" id="status-anthropic"></div>
179 </div>
181 <!-- 整体状态 -->
182 <div id="global-status" class="status-bar">
183 未配置任何服务商。选择一个并填入 API Key 开始使用。
184 </div>
186 <div class="footer">
187 <p>API Key 安全保存在本地 <code>~/.agentos/</code> 目录中，不会上传到任何服务器。</p>
188 <p>配置完成后可在终端运行 <code>agentos "你的任务"</code> 开始使用。</p>
189 </div>
190</div>
192<script>
193// 页面加载时检查当前配置
194async function checkStatus() {{
195 const resp = await fetch('/api/status');
196 const data = await resp.json();
197 for (const p of ['openai', 'deepseek', 'anthropic']) {{
198 if (data[p] && data[p].configured) {{
199 setStatus(p, 'ok', '已配置 ✅');
200 document.getElementById('key-' + p).value = data[p].preview || '';
201 }}
202 }}
203 updateGlobalStatus(data);
204}}
206async function save(provider) {{
207 const key = document.getElementById('key-' + provider).value.trim();
208 if (!key) {{ setStatus(provider, 'err', '请输入 API Key'); return; }}
209 setStatus(provider, 'checking', '正在验证...');
210 const resp = await fetch('/api/save', {{
211 method: 'POST',
212 headers: {{'Content-Type': 'application/json'}},
213 body: JSON.stringify({{provider, key}})
214 }});
215 const data = await resp.json();
216 if (data.ok) {{
217 setStatus(provider, 'ok', '配置成功 ✅ — ' + (data.model || ''));
218 }} else {{
219 setStatus(provider, 'err', '失败: ' + (data.error || '未知错误'));
220 }}
221 updateGlobalStatus(data);
222}}
224async function verify(provider) {{
225 const key = document.getElementById('key-' + provider).value.trim();
226 if (!key) {{ setStatus(provider, 'err', '请先输入 API Key'); return; }}
227 setStatus(provider, 'checking', '正在验证...');
228 const resp = await fetch('/api/verify', {{
229 method: 'POST',
230 headers: {{'Content-Type': 'application/json'}},
231 body: JSON.stringify({{provider, key}})
232 }});
233 const data = await resp.json();
234 if (data.valid) {{
235 setStatus(provider, 'ok', 'Key 有效 ✅');
236 }} else {{
237 setStatus(provider, 'err', 'Key 无效: ' + (data.error || ''));
238 }}
239}}
241function setStatus(provider, cls, msg) {{
242 const el = document.getElementById('status-' + provider);
243 el.className = 'status status-' + cls;
244 el.textContent = msg;
245}}
247async function updateGlobalStatus(data) {{
248 const el = document.getElementById('global-status');
249 const configured = [];
250 if (data.openai && data.openai.configured) configured.push('OpenAI');
251 if (data.deepseek && data.deepseek.configured) configured.push('DeepSeek');
252 if (data.anthropic && data.anthropic.configured) configured.push('Anthropic');
254 if (configured.length > 0) {{
255 el.className = 'status-bar';
256 el.innerHTML = '✅ 已配置: ' + configured.join('、') +
257 ' 。在终端运行 <code>agentos "你的任务"</code> 开始使用。';
258 }} else {{
259 el.className = 'status-bar warning';
260 el.textContent = '未配置任何服务商。选择一个并填入 API Key 完成配置。';
261 }}
262}}
264checkStatus();
265</script>
266</body>
267</html>
268"""
270API_TEMPLATE = {
271 "openai": {
272 "env_var": "OPENAI_API_KEY",
273 "label": "OpenAI",
274 "default_model": "gpt-4o-mini",
275 "website": "https://platform.openai.com/api-keys",
276 "key_prefix": "sk-",
277 },
278 "deepseek": {
279 "env_var": "DEEPSEEK_API_KEY",
280 "label": "DeepSeek",
281 "default_model": "deepseek-chat",
282 "website": "https://platform.deepseek.com/api_keys",
283 "key_prefix": "sk-",
284 },
285 "anthropic": {
286 "env_var": "ANTHROPIC_API_KEY",
287 "label": "Anthropic",
288 "default_model": "claude-sonnet-4",
289 "website": "https://console.anthropic.com/keys",
290 "key_prefix": "sk-ant-",
291 },
292}
295def _get_status_dict() -> dict:
296 """获取所有 Provider 的配置状态。"""
297 status = {}
298 for name, info in API_TEMPLATE.items():
299 key = os.environ.get(info["env_var"], "")
300 if not key and ENV_FILE.exists():
301 for line in ENV_FILE.read_text().splitlines():
302 if line.startswith(info["env_var"] + "="):
303 val = line.split("=", 1)[1].strip()
304 if val and val != "sk-xxx":
305 key = val
306 break
307 preview = ""
308 if key:
309 preview = key[:8] + "..." + key[-4:] if len(key) > 20 else key
310 status[name] = {
311 "configured": bool(key),
312 "preview": preview,
313 }
314 return status
317def _test_connection(provider: str, api_key: str) -> tuple[bool, str]:
318 """测试 API 连接。"""
319 try:
320 import httpx
322 if provider == "openai":
323 resp = httpx.get(
324 "https://api.openai.com/v1/models",
325 headers={"Authorization": f"Bearer {api_key}"},
326 timeout=10,
327 )
328 if resp.status_code == 200:
329 return True, ""
330 elif resp.status_code == 401:
331 return False, "API Key 无效（401 未授权）"
332 elif resp.status_code == 429:
333 return False, "请求过于频繁，请稍后重试"
334 else:
335 return False, f"返回状态码 {resp.status_code}，请检查 Key 是否有对应权限"
336 elif provider == "deepseek":
337 resp = httpx.post(
338 "https://api.deepseek.com/chat/completions",
339 headers={
340 "Authorization": f"Bearer {api_key}",
341 "Content-Type": "application/json",
342 },
343 json={
344 "model": "deepseek-chat",
345 "messages": [{"role": "user", "content": "hi"}],
346 "max_tokens": 1,
347 },
348 timeout=10,
349 )
350 if resp.status_code == 200:
351 return True, ""
352 elif resp.status_code == 401:
353 return False, "API Key 无效（401 未授权）"
354 elif resp.status_code == 402:
355 return False, "账户余额不足，请充值"
356 else:
357 return False, f"返回状态码 {resp.status_code}，请检查"
358 elif provider == "anthropic":
359 resp = httpx.post(
360 "https://api.anthropic.com/v1/messages",
361 headers={
362 "x-api-key": api_key,
363 "anthropic-version": "2023-06-01",
364 "Content-Type": "application/json",
365 },
366 json={
367 "model": "claude-sonnet-4-20250514",
368 "max_tokens": 1,
369 "messages": [{"role": "user", "content": "hi"}],
370 },
371 timeout=10,
372 )
373 if resp.status_code == 200:
374 return True, ""
375 elif resp.status_code == 401:
376 return False, "API Key 无效（401 未授权）"
377 else:
378 return False, f"返回状态码 {resp.status_code}，请检查"
379 except Exception as e:
380 return False, f"网络连接失败: {str(e)}"
383def _save_config(provider: str, api_key: str):
384 """保存配置到 ~/.agentos/。"""
385 CONFIG_DIR.mkdir(parents=True, exist_ok=True)
386 info = API_TEMPLATE[provider]
388 # Update .env
389 env_lines = []
390 if ENV_FILE.exists():
391 env_lines = ENV_FILE.read_text().splitlines()
392 found = False
393 new_env = []
394 for line in env_lines:
395 if line.startswith(info["env_var"] + "="):
396 new_env.append(f"{info['env_var']}={api_key}")
397 found = True
398 else:
399 new_env.append(line)
400 if not found:
401 new_env.append(f"{info['env_var']}={api_key}")
402 ENV_FILE.write_text("\n".join(new_env) + "\n")
404 # Update config.yaml
405 config = {"version": "1.4.1", "active_provider": provider}
406 import yaml
408 if CONFIG_FILE.exists():
409 existing = yaml.safe_load(CONFIG_FILE.read_text())
410 if existing and "providers" in existing:
411 config["providers"] = existing["providers"]
412 if "providers" not in config:
413 config["providers"] = {}
414 config["providers"][provider] = {"env_var": info["env_var"]}
415 with open(CONFIG_FILE, "w") as f:
416 yaml.dump(config, f, default_flow_style=False)
418 # Set env var for current process
419 os.environ[info["env_var"]] = api_key
422class PanelHandler(http.server.BaseHTTPRequestHandler):
423 """HTTP 请求处理。"""
425 def log_message(self, format, *args):
426 pass # 静默
428 def do_GET(self):
429 if self.path == "/" or self.path == "/index.html":
430 html = HTML.format(css=CSS)
431 self._send_html(html)
432 elif self.path == "/api/status":
433 status = _get_status_dict()
434 self._send_json(status)
435 else:
436 self.send_error(404)
438 def do_POST(self):
439 if self.path == "/api/save":
440 body = self._read_body()
441 provider = body.get("provider", "")
442 key = body.get("key", "")
443 if provider not in API_TEMPLATE:
444 self._send_json({"ok": False, "error": "未知服务商"})
445 return
446 ok, err = _test_connection(provider, key)
447 if ok:
448 _save_config(provider, key)
449 info = API_TEMPLATE[provider]
450 self._send_json(
451 {
452 "ok": True,
453 "model": info["default_model"],
454 }
455 )
456 else:
457 self._send_json({"ok": False, "error": err})
458 elif self.path == "/api/verify":
459 body = self._read_body()
460 provider = body.get("provider", "")
461 key = body.get("key", "")
462 if provider not in API_TEMPLATE:
463 self._send_json({"valid": False, "error": "未知服务商"})
464 return
465 ok, err = _test_connection(provider, key)
466 self._send_json({"valid": ok, "error": err})
467 else:
468 self.send_error(404)
470 def _send_html(self, html: str):
471 self.send_response(200)
472 self.send_header("Content-Type", "text/html; charset=utf-8")
473 self.end_headers()
474 self.wfile.write(html.encode("utf-8"))
476 def _send_json(self, data: dict):
477 self.send_response(200)
478 self.send_header("Content-Type", "application/json; charset=utf-8")
479 self.end_headers()
480 self.wfile.write(json.dumps(data, ensure_ascii=False).encode("utf-8"))
482 def _read_body(self) -> dict:
483 length = int(self.headers.get("Content-Length", 0))
484 raw = self.rfile.read(length).decode("utf-8") if length else "{}"
485 return json.loads(raw)
488def start_panel(port: int = 18480, open_browser: bool = True):
489 """启动配置面板 HTTP 服务。"""
490 server = http.server.HTTPServer(("127.0.0.1", port), PanelHandler)
491 url = f"http://127.0.0.1:{port}"
493 print(f"""
494 ╔══════════════════════════════════════════════╗
495 ║ AgentOS 配置面板已启动 ║
496 ╠══════════════════════════════════════════════╣
497 ║ ║
498 ║ 访问地址: {url} ║
499 ║ ║
500 ║ 按 Ctrl+C 停止服务 ║
501 ╚══════════════════════════════════════════════╝
502""")
504 if open_browser:
505 try:
506 webbrowser.open(url)
507 print(" 已自动打开浏览器。如未打开，请手动访问上方地址。\n")
508 except Exception:
509 print(" 请手动在浏览器中打开上方地址。\n")
511 try:
512 server.serve_forever()
513 except KeyboardInterrupt:
514 print("\n 配置面板已关闭。\n")
515 server.server_close()
518if __name__ == "__main__":
519 port = int(sys.argv[1]) if len(sys.argv) > 1 else 18480
520 start_panel(port)