mirror of
https://github.com/openclaw/openclaw.git
synced 2026-03-12 07:20:45 +00:00
chore: Also format scripts and skills.
This commit is contained in:
@@ -5,6 +5,7 @@ Display HTML content on connected OpenClaw nodes (Mac app, iOS, Android).
|
||||
## Overview
|
||||
|
||||
The canvas tool lets you present web content on any connected node's canvas view. Great for:
|
||||
|
||||
- Displaying games, visualizations, dashboards
|
||||
- Showing generated HTML content
|
||||
- Interactive demos
|
||||
@@ -29,14 +30,15 @@ The canvas tool lets you present web content on any connected node's canvas view
|
||||
|
||||
The canvas host server binds based on `gateway.bind` setting:
|
||||
|
||||
| Bind Mode | Server Binds To | Canvas URL Uses |
|
||||
|-----------|-----------------|-----------------|
|
||||
| `loopback` | 127.0.0.1 | localhost (local only) |
|
||||
| `lan` | LAN interface | LAN IP address |
|
||||
| `tailnet` | Tailscale interface | Tailscale hostname |
|
||||
| `auto` | Best available | Tailscale > LAN > loopback |
|
||||
| Bind Mode | Server Binds To | Canvas URL Uses |
|
||||
| ---------- | ------------------- | -------------------------- |
|
||||
| `loopback` | 127.0.0.1 | localhost (local only) |
|
||||
| `lan` | LAN interface | LAN IP address |
|
||||
| `tailnet` | Tailscale interface | Tailscale hostname |
|
||||
| `auto` | Best available | Tailscale > LAN > loopback |
|
||||
|
||||
**Key insight:** The `canvasHostHostForBridge` is derived from `bridgeHost`. When bound to Tailscale, nodes receive URLs like:
|
||||
|
||||
```
|
||||
http://<tailscale-hostname>:18793/__moltbot__/canvas/<file>.html
|
||||
```
|
||||
@@ -45,13 +47,13 @@ This is why localhost URLs don't work - the node receives the Tailscale hostname
|
||||
|
||||
## Actions
|
||||
|
||||
| Action | Description |
|
||||
|--------|-------------|
|
||||
| `present` | Show canvas with optional target URL |
|
||||
| `hide` | Hide the canvas |
|
||||
| `navigate` | Navigate to a new URL |
|
||||
| `eval` | Execute JavaScript in the canvas |
|
||||
| `snapshot` | Capture screenshot of canvas |
|
||||
| Action | Description |
|
||||
| ---------- | ------------------------------------ |
|
||||
| `present` | Show canvas with optional target URL |
|
||||
| `hide` | Hide the canvas |
|
||||
| `navigate` | Navigate to a new URL |
|
||||
| `eval` | Execute JavaScript in the canvas |
|
||||
| `snapshot` | Capture screenshot of canvas |
|
||||
|
||||
## Configuration
|
||||
|
||||
@@ -74,6 +76,7 @@ In `~/.openclaw/openclaw.json`:
|
||||
### Live Reload
|
||||
|
||||
When `liveReload: true` (default), the canvas host:
|
||||
|
||||
- Watches the root directory for changes (via chokidar)
|
||||
- Injects a WebSocket client into HTML files
|
||||
- Automatically reloads connected canvases when files change
|
||||
@@ -101,15 +104,18 @@ HTML
|
||||
### 2. Find your canvas host URL
|
||||
|
||||
Check how your gateway is bound:
|
||||
|
||||
```bash
|
||||
cat ~/.openclaw/openclaw.json | jq '.gateway.bind'
|
||||
```
|
||||
|
||||
Then construct the URL:
|
||||
|
||||
- **loopback**: `http://127.0.0.1:18793/__moltbot__/canvas/<file>.html`
|
||||
- **lan/tailnet/auto**: `http://<hostname>:18793/__moltbot__/canvas/<file>.html`
|
||||
|
||||
Find your Tailscale hostname:
|
||||
|
||||
```bash
|
||||
tailscale status --json | jq -r '.Self.DNSName' | sed 's/\.$//'
|
||||
```
|
||||
@@ -129,6 +135,7 @@ canvas action:present node:<node-id> target:<full-url>
|
||||
```
|
||||
|
||||
**Example:**
|
||||
|
||||
```
|
||||
canvas action:present node:mac-63599bc4-b54d-4392-9048-b97abd58343a target:http://peters-mac-studio-1.sheep-coho.ts.net:18793/__moltbot__/canvas/snake.html
|
||||
```
|
||||
@@ -148,6 +155,7 @@ canvas action:hide node:<node-id>
|
||||
**Cause:** URL mismatch between server bind and node expectation.
|
||||
|
||||
**Debug steps:**
|
||||
|
||||
1. Check server bind: `cat ~/.openclaw/openclaw.json | jq '.gateway.bind'`
|
||||
2. Check what port canvas is on: `lsof -i :18793`
|
||||
3. Test URL directly: `curl http://<hostname>:18793/__moltbot__/canvas/<file>.html`
|
||||
@@ -165,6 +173,7 @@ Node is offline. Use `openclaw nodes list` to find online nodes.
|
||||
### Content not updating
|
||||
|
||||
If live reload isn't working:
|
||||
|
||||
1. Check `liveReload: true` in config
|
||||
2. Ensure file is in the canvas root directory
|
||||
3. Check for watcher errors in logs
|
||||
|
||||
Reference in New Issue
Block a user