JOJO
56697a04ed
- 修复窄屏 git clone 块横向溢出撑破整页（hero-clone max-width + code 块内横滚） - 顶栏：移动端保留 GitHub 入口；Astrion 标题改为星空开关按钮（停 rAF + 隐藏画布，卡顿排查用） - 演示区：废弃 IntersectionObserver 懒加载，改为「点击预览」手动触发（移动端卡顿定位） - 文档：沙箱平台口径——macOS/Windows 已实测，Linux 未测试未适配暂不可用（02/05 章中英四份） Co-authored-by: Astrion powered by Kimi-K3 <astrion-agent@users.noreply.github.com>
227 lines
14 KiB
HTML
227 lines
14 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<!-- 防首帧白闪：外链 site.css 加载前浏览器默认画布纯白；内联深空底色 + dark color-scheme，
|
||
与 site.css 的 html 渐变底色同源（--bg-0），CSS 就绪后自然衔接（渐变在同色之上展开）。 -->
|
||
<style>html { background-color: #0c1120; color-scheme: dark; }</style>
|
||
<title>Astrion</title>
|
||
<meta name="description" content="Astrion 是开源、自托管的智能体工作台：在本机处理你的代码与工作，也可以部署到云端提供多人服务，体验一致。" />
|
||
<link rel="icon" type="image/svg+xml" href="/static/astrion-avatar.svg" />
|
||
<link rel="stylesheet" href="/site-assets/astrion-avatar.css" />
|
||
<link rel="stylesheet" href="/site-assets/anim-shared.css" />
|
||
<link rel="stylesheet" href="/site-assets/anim-sandbox.css" />
|
||
<link rel="stylesheet" href="/site-assets/anim-records.css" />
|
||
<link rel="stylesheet" href="/site-assets/anim-version.css" />
|
||
<link rel="stylesheet" href="/site-assets/site.css" />
|
||
</head>
|
||
<body>
|
||
|
||
<canvas id="starfield" aria-hidden="true"></canvas>
|
||
|
||
<!-- ───────────────── 顶栏 ───────────────── -->
|
||
<header class="topbar" id="topbar">
|
||
<div class="topbar-inner">
|
||
<!-- 标题即星空开关（移动端卡顿排查用）：点击关闭/开启背景星空，关闭态见 .stars-off -->
|
||
<button class="brand" id="brandToggle" type="button" data-i18n-aria="brand.toggleAria" aria-label="关闭或开启星空背景" data-i18n-attr-title="brand.toggleTitle" title="点击关闭 / 开启星空背景" aria-pressed="true">
|
||
<span class="brand-name">Astrion</span>
|
||
</button>
|
||
<nav class="topnav">
|
||
<a class="topnav-link" href="#features" data-i18n="nav.features">功能</a>
|
||
<a class="topnav-link" href="#faq">FAQ</a>
|
||
<a class="topnav-link" href="/docs.html" data-i18n="nav.docs">文档</a>
|
||
<a class="topnav-link topnav-link--keep" href="https://github.com/JOJO6618/astrion" target="_blank" rel="noopener">GitHub</a>
|
||
<a class="btn btn-primary btn-sm" href="https://agent.cyjai.com">Try Astrion</a>
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
|
||
<!-- ───────────────── 总览 ───────────────── -->
|
||
<section class="hero">
|
||
<div class="hero-inner">
|
||
<div class="hero-title-row">
|
||
<h1 class="hero-title">Astrion<span class="hero-mascot" id="heroMascot" aria-hidden="true"></span></h1>
|
||
</div>
|
||
<p class="hero-sub" data-i18n="hero.sub">住在你机器上的智能体工作台。开源、自托管，可以处理你的本地代码和工作，也可以部署在云端提供多人服务，体验一致。</p>
|
||
<button class="hero-clone" id="heroClone" type="button" data-i18n-aria="hero.cloneAria" aria-label="复制 git clone 命令">
|
||
<code>git clone https://github.com/JOJO6618/astrion.git</code>
|
||
<span class="hero-clone-sep" aria-hidden="true"></span>
|
||
<span class="hero-clone-icon" aria-hidden="true"><svg class="icon-copy" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg><svg class="icon-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg></span>
|
||
</button>
|
||
<div class="hero-actions">
|
||
<a class="btn btn-ghost" href="/docs.html" data-i18n="hero.docs">查看文档</a>
|
||
</div>
|
||
<p class="hero-platforms">
|
||
<span class="platform">Terminal <em>(beta)</em></span>
|
||
<span class="platform-sep"></span>
|
||
<span class="platform">Web</span>
|
||
<span class="platform-sep"></span>
|
||
<span class="platform">Windows</span>
|
||
<span class="platform-sep"></span>
|
||
<span class="platform">macOS</span>
|
||
<span class="platform-sep"></span>
|
||
<span class="platform">Android</span>
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ───────────────── 演示 ───────────────── -->
|
||
<section class="demo" id="demo">
|
||
<div class="section-head">
|
||
<p class="eyebrow">Demo</p>
|
||
<h2 class="section-title" data-i18n="demo.title">它工作时的样子</h2>
|
||
<p class="section-sub" data-i18n="demo.sub">下面是真实运行的 Astrion 界面，接着一份静态演示数据。可以点击切换对话、展开工具记录、打开右侧快捷窗口查看子智能体。</p>
|
||
</div>
|
||
<div class="demo-frame-wrap">
|
||
<div class="demo-frame" id="demoFrame">
|
||
<!-- 演示壳较重（main.js 2.1MB）：不做任何自动加载——点「点击预览」才注入 src 开始渲染；
|
||
site.js fitDemo 先撑占位高度避免跳动；子文档 ready 后占位层隐藏（.demo-preview--hidden） -->
|
||
<iframe id="demoIframe" data-src="/demo.html" data-i18n-attr-title="demo.iframeTitle" title="Astrion 界面演示"></iframe>
|
||
<div class="demo-preview" id="demoPreview">
|
||
<button class="demo-preview-btn" id="demoPreviewBtn" type="button" data-i18n="demo.preview">点击预览</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<p class="demo-note" data-i18n="demo.note">演示环境只含静态数据；实际使用由你自己的模型驱动。</p>
|
||
</section>
|
||
|
||
<!-- ───────────────── 特色功能 ───────────────── -->
|
||
<section class="features" id="features">
|
||
<div class="section-head">
|
||
<p class="eyebrow">Features</p>
|
||
<h2 class="section-title" data-i18n="features.title">围绕「放心交给它做事」设计</h2>
|
||
</div>
|
||
|
||
<div class="feature-list">
|
||
|
||
<div class="feature-row feature-row--anim">
|
||
<div class="feature-text">
|
||
<p class="feature-index">01</p>
|
||
<h3 class="feature-title" data-i18n="f1.title">计划 / 询问 / 执行</h3>
|
||
<p class="feature-desc" data-i18n-html="f1.desc">三种运行模式决定它什么时候动手。<br>计划模式只出方案，批准后才开始改；<br>询问模式先讨论清楚再开工；<br>执行模式直接做完再汇报。</p>
|
||
</div>
|
||
<div class="feature-anim" id="animModes" aria-hidden="true"></div>
|
||
</div>
|
||
|
||
<div class="feature-row feature-row--anim">
|
||
<div class="feature-text">
|
||
<p class="feature-index">02</p>
|
||
<h3 class="feature-title" data-i18n="f2.title">沙箱与网络授权</h3>
|
||
<p class="feature-desc" data-i18n-html="f2.desc">命令默认在操作系统沙箱里执行，写文件、访问网络都要经过授权。<br>macOS 使用系统沙箱，Windows 通过 WSL2 获得完整隔离；<br>网络权限单独开关，与文件权限互不影响。</p>
|
||
</div>
|
||
<div class="feature-anim" id="animSandbox" aria-hidden="true"></div>
|
||
</div>
|
||
|
||
<div class="feature-row feature-row--anim">
|
||
<div class="feature-text">
|
||
<p class="feature-index">03</p>
|
||
<h3 class="feature-title" data-i18n="f3.title">修改记录</h3>
|
||
<p class="feature-desc" data-i18n-html="f3.desc">每一次文件编辑都留下一条 diff：<br>改了哪个文件、加了几行、删了几行。<br>按任务逐条查看，也可以单独撤销其中任意一次修改。</p>
|
||
</div>
|
||
<div class="feature-anim" id="animRecords" aria-hidden="true"></div>
|
||
</div>
|
||
|
||
<div class="feature-row feature-row--anim">
|
||
<div class="feature-text">
|
||
<p class="feature-index">04</p>
|
||
<h3 class="feature-title" data-i18n="f4.title">版本控制</h3>
|
||
<p class="feature-desc" data-i18n-html="f4.desc">每条消息自动成为一个检查点。<br>发现方向不对时，回退到任意一条消息之前——<br>对话和文件一起还原，不用手工收拾残局。</p>
|
||
</div>
|
||
<div class="feature-anim" id="animVersion" aria-hidden="true"></div>
|
||
</div>
|
||
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ───────────────── FAQ ───────────────── -->
|
||
<section class="faq" id="faq">
|
||
<div class="section-head">
|
||
<p class="eyebrow">FAQ</p>
|
||
<h2 class="section-title" data-i18n="faq.title">常见问题</h2>
|
||
</div>
|
||
<div class="faq-list">
|
||
|
||
<details class="faq-item">
|
||
<summary class="faq-q"><span data-i18n="faq1.q">运行 Astrion 需要什么环境？</span><span class="faq-icon"></span></summary>
|
||
<div class="faq-a"><p data-i18n-html="faq1.a">Python 3.9+ 和 Node.js 18+。克隆仓库后安装依赖、构建前端，一条命令启动，默认监听 8091 端口。macOS、Linux、Windows（WSL2）都可以运行。</p></div>
|
||
</details>
|
||
|
||
<details class="faq-item">
|
||
<summary class="faq-q"><span data-i18n="faq2.q">我的数据存在哪里？</span><span class="faq-icon"></span></summary>
|
||
<div class="faq-a"><p data-i18n-html="faq2.a">全部在你自己的机器上：对话记录、工作区文件、日志默认放在 <code>~/.astrion/astrion/</code> 下，可以通过环境变量整体搬迁。不经过任何第三方服务器。</p></div>
|
||
</details>
|
||
|
||
<details class="faq-item">
|
||
<summary class="faq-q"><span data-i18n="faq3.q">宿主机模式和 Docker 模式有什么区别？</span><span class="faq-icon"></span></summary>
|
||
<div class="faq-a"><p data-i18n-html="faq3.a">宿主机模式下 Astrion 直接操作你的本机文件，适合处理日常工作和本地代码；Docker 模式把任务放进容器执行，适合需要隔离或多人共用的部署。两种模式界面与能力一致，数据可以互通。</p></div>
|
||
</details>
|
||
|
||
<details class="faq-item">
|
||
<summary class="faq-q"><span data-i18n="faq4.q">支持哪些模型？</span><span class="faq-icon"></span></summary>
|
||
<div class="faq-a"><p data-i18n-html="faq4.a">任何 OpenAI 兼容接口都可以接入：官方 API、聚合网关、本地推理服务都行。主智能体和子智能体可以分别配置不同的模型。</p></div>
|
||
</details>
|
||
|
||
<details class="faq-item">
|
||
<summary class="faq-q"><span data-i18n="faq5.q">可以部署给多人使用吗？</span><span class="faq-icon"></span></summary>
|
||
<div class="faq-a"><p data-i18n-html="faq5.a">可以。部署到服务器后自带多用户体系，每人独立工作区，通过浏览器访问，也有 Android 客户端。同一套界面，本机和云端体验一致。</p></div>
|
||
</details>
|
||
|
||
<details class="faq-item">
|
||
<summary class="faq-q"><span data-i18n="faq6.q">它执行命令安全吗？</span><span class="faq-icon"></span></summary>
|
||
<div class="faq-a"><p data-i18n-html="faq6.a">有四层控制：权限模式决定哪些操作需要批准；命令默认在 OS 沙箱内运行；网络访问单独授权；所有文件修改留有记录可以随时回退。你可以从「每条命令都要批准」一路调到「完全放开」，粒度自己定。</p></div>
|
||
</details>
|
||
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ───────────────── 联系我 ───────────────── -->
|
||
<section class="contact" id="contact">
|
||
<div class="section-head">
|
||
<p class="eyebrow">Contact</p>
|
||
<h2 class="section-title" data-i18n="contact.title">联系我</h2>
|
||
<p class="contact-sub" data-i18n="contact.sub">有问题、想法或合作意向，欢迎来信。</p>
|
||
</div>
|
||
<div class="contact-row">
|
||
<div class="contact-mailbox">
|
||
<a class="contact-mail" href="mailto:yao884417@outlook.com">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
|
||
<span class="contact-mail-addr">yao884417@outlook.com</span>
|
||
</a>
|
||
<span class="contact-mail-sep" aria-hidden="true"></span>
|
||
<button class="contact-copy" id="contactCopy" type="button" data-i18n-aria="contact.copyAria" aria-label="复制邮箱地址">
|
||
<span class="hero-clone-icon" aria-hidden="true"><svg class="icon-copy" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg><svg class="icon-check" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg></span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
</main>
|
||
|
||
<!-- ───────────────── 底栏 ───────────────── -->
|
||
<footer class="footer">
|
||
<div class="footer-inner">
|
||
<div class="footer-brand">
|
||
<span>Astrion</span>
|
||
</div>
|
||
<nav class="footer-links">
|
||
<a href="https://github.com/JOJO6618/astrion" target="_blank" rel="noopener">GitHub</a>
|
||
<a href="/docs.html" data-i18n="footer.docs">文档</a>
|
||
<a href="#demo" data-i18n="footer.demo">演示</a>
|
||
<button class="lang-toggle" id="langToggle" type="button">English</button>
|
||
</nav>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="/site-assets/astrion-avatar.js"></script>
|
||
<script src="/site-assets/anim-sandbox.js"></script>
|
||
<script src="/site-assets/anim-modes.js"></script>
|
||
<script src="/site-assets/anim-records.js"></script>
|
||
<script src="/site-assets/anim-version.js"></script>
|
||
<script src="/site-assets/i18n.js"></script>
|
||
<script src="/site-assets/site.js"></script>
|
||
</body>
|
||
</html>
|