Canvas Skill

• 您希望 AI 代理能夠即時將生成的 HTML 頁面（儀表板、遊戲、視覺化內容）推送至您的 Mac、iPhone 或 Android 裝置。
• 您正在製作互動式 HTML 內容的原型，並需要即時重新載入功能——儲存檔案後，已連接的畫布會自動更新。
• 您需要代理在執行中的 WebView 內遠端執行 JavaScript（例如：不需完整重新載入即可更新圖表資料）。
• 您希望在代理工作流程中擷取已渲染畫布內容的螢幕截圖。

• 您並未使用 OpenClaw 節點——此 Canvas Skill 專為 OpenClaw Mac/iOS/Android 生態系統設計。
• 您需要向公眾或非 Tailscale 對等節點提供內容；此伺服器僅供本機/區域網路/Tailscale 存取使用。
• 您希望嵌入完整瀏覽器或顯示任意外部 URL——canvas 主機僅提供來自已設定本機根目錄的檔案。

五個獨立動作——present、hide、navigate、eval 與 snapshot——讓代理人能對節點上顯示的內容進行精細控制。只需透過單一 Canvas Skill，即可呈現網址、透過導覽切換內容、在不重新載入的情況下執行 JavaScript，或擷取螢幕截圖。

當 liveReload: true（預設值）時，canvas host 會透過 chokidar 監控根目錄，並將 WebSocket 客戶端注入至 HTML 檔案中。儲存任何檔案後，已連線的畫布會立即重新整理，讓迭代式 HTML 生成更加迅速。

HTTP 伺服器可以綁定至回送介面、區域網路介面、Tailscale 介面，或自動選擇。正確的主機名稱會透過橋接器自動轉發至各節點，因此無論網路拓撲為何，內容均可正常載入。

eval 動作允許代理在即時畫布 WebView 中執行任意 JavaScript。這使得動態更新成為可能——例如將新資料推送至圖表、觸發動畫，或讀取 DOM 狀態——而無需導航至新頁面。

snapshot 動作會擷取指定節點上當前畫布的螢幕截圖，並將其回傳給代理程式，以便對已渲染的內容進行視覺檢查或記錄。

代理程式會生成一個 HTML 儀表板，彙整各類數據（例如銷售指標、系統狀態），並將其寫入 ~/clawd/canvas/dashboard.html。接著呼叫 canvas action:present，指定您的 Mac 節點，儀表板便會立即顯示於 Canvas Skill 的畫布檢視中。

將一個自含式 HTML5 遊戲放入畫布根節點，然後讓代理在已連接的 iPhone 節點上呈現它。代理之後可以呼叫 hide 或切換至其他示範，無需在裝置上進行任何手動操作。

先呈現一個圖表頁面，然後使用重複的 eval 動作將新的資料點推送到執行中的 JavaScript 環境。圖表會即時更新，無需重新載入頁面，適合用於監控或即時代理輸出。

在開發過程中，將畫布保持開啟於已連接的節點上，並在畫布根目錄中編輯 HTML 檔案。每次儲存都會觸發自動重載，無需手動重新整理或重新執行指令，即可獲得即時的視覺回饋。