캔버스은(는) 무엇을 하나요?
캔버스를 사용하여 연결된 Mac/iOS/Android 노드에 HTML을 표시합니다.
모델
- 캔버스 호스트는
plugins.entries.canvas.config.host.root에서 파일을 제공합니다. - 캔버스 경로는 Gateway HTTP 포트(
gateway.port, 기본값18789)에 위치합니다. - 노드 브리지는 캔버스 URL을 연결된 노드 앱으로 전송합니다.
- 노드 앱은 WebView에서 URL을 렌더링합니다.
- 호스트 이름은
gateway.bind를 따릅니다: 루프백은 로컬 전용, LAN IP는 LAN용, Tailscale 호스트는 tailnet용이며 최적의 경로를 자동 선택합니다. - Localhost URL은 동일 머신의 노드에서만 작동합니다.
- 페어링된 노드는 일반적으로 노드 범위의
pluginSurfaceUrls.canvas기능 URL을 수신하며, 가능하면 이 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/<file>.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설정과 파일이 루트 아래에 기록되는지 확인하세요.