キャンバス は何をしますか？
キャンバスを使用して、接続されたMac/iOS/AndroidノードにHTMLを表示します。
モデル
- キャンバスホストは
plugins.entries.canvas.config.host.rootからファイルを配信します。 - キャンバスルートはGateway HTTPポート（
gateway.port、デフォルト18789）上に配置されます。 - ノードブリッジはキャンバスURLを接続されたノードアプリに送信します。
- ノードアプリはWebViewでURLをレンダリングします。
- ホスト名は
gateway.bindに従います：ループバックの場合はローカルのみ、LANの場合はLAN IP、Tailnetの場合はTailscaleホスト、自動的に最適なルートを選択します。 - localhost URLは同じマシン上のノードでのみ動作します。
- ペアリングされたノードは通常、ノードスコープの
pluginSurfaceUrls.canvas機能URLを受け取ります。可能な限りこれらを優先してください。
設定
アクティブな設定ファイル：$OPENCLAW_CONFIG_PATH または ~/.openclaw/openclaw.json。
{
"plugins": {
"entries": {
"canvas": {
"config": {
"host": {
"enabled": true,
"root": "~/.openclaw/canvas",
"liveReload": true
}
}
}
}
},
"gateway": { "bind": "auto" }
}
アクション
present：キャンバスを表示します。オプションでURLを指定できます。hide：キャンバスを非表示にします。navigate：新しいURLを開きます。eval：現在のキャンバスでJavaScriptを実行します。snapshot：スクリーンショットを取得します。
ワークフロー
- Canvasプラグインのホストが有効になっていることを確認します。
- HTML/CSS/JSファイルを
plugins.entries.canvas.config.host.rootまたはデフォルトのステートキャンバスディレクトリに配置します。 - ターゲットノードから到達可能なルートを使用します。
- ホストされたURLを提示します：
/__openclaw__/canvas/<ファイル>.html。 - ユーザーが証明を必要とする場合は
snapshotを使用します。
URLの形式
http://<gateway-host>:<gateway.port>/__openclaw__/canvas/index.html
http://<gateway-host>:<gateway.port>/__openclaw__/canvas/games/snake.html
パスマッピング：
/__openclaw__/canvas/index.html-><canvas host root>/index.html/__openclaw__/canvas/games/snake.html-><canvas host root>/games/snake.html
トラブルシューティング
- ノードがlocalhostを参照しているがリモートの場合：
gateway.bindまたは公開URLを修正し、URLを再生成します。 - LANノードがロードできない場合：同じネットワーク、ファイアウォール、Gatewayポート、認証/機能URLを確認します。
- Tailnetノードがロードできない場合：Tailscaleのステータスとアドバタイズされたホストを確認します。
- 空白ページ：URLをローカルで開き、ブラウザコンソールを確認してから、ノードのスナップショットを撮ります。
- ライブリロードがない場合：
liveReloadとルート下のファイル書き込みを確認します。