技能概述
Live Artifact 產生一個項目級別、可預覽嘅 HTML artifact,其數據可以在首次渲染後繼續刷新而無需重新設計展示。
核心概念:Presentation 同 Data 分離。template.html 定義展示,data.json 提供數據,daemon 衍生 index.html。支持 Notion、GitHub、Slack、Google Drive 等 connector。
觸發關鍵字
- live artifact、live dashboard、refreshable dashboard、live report
- refreshable report、synced view、可刷新、實時看板
什麼時候用
- 用戶需要數據支持嘅視圖,且首次渲染後仍然有用
- 實時儀表盤、可刷新報告、同步狀態頁、可審計數據視圖
- 用戶提到 refresh、sync、recurring updates、connector-backed data
使用方法
自然語言觸發
做一個可刷新嘅 dashboard
live artifact from Notion data
synced report
判斷是否需要 Live Artifact
| 用 Live Artifact | 用靜態 Artifact |
|---|---|
| 用戶提到 refresh、sync、recurring updates | 用戶只需要一次性 HTML/mockup |
| Connector 支持數據 | 無刷新需求 |
| 來源 / provenance 追蹤 | 無數據/ provenance 面板需求 |
如果意圖模糊,問一個簡短問題:「Should this be refreshable/live, or just a static artifact?」
工作流程
1. 確定範圍同數據源
- 識別預覽目標、受眾、數據新鮮度期望
- 如果用戶明確命名 connector(Notion、GitHub、Slack),先用 daemon connector tools 檢查
- 優先本地 / 項目數據源或 daemon connector
- 當需要 connector 數據時,先列出已連接嘅 connector
2. 編寫源文件
| 文件 | 說明 |
|---|---|
template.html |
人工設計嘅 HTML 模板 |
data.json |
{{data.path}} 綁定用嘅規範預覽數據 |
artifact.json |
live artifact 元數據、預覽聲明、文檔聲明 |
provenance.json |
來源筆記、時間戳、非敏感 connector 引用 |
3. 保持數據緊湊
- 僅存儲預覽所需嘅規範化值
- 大列表、provider 回應、日誌先摘要再寫入
4. 應用安全規則
- 絕唔存儲憑證、OAuth token、API 密鑰
- 避免禁用鍵名:
raw、rawResponse、payload、body、headers、cookie、authorization、token、secret、credential、password - 僅使用轉義
html_template_v1插值
5. 通過 daemon wrapper 註冊或更新
"$OD_NODE_BIN" "$OD_BIN" tools live-artifacts create --input artifact.json
"$OD_NODE_BIN" "$OD_BIN" tools live-artifacts update --artifact-id "$ARTIFACT_ID" --input artifact.json
必需文件
每個 live artifact 創建流程必須產生:
template.html— 技能輸出同預覽源模板data.json— 緊湊規範預覽數據artifact.json— daemon 驗證用輸入provenance.json— 安全來源同轉換摘要
index.html 係 frontmatter 中聲明嘅主要預覽入口,但係 daemon 衍生輸出,唔係 agent 編寫源。
實際例子
用戶:「做一個可刷新嘅 Notion 項目看板。」
生成結果:
template.html:HTML 模板,用{{data.path}}綁定data.json:從 Notion connector 獲取嘅規範化數據artifact.json:預覽聲明同文檔聲明provenance.json:來源於 Notion API,無敏感數據- 通過 daemon 註冊,
index.html自動衍生